筆者在刷知乎的時(shí)候看到不要再用ListView了替蔬,改用RecyclerView吧坯辩!作為一個(gè)重癥知乎迷覆履,當(dāng)然要去have a look究恤,那么今天我們一起see see吧俭令。
據(jù)官方介紹RecyclerView是ListView的升級(jí)版,既然是升級(jí)版部宿,肯定具有更多的優(yōu)點(diǎn)抄腔,那么我們來看看RecyclerView有哪些優(yōu)點(diǎn):
- RecylerView封裝了viewholder的回收復(fù)用,也就是說RecylerView標(biāo)準(zhǔn)化了ViewHolder理张,編寫Adapter面向的是ViewHolder而不再是View了赫蛇,復(fù)用的邏輯被封裝了,寫起來更加簡(jiǎn)單雾叭。
- 提供了一種插拔式的體驗(yàn)悟耘,高度的解耦,異常的靈活织狐,針對(duì)一個(gè)Item的顯示RecylerView專門抽取出了相應(yīng)的類暂幼,來控制Item的顯示筏勒,使其的擴(kuò)展性非常強(qiáng)。例如:你想控制橫向或者縱向滑動(dòng)列表效果可以通過LinearLayoutManager這個(gè)類來進(jìn)行控制(與GridView效果對(duì)應(yīng)的是GridLayoutManager,與瀑布流對(duì)應(yīng)的還有StaggeredGridLayoutManager等)旺嬉,也就是說RecylerView不再拘泥于ListView的線性展示方式管行,它也可以實(shí)現(xiàn)GridView的效果等多種效果。你想控制Item的分隔線鹰服,可以通過繼承RecylerView的ItemDecoration這個(gè)類病瞳,然后針對(duì)自己的業(yè)務(wù)需求去抒寫代碼揽咕。
- 可以控制Item增刪的動(dòng)畫悲酷,可以通過ItemAnimator這個(gè)類進(jìn)行控制,當(dāng)然針對(duì)增刪的動(dòng)畫亲善,RecylerView有其自己默認(rèn)的實(shí)現(xiàn)设易。
下面來介紹RecyclerView的用法。
首先首先要用這個(gè)控件蛹头,你需要在gradle文件中添加包的引用(配合官方CardView使用)
compile 'com.android.support:cardview-v7:21.0.3' compile 'com.android.support:recyclerview-v7:21.0.3'
然后在XML布局文件里使用
<android.support.v7.widget.RecyclerView xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/recycler_view" android:layout_centerVertical="true" android:layout_centerHorizontal="true"/>
再接著是activity
mRecyclerView = findView(R.id.id_recyclerview); //設(shè)置布局管理器 mRecyclerView.setLayoutManager(layout); //設(shè)置adapter mRecyclerView.setAdapter(adapter) //設(shè)置Item增加顿肺、移除動(dòng)畫 mRecyclerView.setItemAnimator(new DefaultItemAnimator()); //添加分割線 mRecyclerView.addItemDecoration(new DividerItemDecoration( getActivity(), DividerItemDecoration.HORIZONTAL_LIST));
在這里我們看到設(shè)置過程比ListView復(fù)雜一些,這是RecyclerView高度解耦的表現(xiàn)渣蜗,擴(kuò)展性極強(qiáng)屠尊。
下面是顯示A-Z的RecyclerView的實(shí)現(xiàn)
Activity
public class HomeActivity extends ActionBarActivity {
private RecyclerView mRecyclerView;
private List<String> mDatas;
private HomeAdapter mAdapter;
@Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_single_recyclerview);
initData();
mRecyclerView = (RecyclerView) findViewById(R.id.id_recyclerview);
mRecyclerView.setLayoutManager(new LinearLayoutManager(this));
mRecyclerView.setAdapter(mAdapter = new HomeAdapter());
}
protected void initData()
{
mDatas = new ArrayList<String>();
for (int i = 'A'; i < 'z'; i++)
{
mDatas.add("" + (char) i);
}
}
class HomeAdapter extends RecyclerView.Adapter<HomeAdapter.MyViewHolder>
{
@Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType)
{
MyViewHolder holder = new MyViewHolder(LayoutInflater.from(
HomeActivity.this).inflate(R.layout.item_home, parent,
false));
return holder;
}
@Override
public void onBindViewHolder(MyViewHolder holder, int position)
{
holder.tv.setText(mDatas.get(position));
}
@Override
public int getItemCount()
{
return mDatas.size();
}
class MyViewHolder extends ViewHolder
{
TextView tv;
public MyViewHolder(View view)
{
super(view);
tv = (TextView) view.findViewById(R.id.id_num);
}
}
}
}
這個(gè)實(shí)際效果item間是沒有分割線的
下面添加分割線
mRecyclerView.addItemDecoration(new DividerItemDecoration(this, DividerItemDecoration.VERTICAL_LIST));
該方法會(huì)調(diào)用系統(tǒng)默認(rèn)的分割線
系統(tǒng)分割線可以在theme.xml里找到
<style name="AppTheme" parent="AppBaseTheme"> <item name="android:listDivider">@drawable/divider_bg</item> </style>
當(dāng)然我們可以自己實(shí)現(xiàn)個(gè)drawable
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
`<gradient
android:centerColor="#ff00ff00"
android:endColor="#ff0000ff"
android:startColor="#ffff0000"
android:type="linear" />
<size android:height="4dp"/>`
</shape>
線性布局我們就說到這,下面實(shí)現(xiàn)瀑布流布局
mRecyclerView.setLayoutManager(new StaggeredGridLayoutManager(4, StaggeredGridLayoutManager.VERTICAL));
只需要一行耕拷,注意StaggeredGridLayoutManager構(gòu)造的第二個(gè)參數(shù)傳一個(gè)orientation讼昆,如果傳入的是StaggeredGridLayoutManager.VERTICAL代表有多少列;那么傳入的如果是StaggeredGridLayoutManager.HORIZONTAL就代表有多少行骚烧。假如上面代碼改為:
mRecyclerView.setLayoutManager(new StaggeredGridLayoutManager(4, StaggeredGridLayoutManager.HORIZONTAL));
效果為:
這個(gè)效果顯然不夠驚艷浸赫,下面我們?cè)谶m配器的onBindViewHolder方法中為item設(shè)置個(gè)隨機(jī)高度,即可實(shí)現(xiàn)以下效果:
更驚艷的地方是item增加赃绊、刪除的動(dòng)畫也是可配置的既峡。接下來看一下ItemAnimator。
ItemAnimator
使用默認(rèn)的效果也只需要一行代碼:
// 設(shè)置item動(dòng)畫 mRecyclerView.setItemAnimator(new DefaultItemAnimator());
效果:
有個(gè)令人頭疼的地方是系統(tǒng)沒有提供ClickListener和LongClickListener碧查,所以我們只能自己去實(shí)現(xiàn)运敢。
class HomeAdapter extends RecyclerView.Adapter<HomeAdapter.MyViewHolder> {
public interface OnItemClickLitener
{
void onItemClick(View view, int position);
void onItemLongClick(View view , int position);
}
private OnItemClickLitener mOnItemClickLitener;
public void setOnItemClickLitener(OnItemClickLitener mOnItemClickLitener)
{
this.mOnItemClickLitener = mOnItemClickLitener;
}
@Override
public void onBindViewHolder(final MyViewHolder holder, final int position)
{
holder.tv.setText(mDatas.get(position));
// 如果設(shè)置了回調(diào),則設(shè)置點(diǎn)擊事件
if (mOnItemClickLitener != null)
{
holder.itemView.setOnClickListener(new OnClickListener()
{
@Override
public void onClick(View v)
{
int pos = holder.getLayoutPosition();
mOnItemClickLitener.onItemClick(holder.itemView, pos);
}
});
holder.itemView.setOnLongClickListener(new OnLongClickListener()
{
@Override
public boolean onLongClick(View v)
{
int pos = holder.getLayoutPosition();
mOnItemClickLitener.onItemLongClick(holder.itemView, pos);
return false;
}
});
}
}
}
Activity設(shè)置監(jiān)聽:
mAdapter.setOnItemClickLitener(new OnItemClickLitener() {
@Override
public void onItemClick(View view, int position)
{
Toast.makeText(HomeActivity.this, position + " click",
Toast.LENGTH_SHORT).show();
}
@Override
public void onItemLongClick(View view, int position)
{
Toast.makeText(HomeActivity.this, position + " long click",
Toast.LENGTH_SHORT).show();
mAdapter.removeData(position);
}
});
別忘了給item添加一個(gè)drawable:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" > <item android:state_pressed="true" android:drawable="@color/color_item_press"></item> <item android:drawable="@color/color_item_normal"></item> </selector>
效果:
源碼下載:源碼下載