編輯:關於Android編程
說到ListView和GridView大家肯定不陌生,相信也有很多人已經使用到了出神入化的地步,因為這兩個控件實在是太常用了,可以說任何項目都會有ListView的身影,而且使用方便簡單代碼量少!但是習慣了往往就不喜歡使用新鮮事物,就像我自己使用了幾次RecyclerView之後就還是使用ListView了,但是說句真心話,現在ListView已經越來越難完成頁面上的需求了。所以今天特意寫一片帖子來總結Recycler的使用。
那麼有了ListView、GridView為什麼還需要RecyclerView這樣的控件呢?整體上看RecyclerView架構,提供了一種插拔式的體驗,高度的解耦,異常的靈活,通過設置它提供的不同LayoutManager,ItemDecoration , ItemAnimator實現令人瞠目的效果。
你想要控制其顯示的方式,請通過布局管理器LayoutManager 你想要控制Item間的間隔(可繪制),請通過ItemDecoration 你想要控制Item增刪的動畫,請通過ItemAnimator鑒於我們對於ListView的使用特別的熟悉,對比下RecyclerView的使用代碼:
mRecyclerView = findView(R.id.id_recyclerview); //設置布局管理器 mRecyclerView.setLayoutManager(layout); //設置adapter mRecyclerView.setAdapter(adapter) //設置Item增加、移除動畫 mRecyclerView.setItemAnimator(new DefaultItemAnimator()); //添加分割線 mRecyclerView.addItemDecoration(new DividerItemDecoration( getActivity(), DividerItemDecoration.HORIZONTAL_LIST));
ok,相比較於ListView的代碼,ListView可能只需要去設置一個adapter就能正常使用了。而RecyclerView基本需要上面一系列的步驟,那麼為什麼會添加這麼多的步驟呢?
那麼就必須解釋下RecyclerView的這個名字了,從它類名上看,RecyclerView代表的意義是,我只管Recycler View,也就是說RecyclerView只管回收與復用View,其他的你可以自己去設置。可以看出其高度的解耦,給予你充分的定制自由(所以你才可以輕松的通過這個控件實現ListView,GirdView,瀑布流等效果)。
Just like ListView
- Activity
public class HomeActivity extends ActionBarActivity { private RecyclerView mRecyclerView; private ListActivity的布局文件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 (); for (int i = 'A'; i < 'z'; i++) { mDatas.add("" + (char) i); } } class HomeAdapter extends RecyclerView.Adapter { @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); } } } }
Item的布局文件
<framelayout android:background="#44ff0000" android:layout_height="wrap_content" android:layout_width="match_parent" xmlns:android="http://schemas.android.com/apk/res/android"></framelayout>
看起來好丑,Item間應該有個分割線,當你去找時,你會發現RecyclerView並沒有支持divider這樣的屬性。那麼怎麼辦,你可以給Item的布局去設置margin,當然了這種方式不夠優雅,我們文章開始說了,我們可以自由的去定制它,當然我們的分割線也是可以定制的。
我們可以通過該方法添加分割線:mRecyclerView.addItemDecoration()
該方法的參數為RecyclerView.ItemDecoration,該類為抽象類,官方目前並沒有提供默認的實現類(我覺得最好能提供幾個)。
該類的源碼:
public static abstract class ItemDecoration { public void onDraw(Canvas c, RecyclerView parent, State state) { onDraw(c, parent); } public void onDrawOver(Canvas c, RecyclerView parent, State state) { onDrawOver(c, parent); } public void getItemOffsets(Rect outRect, View view, RecyclerView parent, State state) { getItemOffsets(outRect, ((LayoutParams) view.getLayoutParams()).getViewLayoutPosition(), parent); } @Deprecated public void getItemOffsets(Rect outRect, int itemPosition, RecyclerView parent) { outRect.set(0, 0, 0, 0); }
當我們調用mRecyclerView.addItemDecoration()方法添加decoration的時候,RecyclerView在繪制的時候,去會繪制decorator,即調用該類的onDraw和onDrawOver方法,
- onDraw方法先於drawChildren
- onDrawOver在drawChildren之後,一般我們選擇復寫其中一個即可。
- getItemOffsets 可以通過outRect.set()為每個Item設置一定的偏移量,主要用於繪制Decorator。
接下來我們看一個RecyclerView.ItemDecoration的實現類,該類很好的實現了RecyclerView添加分割線(當使用LayoutManager為LinearLayoutManager時)。
/** * This class is from the v7 samples of the Android SDK. It's not by me! *
* See the license above for details. */ public class DividerItemDecoration extends RecyclerView.ItemDecoration { private static final int[] ATTRS = new int[]{ android.R.attr.listDivider }; public static final int HORIZONTAL_LIST = LinearLayoutManager.HORIZONTAL; public static final int VERTICAL_LIST = LinearLayoutManager.VERTICAL; private Drawable mDivider; private int mOrientation; public DividerItemDecoration(Context context, int orientation) { final TypedArray a = context.obtainStyledAttributes(ATTRS); mDivider = a.getDrawable(0); a.recycle(); setOrientation(orientation); } public void setOrientation(int orientation) { if (orientation != HORIZONTAL_LIST && orientation != VERTICAL_LIST) { throw new IllegalArgumentException("invalid orientation"); } mOrientation = orientation; } @Override public void onDraw(Canvas c, RecyclerView parent) { Log.v("recyclerview - itemdecoration", "onDraw()"); **if (mOrientation == VERTICAL_LIST) { drawVertical(c, parent); } else { drawHorizontal(c, parent); }** } public void drawVertical(Canvas c, RecyclerView parent) { final int left = parent.getPaddingLeft(); final int right = parent.getWidth() - parent.getPaddingRight(); final int childCount = parent.getChildCount(); for (int i = 0; i < childCount; i++) { final View child = parent.getChildAt(i); android.support.v7.widget.RecyclerView v = new android.support.v7.widget.RecyclerView(parent.getContext()); final RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child .getLayoutParams(); final int top = child.getBottom() + params.bottomMargin; final int bottom = top + mDivider.getIntrinsicHeight(); mDivider.setBounds(left, top, right, bottom); mDivider.draw(c); } } public void drawHorizontal(Canvas c, RecyclerView parent) { final int top = parent.getPaddingTop(); final int bottom = parent.getHeight() - parent.getPaddingBottom(); final int childCount = parent.getChildCount(); for (int i = 0; i < childCount; i++) { final View child = parent.getChildAt(i); final RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child .getLayoutParams(); final int left = child.getRight() + params.rightMargin; final int right = left + mDivider.getIntrinsicHeight(); mDivider.setBounds(left, top, right, bottom); mDivider.draw(c); } } @Override public void getItemOffsets(Rect outRect, int itemPosition, RecyclerView parent) { if (mOrientation == VERTICAL_LIST) { outRect.set(0, 0, 0, mDivider.getIntrinsicHeight()); } else { outRect.set(0, 0, mDivider.getIntrinsicWidth(), 0); } } }
該實現類可以看到通過讀取系統主題中的 Android.R.attr.listDivider作為Item間的分割線,並且支持橫向和縱向。
獲取到listDivider以後,該屬性的值是個Drawable,在getItemOffsets中,outRect去設置了繪制的范圍。onDraw中實現了真正的繪制。
我們在原來的代碼中添加一句:
mRecyclerView.addItemDecoration(new DividerItemDecoration(this, DividerItemDecoration.VERTICAL_LIST));
ok,現在再運行,就可以看到分割線的效果了。
該分割線是系統默認的,你可以在theme.xml中找到該屬性的使用情況。那麼,使用系統的listDivider有什麼好處呢?就是方便我們去隨意的改變,該屬性我們可以直接聲明在:
然後自己寫個drawable即可,下面我們換一種分隔符:
當然了,你可以根據自己的需求,去隨意的繪制,反正是畫出來的,隨便玩~~
ok,看到這,你可能覺得,這玩意真尼瑪麻煩,完全不能比擬的心愛的ListView。那麼繼續看。
好了,上面實現了類似ListView樣子的Demo,通過使用其默認的LinearLayoutManager。
RecyclerView.LayoutManager吧,這是一個抽象類,好在系統提供了3個實現類:
LinearLayoutManager 現行管理器,支持橫向、縱向。 GridLayoutManager 網格布局管理器 StaggeredGridLayoutManager 瀑布就式布局管理器上面我們已經初步體驗了下LinearLayoutManager,接下來看GridLayoutManager。
GridLayoutManager//mRecyclerView.setLayoutManager(new LinearLayoutManager(this)); mRecyclerView.setLayoutManager(new GridLayoutManager(this,4));
只需要修改LayoutManager即可,還是很nice的。
當然了,改為GridLayoutManager以後,對於分割線,前面的DividerItemDecoration就不適用了,主要是因為它在繪制的時候,比如水平線,針對每個child的取值為:
final int left = parent.getPaddingLeft();
final int right = parent.getWidth() - parent.getPaddingRight();
因為每個Item一行,這樣是沒問題的。而GridLayoutManager時,一行有多個childItem,這樣就多次繪制了,並且GridLayoutManager時,Item如果為最後一列(則右邊無間隔線)或者為最後一行(底部無分割線)。
針對上述,我們編寫了DividerGridItemDecoration。
public class DividerGridItemDecoration extends RecyclerView.ItemDecoration { private static final int[] ATTRS = new int[] { android.R.attr.listDivider }; private Drawable mDivider; public DividerGridItemDecoration(Context context) { final TypedArray a = context.obtainStyledAttributes(ATTRS); mDivider = a.getDrawable(0); a.recycle(); } @Override public void onDraw(Canvas c, RecyclerView parent, State state) { drawHorizontal(c, parent); drawVertical(c, parent); } private int getSpanCount(RecyclerView parent) { // 列數 int spanCount = -1; LayoutManager layoutManager = parent.getLayoutManager(); if (layoutManager instanceof GridLayoutManager) { spanCount = ((GridLayoutManager) layoutManager).getSpanCount(); } else if (layoutManager instanceof StaggeredGridLayoutManager) { spanCount = ((StaggeredGridLayoutManager) layoutManager) .getSpanCount(); } return spanCount; } public void drawHorizontal(Canvas c, RecyclerView parent) { int childCount = parent.getChildCount(); for (int i = 0; i < childCount; i++) { final View child = parent.getChildAt(i); final RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child .getLayoutParams(); final int left = child.getLeft() - params.leftMargin; final int right = child.getRight() + params.rightMargin + mDivider.getIntrinsicWidth(); final int top = child.getBottom() + params.bottomMargin; final int bottom = top + mDivider.getIntrinsicHeight(); mDivider.setBounds(left, top, right, bottom); mDivider.draw(c); } } public void drawVertical(Canvas c, RecyclerView parent) { final int childCount = parent.getChildCount(); for (int i = 0; i < childCount; i++) { final View child = parent.getChildAt(i); final RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child .getLayoutParams(); final int top = child.getTop() - params.topMargin; final int bottom = child.getBottom() + params.bottomMargin; final int left = child.getRight() + params.rightMargin; final int right = left + mDivider.getIntrinsicWidth(); mDivider.setBounds(left, top, right, bottom); mDivider.draw(c); } } private boolean isLastColum(RecyclerView parent, int pos, int spanCount, int childCount) { LayoutManager layoutManager = parent.getLayoutManager(); if (layoutManager instanceof GridLayoutManager) { if ((pos + 1) % spanCount == 0)// 如果是最後一列,則不需要繪制右邊 { return true; } } else if (layoutManager instanceof StaggeredGridLayoutManager) { int orientation = ((StaggeredGridLayoutManager) layoutManager) .getOrientation(); if (orientation == StaggeredGridLayoutManager.VERTICAL) { if ((pos + 1) % spanCount == 0)// 如果是最後一列,則不需要繪制右邊 { return true; } } else { childCount = childCount - childCount % spanCount; if (pos >= childCount)// 如果是最後一列,則不需要繪制右邊 return true; } } return false; } private boolean isLastRaw(RecyclerView parent, int pos, int spanCount, int childCount) { LayoutManager layoutManager = parent.getLayoutManager(); if (layoutManager instanceof GridLayoutManager) { childCount = childCount - childCount % spanCount; if (pos >= childCount)// 如果是最後一行,則不需要繪制底部 return true; } else if (layoutManager instanceof StaggeredGridLayoutManager) { int orientation = ((StaggeredGridLayoutManager) layoutManager) .getOrientation(); // StaggeredGridLayoutManager 且縱向滾動 if (orientation == StaggeredGridLayoutManager.VERTICAL) { childCount = childCount - childCount % spanCount; // 如果是最後一行,則不需要繪制底部 if (pos >= childCount) return true; } else // StaggeredGridLayoutManager 且橫向滾動 { // 如果是最後一行,則不需要繪制底部 if ((pos + 1) % spanCount == 0) { return true; } } } return false; } @Override public void getItemOffsets(Rect outRect, int itemPosition, RecyclerView parent) { int spanCount = getSpanCount(parent); int childCount = parent.getAdapter().getItemCount(); if (isLastRaw(parent, itemPosition, spanCount, childCount))// 如果是最後一行,則不需要繪制底部 { outRect.set(0, 0, mDivider.getIntrinsicWidth(), 0); } else if (isLastColum(parent, itemPosition, spanCount, childCount))// 如果是最後一列,則不需要繪制右邊 { outRect.set(0, 0, 0, mDivider.getIntrinsicHeight()); } else { outRect.set(0, 0, mDivider.getIntrinsicWidth(), mDivider.getIntrinsicHeight()); } } }
跟人建議把這個類封裝成一個構造方法,只傳入兩個drawable就好了.
ok,看到這,你可能還覺得RecyclerView不夠強大?
但是如果我們有這麼個需求,縱屏的時候顯示為ListView,橫屏的時候顯示兩列的GridView,我們RecyclerView可以輕松搞定,而如果使用ListView去實現還是需要點功夫的~~~
通過設置RecyclerView的layoutManager 可以快速的在ListView和GridView之間切換。
當然了,這只是皮毛,下面讓你心服口服。
StaggeredGridLayoutManager// mRecyclerView.setLayoutManager(new GridLayoutManager(this,4)); mRecyclerView.setLayoutManager(new StaggeredGridLayoutManager(4, StaggeredGridLayoutManager.VERTICAL));
可以看到,固定為4行,變成了左右滑動。有一點需要注意,如果是橫向的時候,item的寬度需要注意去設置,畢竟橫向的寬度沒有約束了,應為控件可以橫向滾動了。<喎?/kf/ware/vc/" target="_blank" class="keylink">vcD4NCjxwPsjnufvE49Do0qrSu9H5uuHP8rn2tq+1xEdyaWRWaWV3o6zEx8O0uafPssTjoaM8L3A+DQo8cD5va6OsvdPPwsC017yxuL+0tPPV0KOsyOe5+8jDxOPIpcq1z9a49sbZsrzB96Os1+7G8MLrsrvKx8THw7TL5tLivs2/ydLUyrXP1rXEsMmjv7WrysejrMjnufvKudPDUmVjeWNsZXJWaWV3o6y31rfW1tO1xMrCoaM8L3A+DQo8cD7Ex8O0yOe6zsq1z9ajv8bkyrXE48qyw7S2vLK708PX9qOs1rvSqsq508NTdGFnZ2VyZWRHcmlkTGF5b3V0TWFuYWdlcs7Sw8e+zdLRvq3Ktc/WwcujrNa7ysfJz8PmtcRpdGVtsry+1s7Sw8fKudPDwcu5zLaotcS437bIo6w8c3Ryb25nPs/Cw+bO0sPHvfa99tTaysrF5Mb3tcRvbkJpbmRWaWV3SG9sZGVyt723qNbQzqrO0sPHtcRpdGVtyejWw7j2y+a7+rXEuN+2yDwvc3Ryb25nPqOotPrC677NsrvM+cHLo6zX7rrzu+G4+LP21LTC68/C1Ni12Na3o6mjrL+0v7TQp7n7zbyjujxiciAvPg0KPGltZyBhbHQ9"這裡寫圖片描述" src="/uploadfile/Collfiles/20161111/20161111104846214.gif" title="\" />
是不是棒棒哒,通過RecyclerView去實現ListView、GridView、瀑布流的效果基本上沒有什麼區別,而且可以僅僅通過設置不同的LayoutManager即可實現。
還有更nice的地方,就在於item增加、刪除的動畫也是可配置的。接下來看一下ItemAnimator。
ItemAnimator也是一個抽象類,好在系統為我們提供了一種默認的實現類,期待系統多添加些默認的實現。
借助默認的實現,當Item添加和移除的時候,添加動畫效果很簡單:
// 設置item動畫 mRecyclerView.setItemAnimator(new DefaultItemAnimator());
系統為我們提供了一個默認的實現,我們為我們的瀑布流添加以上一行代碼,效果為:
如果是GridLayoutManager呢?動畫效果為:
注意,這裡更新數據集不是用adapter.notifyDataSetChanged()而是
notifyItemInserted(position)與notifyItemRemoved(position)
否則沒有動畫效果。
上述為adapter中添加了兩個方法:
public void addData(int position) { mDatas.add(position, "Insert One"); notifyItemInserted(position); } public void removeData(int position) { mDatas.remove(position); notifyItemRemoved(position); }
Activity中點擊MenuItem觸發:
@Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.main, menu); return super.onCreateOptionsMenu(menu); } @Override public boolean onOptionsItemSelected(MenuItem item) { switch (item.getItemId()) { case R.id.id_action_add: mAdapter.addData(1); break; case R.id.id_action_delete: mAdapter.removeData(1); break; } return true; }
好了,到這我對這個控件已經不是一般的喜歡了~~~
當然了只提供了一種動畫,那麼我們肯定可以去自定義各種nice的動畫效果。
高興的是,github上已經有很多類似的項目了,這裡我們直接引用下:RecyclerViewItemAnimators,大家自己下載查看。
提供了SlideInOutLeftItemAnimator,SlideInOutRightItemAnimator,
SlideInOutTopItemAnimator,SlideInOutBottomItemAnimator等動畫效果。
不過一個挺郁悶的地方就是,系統沒有提供ClickListener和LongClickListener。
不過我們也可以自己去添加,只是會多了些代碼而已。
實現的方式比較多,你可以通過mRecyclerView.addOnItemTouchListener去監聽然後去判斷手勢,
當然你也可以通過adapter中自己去提供回調,這裡我們選擇後者,前者的方式,大家有興趣自己去實現。
adapter中自己定義了個接口,然後在onBindViewHolder中去為holder.itemView去設置相應
的監聽最後回調我們設置的監聽。
ok,到此我們基本介紹了RecylerView常見用法,包含了:
系統提供了幾種LayoutManager的使用;
如何通過自定義ItemDecoration去設置分割線,或者一些你想作為分隔的drawable,注意這裡
巧妙的使用了系統的listDivider屬性,你可以嘗試添加使用divider和dividerHeight屬性。
如何使用ItemAnimator為RecylerView去添加Item移除、添加的動畫效果。
介紹了如何添加ItemClickListener與ItemLongClickListener。
可以看到RecyclerView可以實現:
通過簡單改變下LayoutManager,就可以產生不同的效果,那麼我們可以根據手機屏幕的寬度去動態設置LayoutManager,屏幕寬度一般的,顯示為ListView;寬度稍大的顯示兩列的GridView或者瀑布流(或者橫縱屏幕切換時變化,有點意思~);顯示的列數和寬度成正比。甚至某些特殊屏幕,讓其橫向滑動~~再選擇一個nice的動畫效果,相信這種插件式的編碼體驗一定會讓你迅速愛上RecyclerView。
Android設備之間可以除了通過wifi熱點共享上網,還可以通過藍牙共享上網,後面這個功能很少人使用,但適合某台設備沒有wifi卻有藍牙的情況。一、設置WT19i,系統
效果如下:布局文件activity_main.xml如下: MainActivity.java代碼如下:import android.app.Act
今天在慕課網看了一個視頻,介紹了幾種圖像處理的方法,其中有一種就是鏡面效果,但是他是通過自定義view的方式實現的,但是算法都大同小異。他的自定義view:package
上篇介紹了Material Design中的各種動畫效果,結合第一篇就可以寫出很棒的UI界面了,這次再學習下Material Design中其它控件.照常先貼學習鏈接:h