【移动应用开发】界面设计（二）实现水果列表页面

续上一篇博客

【移动应用开发】界面设计（一）实现登录页面-CSDN博客

目录

一、采用ViewBinding实现一个RecyclerView

1.1 在app/build.gradle中添加recyclerview依赖，并打开viewBinding

（1）在app/build.gradle中添加依赖

（2）在app/build.gradle中打开viewBinding功能

（3）点击同步Sync，同步项目

1.2 在layout目录下创建一个fruit_item.xml

（1）设置为LinearLayout

（2）插入ImageView

（3）插入TextView

1.3 修改activity_main.xml

（1）将布局改为LinearLayout

（2）插入RecyclerView控件

1.4 新建一个命名为Fruit的类

（1）Fruit类

（2）Kotlin类

1.5 新建一个名为FruitAdapter的适配器类

（1）同理，新建一个类文件，命名为FruitAdapter

（2）重写onCreateViewHolder、onBindViewHolder和getItemCount方法

1.6 修改MainActivity类

（1）新增一个私有val变量fruitList

（2）新增一个私有var变量binding

（3）修改onCreate()方法

（4）新建私有方法initFruits()

（5）修改onCreate()方法

（6）创建一个layoutManager

（7）创建一个adapter

1.7 实现点击事件

（1）修改MainActivity类

（2）运行截图

二、心得体会

2.1 如需加入RecyclerView控件，需要对工程环境做何种配置？

（1）在build.grade文件中导入依赖

（2） 如果想用视图绑定模式，同样在build.grade文件中设置

2.2 设计一个RecyclerView，其中每一个item是否需要一个自定义布局？在实验中该自定义布局是哪个文件？对应的，是否需要一个实体类？布局的控件和实体类的字段是否需要对应？

2.3 为RecyclerView创建一个Fruit适配器，创建一个内置类ViewHolder，是怎样获取自定义布局中的实例？

2.4 如何对ViewHolder中的实例进行数据绑定的？

2.5 如何在Activity中对RecyclerView的布局方式进行设置？

2.6 如何在Activity中对RecyclerView的适配器绑定为Fruit适配器？

2.7 如何打开ViewBinding功能？

2.8 如果在Activity的布局中有一个按钮，我们应如何在onCreate中添加按钮的点击监听事件？

2.9 在RecyclerView的Adapter中，我们可以在ViewHolder内置类中传入item布局的binding。

---

一、采用ViewBinding实现一个RecyclerView

1.1 在app/build.gradle中添加recyclerview依赖，并打开viewBinding

（1）在app/build.gradle中添加依赖

其中版本号1.x.0将会自动更新。

（2）在app/build.gradle中打开viewBinding功能

在android字段下将viewBinding设置为true

（3）点击同步Sync，同步项目

1.2 在layout目录下创建一个fruit_item.xml

（1）设置为LinearLayout

宽度为match_parent

高度为80dp

layout_margin设为5dp

（2）插入ImageView

id为fruitImage

宽和高均为40dp

layout_gravity为center_vertical

marginLeft为10dp

（3）插入TextView

id为fruitName

宽和高均为wrap_content

layout_gravity为center_vertical

marginLeft为10dp

1.3 修改activity_main.xml

（1）将布局改为LinearLayout

宽和高match_parent

orientation设为vertical

（2）插入RecyclerView控件

androidx.recyclerview.widget.RecyclerView

宽度高度均设为match_parent

id为recyclerView

1.4 新建一个命名为Fruit的类

（1）Fruit类

在app/src/main/java/com.example.recyclerviewtest下右键newàKotlin Class/File

（2）Kotlin类

（以下使用Kotlin来编写）

1.5 新建一个名为FruitAdapter的适配器类

（1）同理，新建一个类文件，命名为FruitAdapter

该类传入参数fruitList，约束为一个列表类型List<Ranking>，继承RecylcerView.Adapter。

定义一个内置类，传入一个FruitItemBinding的binding绑定，

加入两个变量fruitImage和fruitName，并绑定为FuitItemBinding的fruitImage和fruitName

（2）重写onCreateViewHolder、onBindViewHolder和getItemCount方法

