App门户页面设计与开发2

目录

一、项目内容介绍

二、布局介绍

三、核心代码和功能介绍

1、Fragment2.java

2、Adapter.java

3.、Activity.java

四、实验总结

五、源码地址

---

一、项目内容介绍

根据第一次作业的源码基础，在列表页上点击跳转到另一详情页面；

二、布局介绍

设计点击跳转的界面Activity

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".Activity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="121dp"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/imageView5"
                android:layout_width="190dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:src="@drawable/page2" />

            <TextView
                android:id="@+id/name"
                android:layout_width="326dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:gravity="center"
                android:text="TextView"
                android:textSize="30dp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="108dp"
            android:orientation="horizontal">

            <TextView
                android:id="@+id/textView7"
                android:layout_width="141dp"
                android:layout_height="108dp"
                android:layout_weight="1"
                android:gravity="center"
                android:text="电话号码"
                android:textSize="30dp" />

            <TextView
                android:id="@+id/phone"
                android:layout_width="268dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:gravity="center"
                android:text="TextView"
                android:textSize="30dp" />

        </LinearLayout>

        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:text="返回" />
    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

界面效果如下：

三、核心代码和功能介绍

1、Fragment2.java

修改Fragment2中的onCreatew方法，实现自己所需要的布局设计

   public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View view;

        // Inflate the layout for this fragment
        //存储所有控件的视图
        view =inflater.inflate(R.layout.fragment2, container, false);
        //调用recyclerView控件
        recyclerView = view.findViewById(R.id.recyclerView);

        //创建数据
        String[] names={"爸爸","妈妈","姐姐","弟弟","哥哥","妹妹"};
        String[] phones={"13420827777","13423459999","18920203433","13712930000","13611119898", "17238389999"};
        int[] images={R.drawable.baba,R.drawable.mama,R.drawable.jiejie,R.drawable.didi,R.drawable.gege,R.drawable.meimei};


        //循环获取数组中的数据
        List<Map<String,Object>> items=new ArrayList<Map<String,Object>>();
        for(int i=0;i<names.length;i++){
            Map<String,Object> item=new HashMap<String, Object>();
            item.put("i_name",names[i]);
            item.put("i_image",images[i]);
            item.put("i_phone",phones[i]);
            items.add(item);
        }

 //创建RecycleView实例和设置Adapter
        Context context=getContext();
        myadapeter = new MyAdapeter(items, context);
        recyclerView.setAdapter(myadapeter);
        LinearLayoutManager manager = new LinearLayoutManager(context);
        manager.setOrientation(RecyclerView.VERTICAL);
        recyclerView.setLayoutManager(manager);
        return view;
    }
}

2、Adapter.java

主要修改onBindViewHolder方法，添加布局中所需要的元素。

 public void onBindViewHolder(@NonNull Myholder holder, int position) {
        String name=list1.get(position).get("i_name").toString();
        String phone=list1.get(position).get("i_phone").toString();
        int image=Integer.parseInt(list1.get(position).get("i_image").toString());
        //将数据显示到列表中
        holder.textView.setText(name);
        holder.imageView.setImageResource(image);
        //添加点击事件
        holder.textView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //点击后跳转到联系人详情页
                Intent intent=new Intent(context1,Activity.class);
                intent.putExtra("name",name);
                intent.putExtra("image",image);
                intent.putExtra("phone",phone);
                intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
                context1.startActivity(intent);
            }
        });
    }

在新建类MyHolder类的构造函数中添加构件

public Myholder(@NonNull View itemView) { //调用父类构造函数
            super(itemView);
            //获取控件id
            textView = itemView.findViewById(R.id.textView21);
            imageView=itemView.findViewById(R.id.imageView);
        }

3.、Activity.java

该界面显示跳转页面，通过intent获取信息，实现界面跳转。

public class Activity extends AppCompatActivity {
    TextView textView1,textView2;
    Button button;
    ImageView imageView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity);

        //获取从上个Activity中传过来的intent
        Intent intent=getIntent();
        textView1=findViewById(R.id.name);
        textView2=findViewById(R.id.phone);
        //根据intent获取得到的数据设置item控件的值
        textView1.setText(intent.getStringExtra("name"));
        textView2.setText(intent.getStringExtra("phone"));
        button=findViewById(R.id.button3);
        imageView=findViewById(R.id.imageView5);
        imageView.setImageResource(intent.getIntExtra("image",R.drawable.baba));

        //设置点击回传按钮，回到联系人界面
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intent = new Intent();
                intent.putExtra("data_return", "返回的数据");
                setResult(RESULT_OK, intent);
                finish();
            }
        });
    }
}

效果如下：

屏幕录制 2023-10-29 133756

四、实验总结

本次实验我学会了界面之间的跳转，intent 是一个消息传递对象，可以用来从其他应用组件请求操作。Activity 表示应用中的一个屏幕。通过将 Intent 传递给 startActivity()，可以启动新的 Activity 来展示详情页面。

一、点击事件
点击事件内部类中，给按钮设置事件监听，setOnClickListener（）指定监听对象，实现OnClickListener接口，并实现接口中的方法。

二、intent的使用
Intent:来协助应用间的交互与通讯,Android则根据此Intent的描述，找到对应的组件，将 Intent传递给调用的组件，并完成组件的调用。
 

五、源码地址

an: as