因为上一个项目是接手的二手项目,其中并没有用到RecyclerView,而且项目进度抓得特别紧,导致一直没有时间去好好地研究一下RecyclerView。现在空下来重新开始我的博客生涯,第一篇就打算写写RecyclerView的用法,顺便为自己做一个总结,同时也熟悉一下Markdown的使用。
进入正文,先简单对RecyclerView做一个介绍。
RecyclerView出现于Android L版本,据官方的介绍,它的作用就是在有限的窗口中展示大量数据集,这和ListView、GridView的作用是一致的。基于RecyclerView的高度解耦以及异常的灵活性,于是,非常多的开发者都慢慢地抛弃了ListView、GridView这一类的控件了。下面我们来看看如何用RecyclerView实现ListView、GridView的功能。主要以ListView为例,分为一下几个功能:
1. UI绘制
2. 实现item点击事件
一、UI绘制
首先,在项目中引入RecyclerView
compile 'com.android.support:recyclerview-v7:25.3.0'
接下来,直接上代码
- MainActivity.java
package xml.zou.zohar.pte.recyclerviewdemo;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.DividerItemDecoration;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import java.util.ArrayList;
import java.util.List;
import xml.zou.zohar.pte.recyclerviewdemo.adapter.SimpleRecyclerAdapter;
public class MainActivity extends AppCompatActivity {
private RecyclerView recyclerView;
private LinearLayoutManager layoutManager;
private SimpleRecyclerAdapter recyclerAdapter;
private List<String> dates = new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initData();
recyclerView = (RecyclerView) findViewById(R.id.rv);
//设置LayoutManager
layoutManager = new LinearLayoutManager(this);
layoutManager.setOrientation(LinearLayoutManager.VERTICAL);
recyclerView.setLayoutManager(layoutManager);
//设置adapter
recyclerAdapter = new SimpleRecyclerAdapter(dates);
recyclerView.setAdapter(recyclerAdapter);
//添加分割线
recyclerView.addItemDecoration(new DividerItemDecoration(this, DividerItemDecoration.VERTICAL));
}
/**
* 初始化数据
*/
private void initData() {
for (int i = 1; i <= 20; i++) {
dates.add(String.valueOf(i));
}
}
}
- activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="xml.zou.zohar.pte.recyclerviewdemo.MainActivity">
<android.support.v7.widget.RecyclerView
android:id="@+id/rv"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
- SimpleRecyclerAdapter.java
package xml.zou.zohar.pte.recyclerviewdemo.adapter;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import java.util.List;
import xml.zou.zohar.pte.recyclerviewdemo.R;
/**
* desc:recyclerAdapter
* Created by Zohar on 2017/4/3.
*/
public class SimpleRecyclerAdapter extends RecyclerView.Adapter<SimpleRecyclerAdapter.ViewHolder> {
private List<String> dates = null;
public SimpleRecyclerAdapter(List<String> dates) {
this.dates = dates;
}
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_layout, parent, false);
return new ViewHolder(view);
}
@Override
public void onBindViewHolder(ViewHolder holder, int position) {
holder.textView.setText(dates.get(position));
}
@Override
public int getItemCount() {
return dates.size();
}
class ViewHolder extends RecyclerView.ViewHolder {
TextView textView;
ViewHolder(View itemView) {
super(itemView);
textView = (TextView) itemView.findViewById(R.id.text);
}
}
}
- item_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/ll_main"
android:layout_width="match_parent"
android:layout_height="46dp"
android:background="#33AAFF"
android:orientation="vertical">
<TextView
android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:textColor="#373737"
android:textSize="18sp" />
</LinearLayout>
看起来和ListView的使用步骤是一致的
效果图:
如果要修改分割线的样式,只需要为调用dividerItemDecoration.setDrawable(drawable)方法设置一个Drawable,例如:
//添加分割线
DividerItemDecoration divider = new DividerItemDecoration(this, DividerItemDecoration.VERTICAL); divider.setDrawable(getResources().getDrawable(R.drawable.divider));
recyclerView.addItemDecoration(divider);
- diveder.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:centerColor="#FFFFFF00"
android:endColor="#FF00FF00"
android:startColor="#FFFF0000"
android:type="linear" />
<size android:height="4dp" />
</shape>
效果图:
二、实现item点击事件
RecyclerView本身并没有提供ClickListener和LongClickListener方法,我们只能够自己去实现。
这里我提供两种实现方式,
第一种方式,利用recyclerView的addOnItemTouchListener方法,重写OnItemTouchListener中的onInterceptTouchEvent方法。
recyclerView.addOnItemTouchListener(new RecyclerView.OnItemTouchListener() {
@Override
public boolean onInterceptTouchEvent(RecyclerView rv, MotionEvent e) {
switch (e.getAction()) {
case MotionEvent.ACTION_DOWN:
break;
case MotionEvent.ACTION_UP:
//获取手指抬起时的itemView
View itemView = rv.findChildViewUnder(e.getX(), e.getY());
//根据position得到对应的viewHolder,可进一步得到其中的控件
SimpleRecyclerAdapter.ViewHolder holder = (SimpleRecyclerAdapter.ViewHolder) rv.findViewHolderForAdapterPosition(upPosition);
holder.textView.setText(holder.textView.getText().toString() + " · ");
Toast.makeText(MainActivity.this, dates.get(upPosition), Toast.LENGTH_SHORT).show();
break;
}
return false;
}
});
第二种方式,在adapter中提供回调。
public class SimpleRecyclerAdapter extends RecyclerView.Adapter<SimpleRecyclerAdapter.ViewHolder> {
//......
private boolean longClicked = false;
@Override
public void onBindViewHolder(final ViewHolder holder, final int position) {
holder.textView.setText(dates.get(position));
holder.textView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (onItemClickListener != null && !longClicked) {
onItemClickListener.onItemClick(holder, position);
}
longClicked = false;
}
});
holder.textView.setOnLongClickListener(new View.OnLongClickListener() {
@Override
public boolean onLongClick(View v) {
if (onItemClickListener != null) {
longClicked = true;
onItemClickListener.onItemLongClick(holder, position);
}
return false;
}
});
}
private OnItemClickListener onItemClickListener;
public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
this.onItemClickListener = onItemClickListener;
}
public interface OnItemClickListener {
void onItemClick(ViewHolder viewHolder, int position);
void onItemLongClick(ViewHolder viewHolder, int position);
}
//......
}
然后在调用的位置设置SimpleRecyclerAdapter.OnItemClickListener就可以了:
recyclerAdapter.setOnItemClickListener(new SimpleRecyclerAdapter.OnItemClickListener() {
@Override
public void onItemClick(SimpleRecyclerAdapter.ViewHolder viewHolder, int position) {
viewHolder.textView.setText(viewHolder.textView.getText().toString() + " · ");
Toast.makeText(MainActivity.this, dates.get(position), Toast.LENGTH_SHORT).show();
}
@Override
public void onItemLongClick(SimpleRecyclerAdapter.ViewHolder viewHolder, int position) {
viewHolder.textView.setText(" · " + viewHolder.textView.getText().toString());
Toast.makeText(MainActivity.this, dates.get(position), Toast.LENGTH_SHORT).show();
}
});
这段代码的效果是点击时在右边加一个点,长按时在左边加一个点。
效果图:
这里有一个问题,就是长按item后,先执行了setOnLongClickListener毁掉后,立马又执行了setOnClickListener回调,原因暂时不明。因此我暂时用boolean longClicked;
做了一下限制,待查明问题后再做修改。
另外,如果要实现GridView或者瀑布流效果的话,只需要在recyclerView.setLayoutManager(lp)
中传入对应的LayoutManager就可以了。
RecyclerView 提供了三个内置的布局管理器:
- LinearLayoutManager 以垂直或水平滚动列表方式显示项目。
- GridLayoutManager 在网格中显示项目。
- StaggeredGridLayoutManager 在分散对齐网格中显示项目,也就是瀑布流。
例如:
GridView样式:
gridLayoutManager = new GridLayoutManager(getContext(), 3);
recyclerView.setLayoutManager(gridLayoutManager);
瀑布流样式:
staggeredGridLayoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL);
recyclerView.setLayoutManager(staggeredGridLayoutManager);
效果图: