繪制RecyclerView的分隔線

RecyclerView

現(xiàn)在開發(fā)Android的都知道,RecyclerView可以替代ListView和GridView猴仑,因為它的自由度很高,我們可以很隨意的展示我們的數(shù)據(jù)集肥哎,還有默認(rèn)的動畫辽俗!但是有一個瑕疵,那就是沒有提供一個分隔線的實現(xiàn)類篡诽,只有一個抽象類(RecyclerView.ItemDecoration)等著我們自己去實現(xiàn)崖飘!不過實現(xiàn)起來還是很簡單的。

自定義ItemDecoration的步驟(我以豎向舉例)

  1. 新建一個類杈女,繼承自RecyclerView.ItemDecoration
  2. 把各個item之間的距離加大朱浴!留出空間給我們要繪制的分隔線。所以要重寫getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state)方法达椰,設(shè)置偏移量翰蠢!
  3. 繪制分隔線到上面設(shè)置的間距,重寫onDraw()方法啰劲。

代碼實現(xiàn)

public class MyItemDecoration extends RecyclerView.ItemDecoration {
    //分隔線
    Drawable mDivider;

    //我們通過獲取系統(tǒng)屬性中的listDivider來添加梁沧,在系統(tǒng)中的AppTheme中設(shè)置
    public static final int[] ATRRS  = new int[]{
            android.R.attr.listDivider
    };
    public MyItemDecoration(Context context, int orientation){
        TypedArray ta = context.obtainStyledAttributes(ATRRS);
        mDivider = ta.getDrawable(0);
        ta.recycle();
    }

    @Override
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
       int pos =parent.getChildLayoutPosition(view);//得到當(dāng)前view的位置
       if(pos != parent.getAdapter().getItemCount()-1) {//如果不是最后一個view 那么留出空間
            //設(shè)置paddingLeft,paddingTop呈枉, paddingRight趁尼, paddingBottom
            outRect.set(0,0,0,mDivider.getIntrinsicHeight());
            //mDivider.getIntrinsicHeight()是獲取我們定義的分隔線的高度!
          }
    }
}
設(shè)置offset后的效果

我們可以看到已經(jīng)有白色的空間了猖辫!我們想用自定義的顏色去填充它酥泞,接來下我們先在drawable目錄下建一個shape,作為我們的divider:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@color/grey"></solid>
<size android:height="4dp"></size>
</shape>

然后在styles的主題AppTheme里設(shè)置:

<item name="android:listDivider">@drawable/divider_bg</item>

然后我們繼續(xù)繪制我們的分隔線啃憎,重寫onDraw()方法:

    @Override
    public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
        //設(shè)置分隔線的left和right
        int left = parent.getPaddingLeft();
        int right = parent.getWidth() - parent.getPaddingRight();

        for (int i = 0; i < parent.getChildCount(); i++) {
            View view = parent.getChildAt(i);
            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) view.getLayoutParams();
            //分隔線的top和bottom
            int top = view.getBottom()+params.bottomMargin;
            int bottom = top + mDivider.getIntrinsicHeight();
            //分隔線的繪制區(qū)域
            mDivider.setBounds(left,top,right,bottom);
            //把分隔線繪制到canvas
            mDivider.draw(c);
        }
    }

然后運行結(jié)果:


運行結(jié)果

我們可以在shape中畫出漸變效果芝囤,然后分隔符就變成這樣了:

漸變運行結(jié)果

到此我們就完工了,很簡單辛萍,只需要重寫兩個方法就可以了悯姊!
下一篇:繪制分組懸浮分隔欄

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市贩毕,隨后出現(xiàn)的幾起案子悯许,更是在濱河造成了極大的恐慌,老刑警劉巖辉阶,帶你破解...
    沈念sama閱讀 216,372評論 6 498
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件先壕,死亡現(xiàn)場離奇詭異瘩扼,居然都是意外死亡,警方通過查閱死者的電腦和手機垃僚,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,368評論 3 392
  • 文/潘曉璐 我一進(jìn)店門集绰,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人谆棺,你說我怎么就攤上這事栽燕。” “怎么了改淑?”我有些...
    開封第一講書人閱讀 162,415評論 0 353
  • 文/不壞的土叔 我叫張陵碍岔,是天一觀的道長。 經(jīng)常有香客問我朵夏,道長付秕,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,157評論 1 292
  • 正文 為了忘掉前任侍郭,我火速辦了婚禮,結(jié)果婚禮上掠河,老公的妹妹穿的比我還像新娘亮元。我一直安慰自己,他們只是感情好唠摹,可當(dāng)我...
    茶點故事閱讀 67,171評論 6 388
  • 文/花漫 我一把揭開白布爆捞。 她就那樣靜靜地躺著,像睡著了一般勾拉。 火紅的嫁衣襯著肌膚如雪煮甥。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,125評論 1 297
  • 那天藕赞,我揣著相機與錄音成肘,去河邊找鬼。 笑死斧蜕,一個胖子當(dāng)著我的面吹牛双霍,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播批销,決...
    沈念sama閱讀 40,028評論 3 417
  • 文/蒼蘭香墨 我猛地睜開眼洒闸,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了均芽?” 一聲冷哼從身側(cè)響起丘逸,我...
    開封第一講書人閱讀 38,887評論 0 274
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎掀宋,沒想到半個月后深纲,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體仲锄,經(jīng)...
    沈念sama閱讀 45,310評論 1 310
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,533評論 2 332
  • 正文 我和宋清朗相戀三年囤萤,在試婚紗的時候發(fā)現(xiàn)自己被綠了昼窗。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,690評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡涛舍,死狀恐怖澄惊,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情富雅,我是刑警寧澤掸驱,帶...
    沈念sama閱讀 35,411評論 5 343
  • 正文 年R本政府宣布,位于F島的核電站没佑,受9級特大地震影響毕贼,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜蛤奢,卻給世界環(huán)境...
    茶點故事閱讀 41,004評論 3 325
  • 文/蒙蒙 一鬼癣、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧啤贩,春花似錦待秃、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,659評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至志衍,卻和暖如春暖庄,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背楼肪。 一陣腳步聲響...
    開封第一講書人閱讀 32,812評論 1 268
  • 我被黑心中介騙來泰國打工培廓, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人淹辞。 一個月前我還...
    沈念sama閱讀 47,693評論 2 368
  • 正文 我出身青樓医舆,卻偏偏與公主長得像,于是被迫代替她去往敵國和親象缀。 傳聞我的和親對象是個殘疾皇子蔬将,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,577評論 2 353

推薦閱讀更多精彩內(nèi)容

  • 解密RecyclerView自定義分割線 RecyclerView的分割線ItemDecoration是可以自定制...
    孤獨的追尋著閱讀 2,187評論 0 5
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,071評論 25 707
  • 這篇文章分三個部分,簡單跟大家講一下 RecyclerView 的常用方法與奇葩用法央星;工作原理與ListView比...
    LucasAdam閱讀 4,388評論 0 27
  • 懸浮ItemDecoration 先來一個效果圖: 思路步驟 設(shè)置回調(diào)接口霞怀,用于判斷每個item的類型,以及各個類...
    CSU_IceLee閱讀 871評論 1 8
  • 昨晚是我們第93期讀書會莉给,去的路上我的眼皮很重毙石,困的不行廉沮。迷迷糊糊的做地鐵,來到了上次和華一起吃飯的地方~吉祥餛飩...
    心理咨詢師萍閱讀 508評論 2 2