Android开发-代号鸢主题类微信界面设计

本文链接：https://blog.csdn.net/Bat174049/article/details/143837290

一、实现效果图

二、功能说明

本次实验主要是做一个类微信界面，因此最重要的功能就是跳转功能，我们需要实现：

1.点击下方的微信、通讯录、发现和我四栏跳转到对应的界面

2.在第三部分发现部分，需要点击刘辩、袁基、孙策、左慈和傅融五栏可以跳转到对应的个人简介界面

三、功能实现

1.recyclerview实现列表创建

对于第三部分的跳转到不同的个人简介，主要涉及的xml是fragment3.xml

我们需要用到构建recyclerview来进行创建列表

recyclerview

RecyclerView 是 Android 提供的一个高级视图组件，用于高效展示大数据量的列表或网格，同时支持动态加载、可扩展性和灵活的自定义布局。它通过 ViewHolder 模式优化性能，减少不必要的视图创建和绑定，并支持强大的功能如动画效果、分割线、自定义布局管理器（如线性布局、网格布局、瀑布流等）。相比 ListView，RecyclerView 提供了更高的灵活性和更强的性能优势，是构建复杂、高效 UI 列表的首选工具。

recyclerview是创建一个总的列表，接下来我们用item_layout.xml创建列表里面的每一项的格式

我们设置头像、姓名和按钮介绍三个部分，当我们点击行之后会跳出个人的详解介绍界面

顺其自然的，我们对个人详细介绍界面进行设计，例：liubia.xml

个人详情界面由头像，姓名，简介和半身照组成

2.数据连接

当我们创建item之后，我们需要通过数据源fragment3.java来向列表进行传输

list = new ArrayList<>();

创建一个列表，然后接下来使用for循环将头像、姓名、简介数据传输进去

for (int i = 0; i < names.length; i++) {
            Map<String, Object> map = new HashMap<>();
            map.put("avatar", avatars[i]);
            map.put("name", names[i]);
            map.put("bio", bios[i]);
            list.add(map);
}

之后需要通过adapter将数据导入进列表进行绑定

adapter

Adapter 是 Android 中用于连接数据源与视图组件（如 RecyclerView）的桥梁，负责将数据绑定到视图并控制视图的展示形式。

通过onBindViewHolder方法把数据集中的数据绑定到控件中。

1.数据绑定

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        Map<String, Object> item = list.get(position);
        holder.avatar.setImageResource((int) item.get("avatar"));
        holder.name.setText((String) item.get("name"));
        holder.bio.setText((String) item.get("bio"));


    }

根据不同的位置，avatar、name和bio将分别获得不同的值

2.进行跳转

当点击不同位置的时候就会跳转到对应的详情界面

        // 设置点击事件
        holder.itemView.setOnClickListener(v -> {
            // 根据不同的男主跳转到相应的详情页面
            Intent intent = new Intent(context, getDetailActivity(position));
            context.startActivity(intent);
        });

这里有一个intent类我们可以着重介绍一下

intent

Intent是 Android 系统中用于组件间通信和操作的一种重要工具，主要作用包括以下几个方面：

1. 启动组件：
- 用于启动 Activity：可以在不同的界面之间导航。
- 用于启动 Service：在后台执行操作，如播放音乐或下载文件。

2. 传递数据：
- 使用 `putExtra` 方法附加数据（如字符串、整数、对象等）到 Intent 中，并通过 `getExtra` 方法在目标组件中接收。
- 适用于界面切换时传递参数或跨组件共享数据。

3. 触发系统功能：
- 使用隐式 Intent 调用系统功能，例如拨打电话 (`ACTION_DIAL`)、发送短信 (`ACTION_SEND`)、打开网页 (`ACTION_VIEW`) 等。

4. 广播信息：
- 通过广播机制 (`sendBroadcast` 等) 通知应用中的其他部分特定的事件（如电量变化或网络状态改变）。

5. 明确或隐式指向目标组件：
- 显式 Intent：指定目标组件的类名（如 `new Intent(context, TargetActivity.class)`）。
- 隐式 Intent：根据动作类型和数据内容由系统匹配合适的组件（如通过 MIME 类型匹配应用）。

6. 与其他应用交互：
- Intent 支持跨应用调用，例如分享内容到社交媒体应用或调用地图导航应用。

7. 携带返回结果：
- 使用 `startActivityForResult` 方法启动目标组件，目标组件可以通过 Intent 返回处理结果。

上图使用的是第一个功能。

1.启动组件，点击不同行时跳转到对应的详情界面

Intent intent = new Intent(context, getDetailActivity(position));

2.数据传送，把头像、姓名、简介等数据放到intent对象中

        holder.avatar.setImageResource((int) item.get("avatar"));
        holder.name.setText((String) item.get("name"));
        holder.bio.setText((String) item.get("bio"));

3.跳转至对应界面

private Class<?> getDetailActivity(int position) {
        // 根据 position 返回不同的 Activity 类
        switch (position) {
            case 0:
                return liubian.class;  
            case 1:
                return yuanji.class;  
            case 2:
                return zuoci.class;   
            case 3:
                return furong.class;   
            case 4:
                return sunce.class;   
            default:
                return null;
        }
    }

因此需要进行一些绑定工作：

1.通过findviewbyid和相关控件进行绑定

 public ViewHolder(View itemView) {
            super(itemView);
            avatar = itemView.findViewById(R.id.avatar);
            name = itemView.findViewById(R.id.name);
            bio = itemView.findViewById(R.id.bio);

2.与xml文件进行绑定

        super.onCreate(savedInstanceState);
        EdgeToEdge.enable(this);
        setContentView(R.layout.activity_fragment_main);

3.与具体的控件进行绑定

        layout1=findViewById(R.id.bottom_layout1);
        layout2=findViewById(R.id.bottom_layout2);
        layout3=findViewById(R.id.bottom_layout3);
        layout4=findViewById(R.id.bottom_layout4);

最后，项目链接放在文章末尾，有想要下载研究的朋友请自取，希望能得到一键三连~

问题总结：

Q：为什么在layout_bottom部分图像设置了但是启动后无法显示？

A：上下都需要设置