欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

RecyclerView實(shí)現(xiàn)常見的列表菜單

 更新時(shí)間:2016年12月19日 08:50:53   作者:湖廣午王  
這篇文章主要為大家詳細(xì)介紹了用RecyclerView實(shí)現(xiàn)移動(dòng)應(yīng)用中常見的列表菜單,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下

在很多地方我們都會用到縱向列表樣式的菜單,比如微信首頁的我、發(fā)現(xiàn)頁面,微博的首頁的我頁面,QQ的動(dòng)態(tài)頁面等等等等,大多數(shù)的應(yīng)用中都會存在這樣的頁面。我們怎樣實(shí)現(xiàn)這種頁面比較好呢?

布局方案

完成這樣的頁面,常見的布局方案有:
1. 用ScrollView+LinearLayout很容易的暴力布局出來,但是這樣得到的布局太固定了,如果條目多一點(diǎn),加載起來很耗時(shí)。
2. 用ListView來實(shí)現(xiàn),這種方案比方案一要好上不少,起碼數(shù)據(jù)多點(diǎn)的時(shí)候,加載時(shí)不會太耗時(shí)。但是分割線和中間空白在要求差異化的時(shí)候,不太好繪制,用View的話又覺得大材小用。
3. 用RecyclerView來實(shí)現(xiàn)。RecyclerView做縱向布局相比ListView在很多方面也更靈活,無論是動(dòng)畫還是分割線上。

實(shí)現(xiàn)效果

左空白

無空白

微信樣式

三個(gè)圖片中分割線樣式都是比較常見的。

使用起來當(dāng)然是希望以最簡單粗暴的方式去使用,比如:

mMenuView.setCutLineLeftPadding(30);
mMenuView.setCutLineRightPadding(30);
mMenuView.setGapLineColor(getResources().getColor(R.color.theme_bg));

MenuBean h=new MenuBean();
//或者直接指定rootView
h.type=R.layout.head_user;
h.menu="美其名曰美";
h.info="天道有常,不為堯存,不為桀亡。";
mMenuView.addMenu(5,h);
mMenuView.addGap(30);
addMenu(11,R.mipmap.ic1,"菜單一","新年新氣象",true);
addMenu(12,R.mipmap.ic2,"菜單二","",false);
addMenu(13,R.mipmap.ic3,"菜單三","發(fā)現(xiàn)更好的自己",false);
mMenuView.addGap(30);
addMenu(14,R.mipmap.ic4,"菜單四","",true);
addMenu(15,R.mipmap.ic5,"菜單五","",true);
mMenuView.addGap(30);
addMenu(16,R.mipmap.ic6,"菜單六","",true);
addMenu(17,R.mipmap.ic7,"菜單七","",false);
addMenu(18,R.mipmap.ic8,"菜單八","開心才是最重要的",true);

具體實(shí)現(xiàn)

實(shí)現(xiàn)這樣的效果,如果不考慮分割線的話,那么稍微用過RecyclerView的應(yīng)該都能顯示這樣的功能,所以重點(diǎn)還是在分割線上了。
RecyclerView有一個(gè)增加分割線的方法addItemDecoration,當(dāng)然,這個(gè)方法并不是只能用來增加分割線。類似微信中通訊錄按照ABCD順序排列,并分組同樣可以用這個(gè)方法來實(shí)現(xiàn)。
直接貼上自定義的分割線的代碼,在代碼中解釋:

class MenuDecoration extends RecyclerView.ItemDecoration{

 //onDraw在每次重繪時(shí)都會調(diào)用,比如滑動(dòng)RecyclerView
 //gap線為從左到右的完整線條,在最開始的item上,最后的item下,或者空白區(qū)域的上下
 //cut線為兩個(gè)緊密挨著的兩個(gè)item之間的線條
 @Override
 public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
  super.onDraw(c, parent, state);
  //當(dāng)?shù)谝粋€(gè)Item可見的時(shí)候,給第一個(gè)Item頂上繪一條Gap線
  //不用完整可見才繪制,考慮設(shè)置paddingTop+clipPadding=false的情況
  if(mLayout.findFirstVisibleItemPosition()==0){
   int bottom=parent.getChildAt(0).getTop();
   paint.setColor(gapLineColor);
   c.drawLine(parent.getLeft(),bottom-halfLineHeight,parent.getRight(),bottom-halfLineHeight,paint);
  }
  int count=parent.getChildCount();
  int gap;
  int end=mData.size()-1;
  //所有可見的Item下面畫線
  for (int i=0;i<count;i++){
   final View child = parent.getChildAt(i);
   int position=mLayout.getPosition(child);
   gap=mGap.get(position);
   float startY=child.getBottom()+halfLineHeight;
   //View下面不存在gap且不是最好一個(gè)Item的時(shí)候,繪制Cut線,否則繪制gap線
   if(gap==0&&position!=end){ 
    //繪制cut線的左邊線條
    if(leftPaddingLine!=0){
     paint.setColor(foreLineColor);
     c.drawLine(parent.getLeft(),startY,parent.getLeft()+leftPaddingLine,startY,paint);
    }
    //繪制cut線的右邊線條
    if(rightPaddingLine!=0){
     paint.setColor(foreLineColor);
     c.drawLine(parent.getRight()-rightPaddingLine,startY,parent.getRight(),startY,paint);
    }
    //繪制cut線的中間線條
    paint.setColor(cutLineColor);
    c.drawLine(parent.getLeft()+leftPaddingLine,startY,parent.getRight()-rightPaddingLine,startY,paint);
   }else{
    paint.setColor(gapLineColor);
    //繪制gap上面的一條線
    c.drawLine(parent.getLeft(),child.getBottom()+halfLineHeight,parent.getRight(),child.getBottom()+halfLineHeight,paint);
    //如果不是最后一個(gè)item,繪制gap下面的一條線
    if(position<end){
     c.drawLine(parent.getLeft(),child.getBottom()+gap+halfLineHeight,parent.getRight(),child.getBottom()+gap+halfLineHeight,paint);
    }
   }
  }
 }

 //在每個(gè)item加載時(shí)調(diào)用,用來判斷設(shè)置每個(gè)item上下左邊的空白區(qū)域,設(shè)置內(nèi)容分別設(shè)置到outRect中
 @Override
 public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
  super.getItemOffsets(outRect, view, parent, state);
  int position=mLayout.getPosition(view);
  //如果是第一個(gè)Item,則設(shè)置上線條高度,否則不設(shè)置上線條高度
  //為每個(gè)item設(shè)置下邊線條+gap(如果有的話,沒有就為0)的高度
  //四個(gè)參數(shù)分別為左邊空白區(qū)域,上方空白區(qū)域,右邊空白區(qū)域,下方空白區(qū)域
  outRect.set(0, position != 0 ? 0 : (int)(halfLineHeight * 2+0.5f),0,(int)(halfLineHeight*2+0.5f)+mGap.get(position));
 }
}

