Android 使用 RecyclerView 分隔线问题

自从Google推出了RecyclerView作为ListView功能更加强大的替代品之后,越来越多的APP开始使用这个控件。RecyclerView可以优化程序性能,并且由于功能上的高度解耦,可以无成本地在ListView、GridView以及瀑布流之间切换,但是也正因为如此,原来在ListView中理所当然的东西在RecyclerView中要自己来实现,比如分隔线,比如OnItemClickListener等(不是特别理解为什么Listener还要我们自己实现,我的做法就是往Adapter里扔回调)

说到分隔线,可以去实现RecyclerView.ItemDecoration来定制,在鸿洋大大的博客里有非常详细的讲解,按照这个来做其实也不麻烦,而且一次编写复用终生,但是我做的时候还是想偷懒,不想去写那么多代码,所以想用背景图片来实现分隔线效果。

我的RecyclerView中每个item的背景是这样的,用了selector实现点击前后的变色效果

1
2
3
4
5
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/list_item_bg_pressed" android:state_pressed="true"/>
<item android:drawable="@drawable/list_item_bg_unpressed" android:state_pressed="false"/>
</selector>

其中@drawable/list_item_bg_pressed是这样

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 第一层,露出个小边当分隔线 -->
<item>
<shape android:shape="rectangle">
<solid android:color="@color/color_list_item_divider"/>
<padding android:bottom="@dimen/dimen_list_item_divider_height"/>
</shape>
</item>
<!-- 第二层,真正的背景色 -->
<item>
<shape android:shape="rectangle">
<solid android:color="@color/color_list_item_bg_pressed"/>
</shape>
</item>
</layer-list>

使用layer-list来实现效果:第一层使用分割线的颜色,并在底部padding一个窄边,第二层使用正常背景颜色,这样写而不是直接用一张图片代替的原因是:如果使用普通图片作为背景,当图片被拉伸时分隔线会明显变粗,效果非常不美观(当然.9图片没有问题,想了想还是直接用代码写了),而用代码就没有这个问题。这种效果我还用来实现一些输入框。

@drawable/list_item_bg_unpressed 同理,就是把第二层的颜色换了一下。

那么为什么不直接用一张图片来代替呢?因为有些情况下RecyclerView每个条目的高度并不是一样的,这样对于普通图片会产生纵向拉伸的效果,使得分隔线变得非常可怕,而用代码来实现的.9效果则不会有这个问题。

Android 使用 RecyclerView 分隔线问题

https://rucer.cn/2016-02/android-recyclerview-split/

作者

Ferris Tien

发布于

2016-02-06

更新于

2024-05-15

许可协议