onCreateViewHolder将fruit_item的绑定类FruitItemBinding展开，然后新建ViewHolder并传回；

onBindViewHolder将ViewHolder的两个变量fruitImage和fruiteName进行数据绑定。

1.6 修改MainActivity类

（1）新增一个私有val变量fruitList

类型为ArrayList<Fruit>

（2）新增一个私有var变量binding

设置为稍后初始化，绑定为ActivityMainBinding，用于调用activity_main.xml对应的Binding类

（3）修改onCreate()方法

将ActivityMainBinding传入binding，然后用binding.root来设置ContentView

（4）新建私有方法initFruits()

新增fruitList的列项，将水果名以及对应的图片添加进去

（5）修改onCreate()方法

使用initFruits()方法进行fruitList的初始化

（6）创建一个layoutManager

传入binding.recyclerView.layoutManager中

（7）创建一个adapter

传入binding.recyclerView.adapter中

1.7 实现点击事件

（1）修改MainActivity类

在FruitAdapteronCreateViewHolder中，打开viewHolder中的控件监听事件

viewHolder.itemView.setOnClickListener{};

在监听事件中，取得点击位置

val position = viewHolder. bindingAdapterPosition

在监听事件中，实现Toast功能，注意判断位置是否为空

（2）运行截图

点击Pear，显示成功

鼠标往下滑，页面实现滚动，点击最后一个水果，成功弹窗对应水果名称。

二、心得体会

2.1 如需加入RecyclerView控件，需要对工程环境做何种配置？

（1）在build.grade文件中导入依赖

（2） 如果想用视图绑定模式，同样在build.grade文件中设置

2.2 设计一个RecyclerView，其中每一个item是否需要一个自定义布局？在实验中该自定义布局是哪个文件？对应的，是否需要一个实体类？布局的控件和实体类的字段是否需要对应？

（1）其中每一个item都有对应的自定义布局，根据不同的业务需求显示不同的效果；

（2）本实验对应的自定义布局是fruit_item.xml；

（3）一般需要一个实体类去维护每个item的信息，封装成对象，作为适配器的适配类型，便于开发，同时含义也更清晰；

（4）布局的控件和实体类的字段不需要对应，在操作的时候我们是手动设置的

2.3 为RecyclerView创建一个Fruit适配器，创建一个内置类ViewHolder，是怎样获取自定义布局中的实例？

每一个item对应着一个ViewHolder，而每一个ViewHolder对应着item.xml文件中的组件。

当页面刚加载或者上下滚动的时候 会调用onCreateViewHolder方法。而该方法返回了ViewHolder对象。然后调用onBindViewHolder方法，我们在里面根据数据位置与当前item的viewholder设置了对应的值，然后就可以对应上了。

2.4 如何对ViewHolder中的实例进行数据绑定的？

当获取完viewHolder之后会去调用onBindViewHolder方法，在这个方法里面根数当前item的viewholder设置了对应的值，这样就可以对应上了。

2.5 如何在Activity中对RecyclerView的布局方式进行设置？

（1）动态载入布局文件，由于MainActivity与activity_layout.xml是对应的，首先要获取xml文件对象，然后通过inflate进行实例化

（2）设置布局管理器

2.6 如何在Activity中对RecyclerView的适配器绑定为Fruit适配器？

直接实例化一个对象并将它设置为适配器即可。

2.7 如何打开ViewBinding功能？

在项目工程模块的build.gradle中加入以下配置

2.8 如果在Activity的布局中有一个按钮，我们应如何在onCreate中添加按钮的点击监听事件？

（1）在 Activity 中进行延迟初始化的 binding。首先，确保在 build.gradle 文件中启用 viewBinding 选项，然后在 Activity 的类中声明一个成员变量来持有生成的绑定类实例。

（2）在 onCreate 方法中进行绑定初始化：

（3）设置布局管理器，在这里可以设置布局

（4）添加按钮的点击监听事件：一旦布局文件中的按钮被加载，可以直接通过 binding 对象引用该按钮，并为其添加点击监听事件

2.9 在RecyclerView的Adapter中，我们可以在ViewHolder内置类中传入item布局的binding。

由于是动态创建，所以pojo类对应着数据；而viewholder对应着布局中的组件。