這樣我們就得到了一個(gè)用來繪制分割線的類了。在需要插入空白的地方addGap,并傳入gap的高度:

public void addGap(int height){
 mGap.put(mData.size()-1,height);
}

這樣分割線和空白的問題就解決了。其他的就是RecyclerView的簡單使用了,為了使用方便,我們對RecyclerView和其Adapter簡單封裝一下,就能實(shí)現(xiàn)用addMenu的方式增加菜單項(xiàng)了。

以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

相關(guān)文章

  • 解析Android AIDL的實(shí)例與原理

    解析Android AIDL的實(shí)例與原理

    為使應(yīng)用程序之間能夠彼此通信,Android提供了IPC(Inter Process Communication,進(jìn)程間通信)的一種獨(dú)特實(shí)現(xiàn):AIDL(Android Interface Definition Language,Android接口定義語言)
    2021-06-06
  • Android?Recyclerview實(shí)現(xiàn)左滑刪除功能

    Android?Recyclerview實(shí)現(xiàn)左滑刪除功能

    這篇文章主要為大家詳細(xì)介紹了Android?Recyclerview實(shí)現(xiàn)左滑刪除功能,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2022-04-04
  • android使用intent傳遞參數(shù)實(shí)現(xiàn)乘法計(jì)算

    android使用intent傳遞參數(shù)實(shí)現(xiàn)乘法計(jì)算

    這篇文章主要為大家詳細(xì)介紹了android使用intent傳遞參數(shù)實(shí)現(xiàn)乘法計(jì)算,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2022-04-04
  • Android仿淘寶商品詳情頁效果

    Android仿淘寶商品詳情頁效果

    這篇文章主要為大家詳細(xì)介紹了Android仿淘寶商品詳情頁效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2018-10-10
  • android搜索框上下滑動(dòng)變色效果

    android搜索框上下滑動(dòng)變色效果

    這篇文章主要為大家詳細(xì)介紹了android實(shí)現(xiàn)搜索框上下滑動(dòng)透明度改變的效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2016-11-11
  • 簡述Android中實(shí)現(xiàn)APP文本內(nèi)容的分享發(fā)送與接收方法

    簡述Android中實(shí)現(xiàn)APP文本內(nèi)容的分享發(fā)送與接收方法

    本篇文章主要對Android中實(shí)現(xiàn)APP文本內(nèi)容的分享發(fā)送與接收方法進(jìn)行介紹,相信對大家學(xué)習(xí)會有很好的幫助,需要的朋友一起來看下吧
    2016-12-12
  • Android 自定義ContentProvider簡單實(shí)例

    Android 自定義ContentProvider簡單實(shí)例

    這篇文章主要介紹了Android 自定義ContentProvider簡單實(shí)例的相關(guān)資料,需要的朋友可以參考下
    2017-06-06
  • flutter 自定義websocket路由的實(shí)現(xiàn)

    flutter 自定義websocket路由的實(shí)現(xiàn)

    這篇文章主要介紹了flutter 自定義websocket路由的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2019-12-12
  • Android適配利用webview加載后圖片顯示過大的問題解決

    Android適配利用webview加載后圖片顯示過大的問題解決

    這篇文章主要給大家介紹了關(guān)于Android適配利用webview加載后圖片顯示過大問題的解決方法,文中通過示例代碼介紹的非常詳細(xì),對各位Android開發(fā)者們具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧
    2019-07-07
  • Android自定義照相機(jī)Camera出現(xiàn)黑屏的解決方法

    Android自定義照相機(jī)Camera出現(xiàn)黑屏的解決方法

    這篇文章主要介紹了Android自定義照相機(jī)Camera出現(xiàn)黑屏的解決方法,分析了黑屏出現(xiàn)的原因及參考解決方法,需要的朋友可以參考下
    2016-08-08

最新評論