RecyclerView使用简述
前言
RecyclerView是Android中非常受欢迎的控件,RecyclerView是官方在Android5.0之后新添加的控件,推出用来替代传统的ListView和GridView列表控件,所以如果你还在使用ListView的话可以替换为RecyclerView了。
正文
对于RecyclerView的使用根据实际项目进行说明,一些功能可能是你现在正在做的,对你有帮助也说不定。
一、创建项目
创建一个名为RecyclerViewDemo的Android项目。注意Android Studio的版本使用4.2.1以上或者最新的版本。
点击Finish完成项目创建,然后等待项目构建完成,在之前的Android中RecyclerView是需要引入依赖库的,会有v4,v7版本的库,而现在都迁移到androidx下了,目前在项目构建的时候也会自动添加这个material库,里面拥有很多的控件,当然也包括RecyclerView。
下面我们首先配置一下app下的build.gradle,在android{}闭包里面添加ViewBinding和DataBinding的启用,代码如下:
buildFeatures {
viewBinding true
dataBinding true
}
配置完之后记得Sync Now点击一下,其他的就没有什么需要配置了,现在就开始使用RecyclerView了,为了方便演示一些,我需要先创建一个基类,在com.llw.recyclerviewdemo包下新建一个BasicActivity,里面的代码如下:
public class BasicActivity extends AppCompatActivity {
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
protected void back(MaterialToolbar toolbar) {
toolbar.setNavigationOnClickListener(v -> onBackPressed());
}
protected void jumpActivity(final Class<?> clazz) {
startActivity(new Intent(this, clazz));
}
protected void showMsg(CharSequence msg) {
Toast.makeText(this, msg, Toast.LENGTH_SHORT).show();
}
/**
* 获取字符串列表
*/
protected List<String> getStrings() {
List<String> lists = new ArrayList<>();
int num = (int) (1 + Math.random() * (50 - 10 + 1));
for (int i = 0; i < num; i++) {
lists.add("第 " + i + " 条数据");
}
return lists;
}
protected List<BasicBean> getBasicBeans() {
List<BasicBean> lists = new ArrayList<>();
int num = (int) (1 + Math.random() * (50 - 10 + 1));
for (int i = 0; i < num; i++) {
lists.add(new BasicBean("第 " + i + " 条标题","第 " + i + " 条内容"));
}
return lists;
}
}
也没有什么很复杂的代码,就是为了方便子类的时候,后面你就会明白为什么这么做了,这里有一个BasicBean类,一个简单的实体类,在com.llw.recyclerviewdemo下新建一个bean包,包下新建BasicBean类,代码如下:
public class BasicBean {
private String title;
private String content;
public BasicBean(String title, String content) {
this.title = title;
this.content = content;
}
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
public String getContent() {
return content;
}
public void setContent(String content) {
this.content = content;
}
}
那么现在我们的基本工作就做好了,最后把系统默认的ActionBar去掉,如下图所示改动就好了。
下面要做的就是显示一个基本的RecyclerView,因为除了基本使用还有其他的使用方式,我们现在只有一个MainActivity,可以作为其他使用方式的入口,所以我们先修改一下activity_main.xml布局代码,如下所示:
<?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=".MainActivity">
<com.google.android.material.appbar.MaterialToolbar
android:id="@+id/materialToolbar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:title="RecyclerView使用说明"
app:titleTextColor="@color/white" />
<Button
android:id="@+id/btn_rv_basic_use"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="6dp"
android:layout_marginEnd="16dp"
android:text="RecyclerView基本使用"
android:textAllCaps="false"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/materialToolbar" />
</androidx.constraintlayout.widget.ConstraintLayout>
这里只是添加了一个Toolbar和一个按钮,然后修改MainActivity中的代码,如下所示:
public class MainActivity extends BasicActivity {
private ActivityMainBinding binding;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
binding = ActivityMainBinding.inflate(getLayoutInflater());
setContentView(binding.getRoot());
binding.btnRvBasicUse.setOnClickListener(v ->
jumpActivity(RvBasicUseActivity.class));
}
}
在com.llw.recyclerviewdemo下创建一个RvBasicUseActivity,对应的布局activity_rv_basic_use.xml,下面我们进入RecyclerView基本使用环节。
二、RecyclerView基本使用
首先我们修改一下activity_rv_basic_use.xml中的代码,如下所示:
<?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=".RvBasicUseActivity">
<com.google.android.material.appbar.MaterialToolbar
android:id="@+id/materialToolbar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navigationIcon="@drawable/ic_back"
app:title="RecyclerView基本使用"
app:titleTextColor="@color/white" />
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rv_text"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/materialToolbar" />
</androidx.constraintlayout.widget.ConstraintLayout>
布局内容很简单,就是toolbar 和 RecyclerView,这里的toolbar中用到一个图标,用于Toolbar点击返回,在drawable文件夹下新建一个ic_back.xml,代码如下:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:autoMirrored="true"
android:tint="@color/white"
android:viewportWidth="24.0"
android:viewportHeight="24.0">
<path
android:fillColor="@android:color/white"
android:pathData="M19,11H7.83l4.88,-4.88c0.39,-0.39 0.39,-1.03 0,-1.42l0,0c-0.39,-0.39 -1.02,-0.39 -1.41,0l-6.59,6.59c-0.39,0.39 -0.39,1.02 0,1.41l6.59,6.59c0.39,0.39 1.02,0.39 1.41,0l0,0c0.39,-0.39 0.39,-1.02 0,-1.41L7.83,13H19c0.55,0 1,-0.45 1,-1l0,0C20,11.45 19.55,11 19,11z" />
</vector>
这里我打算做一个列表,那么需要一个列表item的布局,然后就是通过适配器去渲染item布局的内容。
① item布局和适配器
在layout文件夹下新建一个item_text_rv.xml文件,里面的代码如下:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/tv_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:foreground="?attr/selectableItemBackground"
android:background="@color/white"
android:padding="16dp"
android:textColor="@color/black" />
很简单,就一个TextView,显示一下文本即可,下面我们来创建一个适配器,首先在com.llw.recyclerviewdemo包下新建一个adapter包,包下新建一个StringAdapter类,代码如下:
public class StringAdapter extends RecyclerView.Adapter<StringAdapter.ViewHolder> {
@NonNull
@Override
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
return null;
}
@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
}
@Override
public int getItemCount() {
return 0;
}
public static class ViewHolder extends RecyclerView.ViewHolder {
public ViewHolder(@NonNull View itemView) {
super(itemView);
}
}
}
这应该数据标准的模板了,下面说一下这个适配器是怎么渲染数据的,首先执行的是onCreateViewHolder,意思很明显创建一个视图,这里需要返回一个ViewHolder,注意到这里我们有一个静态内部类ViewHolder ,继承自RecyclerView.ViewHolder,重写里面的ViewHolder构造方法,获取一个Item的视图View,创建完成之后就是绑定视图,执行onBindViewHolder,绑定时就会渲染视图View,最后执行getItemCount,你可以得到有多少个Item视图。每渲染一个item就会执行一轮。
这个适配器还需要完善,首先要有数据,数据怎么来呢?可以通过类构造方法,在StringAdapter中创建一个变量,然后写一个构造方法,代码如下所示:
private List<String> lists;
public StringAdapter(List<String> lists) {
this.lists = lists;
}
然后我们修改onCreateViewHolder中的内容,代码如下:
@NonNull
@Override
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_text_rv, parent, false);
return new ViewHolder(view);
}
这里通过LayoutInflater得到item_text_rv的视图View,注意inflate方法传入的三个参数,其中第二个很多人使用的是null,而我这里用的是parent,如果用null会使你的item视图自适应大小,哪怕你设置了match_parent也不行,你可以试试看,得到view之后,通过new ViewHolder(view)的方式创建了一个ViewHolder。
下面是获取item布局中的控件,修改一下内部类ViewHolder中的代码,如下所示:
public static class ViewHolder extends RecyclerView.ViewHolder {
public TextView tvText;
public ViewHolder(@NonNull View itemView) {
super(itemView);
tvText = itemView.findViewById(R.id.tv_text);
}
}
这里的方式就和之前在Activity中有一些类似,通过findViewById找到控件获取实例。然后进入到onBindViewHolder,代码如下:
@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
holder.tvText.setText(lists.get(position));
}
在这个回调里面渲染视图,这里通过holder得到里面的tvText,然后设置TextView的文字内容,这里可以通过position获取当前的视图位置,也就是数据下标,lists.get(position)就得到当前这个下标所需要渲染到视图的具体数据,最后在getItemCount()回调中,返回数据的长度即可,代码如下:
@Override
public int getItemCount() {
return lists.size();
}
那么适配器的渲染就到此为止了,下面怎么让这个适配器生效呢?
② 显示数据
修改RvBasicUseActivity中的代码,如下所示:
public class RvBasicUseActivity extends BasicActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_rv_basic_use);
initView();
}
private void initView() {
MaterialToolbar toolbar = findViewById(R.id.materialToolbar);
RecyclerView rvText = findViewById(R.id.rv_text);
back(toolbar);
//获取适配器实例
StringAdapter stringAdapter = new StringAdapter(getStrings());
//配置适配器
rvText.setAdapter(stringAdapter);
//配置布局管理器
rvText.setLayoutManager(new LinearLayoutManager(this));
}
}
这里使用了最原始的方式,在onCreate()执行时会调用initView(),initView()方法中,采用findViewById获取toolbar和RecyclerView的实例,然后设置返回事件,之后就是new StringAdapter(getStrings())的方式得到一个stringAdapter ,再设置到RecyclerView中,最后设置布局管理器,这决定你的RecyclerView的内容是如何滚动的,默认是纵向的,也就是上下滑动。
现在运行一下吧。
OK,显示数据没有问题。
③ 添加Item点击事件
现在我们得到了数据,那么怎么通过点击item,显示该条item的数据呢?首先我们定义一个接口,在com.llw.recyclerviewdemo包下新建一个OnItemClickListener接口,代码如下:
public interface OnItemClickListener {
void onItemClick(View view, int position);
}
下面回到StringAdapter中,添加如下代码:
private OnItemClickListener listener;
public void setOnItemClickListener(OnItemClickListener listener) {
this.listener = listener;
}
然后修改onCreateViewHolder()方法中的内容,代码如下:
@NonNull
@Override
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_text_rv, parent, false);
ViewHolder viewHolder = new ViewHolder(view);
view.setOnClickListener(v -> {
if(listener != null){
listener.onItemClick(v, viewHolder.getAdapterPosition());
}
});
return viewHolder;
}
就是给view添加点击事件,然后通过viewHolder得到当前位置,设置回调接口。下面我们在RvBasicUseActivity中使用点击事件,而实现监听有两种方式,先看第一种:
public class RvBasicUseActivity extends BasicActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_rv_basic_use);
initView();
}
private void initView() {
MaterialToolbar toolbar = findViewById(R.id.materialToolbar);
RecyclerView rvText = findViewById(R.id.rv_text);
back(toolbar);
List<String> strings = getStrings();
//获取适配器实例
StringAdapter stringAdapter = new StringAdapter(strings);
stringAdapter.setOnItemClickListener((view, position) -> showMsg(strings.get(position)));
//配置适配器
rvText.setAdapter(stringAdapter);
//配置布局管理器
rvText.setLayoutManager(new LinearLayoutManager(this));
}
}
这种方式就是直接通过匿名接口形式使用,核心就是
stringAdapter.setOnItemClickListener((view, position) -> showMsg(strings.get(position)));
这是通过Lambda简化之后的,原始的是这样。
stringAdapter.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(View view, int position) {
showMsg(strings.get(position));
}
});
第二种方式如下所示:
public class RvBasicUseActivity extends BasicActivity implements OnItemClickListener {
private List<String> strings;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_rv_basic_use);
initView();
}
private void initView() {
MaterialToolbar toolbar = findViewById(R.id.materialToolbar);
RecyclerView rvText = findViewById(R.id.rv_text);
back(toolbar);
strings = getStrings();
//获取适配器实例
StringAdapter stringAdapter = new StringAdapter(strings);
stringAdapter.setOnItemClickListener(this);
//配置适配器
rvText.setAdapter(stringAdapter);
//配置布局管理器
rvText.setLayoutManager(new LinearLayoutManager(this));
}
@Override
public void onItemClick(View view, int position) {
showMsg(strings.get(position));
}
}
这里通过具名接口的方式进行实现,可以更直观。
这两种方式都行,看个人喜好,取其一使用即可,这里我使用的是第一种方式,因为简洁,运行看看效果。
④ 添加Item子控件点击事件
如果要添加子控件的话,首先要有子控件才行,修改一下item_text_rv.xml,代码如下:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:background="@color/white"
android:gravity="center_vertical"
android:foreground="?attr/selectableItemBackground"
android:orientation="horizontal"
android:padding="16dp">
<TextView
android:id="@+id/tv_text"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textColor="@color/black" />
<Button
android:id="@+id/btn_test"
android:text="按钮"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
这里我们把按钮作为子控件进行点击操作,然后定义一个接口,在listener包下新建一个OnItemChildClickListener接口,代码如下:
public interface OnItemChildClickListener {
void onItemChildClick(View view, int position);
}
下面回到StringAdapter中,添加代码,如下所示:
private OnItemChildClickListener childClickListener;
public void setOnItemChildClickListener(OnItemChildClickListener childClickListener) {
this.childClickListener = childClickListener;
}
然后修改onCreateViewHolder方法,添加代码如下:
//添加子控件点击事件
view.findViewById(R.id.btn_test).setOnClickListener(v -> {
if (childClickListener != null) {
childClickListener.onItemChildClick(v, viewHolder.getAdapterPosition());
}
});
添加位置如下图所示:
好了,回到RvBasicUseActivity中,在initView()方法中添加如下代码:
//设置适配器Item子控件点击事件
stringAdapter.setOnItemChildClickListener((view, position) -> showMsg(strings.get(position) + "的按钮"));
添加位置如下图所示:
就是依葫芦画瓢,下面我们演示一下。
⑤ 添加长按事件
除了事件处理不同,其他都差不多,因此Item长按和Item子控件长按事件我就一起写了,这里需要创建接口,在listener包下新建一个OnItemLongClickListener 接口,代码如下:
public interface OnItemLongClickListener {
boolean onItemLongClick(View view, int position);
}
在listener包下新建一个OnItemChildLongClickListener 接口,代码如下:
public interface OnItemChildLongClickListener {
boolean onItemChildLongClick(View view, int position);
}
下面进入StringAdapter,在onCreateViewHolder中添加如下代码:
view.setOnLongClickListener(v -> {
if (longClickListener != null) {
return longClickListener.onItemLongClick(v, viewHolder.getAdapterPosition());
}
return false;
});
view.findViewById(R.id.btn_test).setOnLongClickListener(v -> {
if (childLongClickListener != null) {
return childLongClickListener.onItemChildLongClick(v, viewHolder.getAdapterPosition());
}
return false;
});
添加位置如下图所示
现在onCreateViewHolder中的代码就有一些臃肿了,我们最好不要这样做,所以我们需要将刚才所添加的事件抽离到一个方法里面,这个方法专门用来处理view的事件,在StringAdapter中新增一个handlerEvents方法,代码如下:
private void handlerEvents(View view, ViewHolder viewHolder) {
//添加视图点击事件
view.setOnClickListener(v -> {
if (listener != null) {
listener.onItemClick(v, viewHolder.getAdapterPosition());
}
});
//添加子控件点击事件
view.findViewById(R.id.btn_test).setOnClickListener(v -> {
if (childClickListener != null) {
childClickListener.onItemChildClick(v, viewHolder.getAdapterPosition());
}
});
//添加视图长按事件
view.setOnLongClickListener(v -> {
if (longClickListener != null) {
return longClickListener.onItemLongClick(v, viewHolder.getAdapterPosition());
}
return false;
});
//添加视图子控件长按事件
view.findViewById(R.id.btn_test).setOnLongClickListener(v -> {
if (childLongClickListener != null) {
return childLongClickListener.onItemChildLongClick(v, viewHolder.getAdapterPosition());
}
return false;
});
}
然后我们在onCreateViewHolder()方法中调用handlerEvents()方法即可,修改onCreateViewHolder()方法代码,如下所示:
@NonNull
@Override
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_text_rv, parent, false);
ViewHolder viewHolder = new ViewHolder(view);
handlerEvents(view, viewHolder);
return viewHolder;
}
你是否注意到长按事件有一个返回值,boolean类型,如果回调消耗了长按,则为 true,否则为 false。怎么理解这句话呢?例如一个控件既有点击又有长按,如果你返回为false,那么再你触发长按之后,回调没有消耗掉,还会再触发点击事件,而设置为true,就不会触发后面的点击事件。
下面回到RvBasicUseActivity中,在initView()方法中添加如下代码:
//设置适配器Item长按事件
stringAdapter.setOnItemLongClickListener((view, position) -> {
showMsg("长按了");
return true;
});
//设置适配器Item子控件长按事件
stringAdapter.setOnItemChildLongClickListener((view, position) -> {
showMsg("长按了按钮");
return true;
});
至于添加在什么位置,我想不用我再告诉你了吧,下面我们运行一下看看效果。
⑥ 多个子控件点击事件
有时候一个Item里面会有多个子控件,每一个都需要有点击事件,这是很常见的事情,那么我们应该怎么做呢?其实也很简单,首先我们改动一下item_text_rv.xml,代码如下:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="1dp"
android:background="@color/white"
android:gravity="center_vertical"
android:foreground="?attr/selectableItemBackground"
android:orientation="horizontal"
android:padding="16dp">
<TextView
android:id="@+id/tv_text"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textColor="@color/black" />
<Button
android:id="@+id/btn_test"
android:text="按钮1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<Button
android:id="@+id/btn_test_2"
android:layout_marginStart="8dp"
android:text="按钮2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
这里我多添加了一个按钮,那么现在就有两个子控件了,回到StringAdapter中,在handlerEvents()方法中,添加如下代码:
view.findViewById(R.id.btn_test_2).setOnClickListener(v -> {
if (childClickListener != null) {
childClickListener.onItemChildClick(v, viewHolder.getAdapterPosition());
}
});
然后在RvBasicUseActivity的initView()方法中,修改之前的子控件点击监听中的代码,如下所示:
stringAdapter.setOnItemChildClickListener((view, position) -> {
switch (view.getId()) {
case R.id.btn_test:
showMsg(strings.get(position) + "的按钮 1");
break;
case R.id.btn_test_2:
showMsg(strings.get(position) + "的按钮 2");
break;
}
});
虽然都是触发这个回调方法,但是view的id不同,所以我们可以通过id得知是那个控件在点击,运行一下:
这里实际上我们写了一段重复的代码,只有控件id不同,因此这段代码还可以优化一下:
view.findViewById(R.id.btn_test).setOnClickListener(v -> {
if (childClickListener != null) {
childClickListener.onItemChildClick(v, viewHolder.getAdapterPosition());
}
});
view.findViewById(R.id.btn_test_2).setOnClickListener(v -> {
if (childClickListener != null) {
childClickListener.onItemChildClick(v, viewHolder.getAdapterPosition());
}
});
我们可以在StringAdapter中添加一个addChildClicks()方法,代码如下:
private void addChildClicks(int[] ids, View view, ViewHolder viewHolder) {
for (int id : ids) {
view.findViewById(id).setOnClickListener(v -> {
if (childClickListener != null) {
childClickListener.onItemChildClick(v, viewHolder.getAdapterPosition());
}
});
}
}
然后在handlerEvents()方法中添加如下代码:
//添加多个子控件点击事件
addChildClicks(new int[]{R.id.btn_test, R.id.btn_test_2}, view, viewHolder);
添加位置如下图所示:
现在运行起来,效果和之前一样,这样做是为了消除重复代码,关于多个子控件的长按事件,也是类似的处理方式,你可以自己试试哦。