设置listView中divider左右留空白

listview中divider是用于间隔listview中的条目,主要是为了美观,使界面显得井井有条。

设计的时候,这个分割线也是很重要的一个部分,现在手机屏幕都比较大,通常认为大屏上1px比1dp要美观,小屏上看不出来区别。

开始的时候设计都是用ps画一个1px高的线,设置到listView的divider属性中,这样的好处是灵活性大,但是缺点是需要专门做个图,而且图片至少也得几KB。后期精简的时候,决定采用颜色来替换资源,因为分割线一般都是纯色的。但是这样一来,divider变成了一条线,两边贯穿屏幕,显得并不美观。

将listview设置padding之后,divider不贯穿屏幕了,但是listview的滚动条不贴着屏幕,也不是很好看,考虑将滚动条去掉。但是问题又来了,listview每个item都是有点击效果的,用于反馈用户点击已经触发,这个对提高用户友好度很重要,但是设置了padding之后,点击效果的区域也添加了padding。一般来说这个不太影响,以前的项目也都到此步骤就结束了。

还有一种方式就是listview设置dividerHeight=0,然后自己去Item View去画一条线,这个过于复杂,肯定直接排除掉。

接下来考虑通过xml画图的方式来解决这个问题,一般的xml画的线都是竖着的,所以不行。

这里采用的是layer-list,因为layer-list可以处理几个资源叠加起来的情况,更重要的是可以设置边界,由于divider可以设置宽度,这里只需要画一个横向有padding,然后纯色的item就可以了。

<?xml version="1.0" encoding="utf-8"?>  
<!--用于listView中作为纯色的divider,左右默认有10dp的空白,高度设置为1px比较美观-->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:drawable="@color/trans_black_20"
        android:left="10dp"
        android:right="10dp" />
</layer-list>

还可以使用inset,如下:

<?xml version="1.0" encoding="UTF-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:insetLeft="10dp"
    android:insetRight="10dp"
    android:drawable="@color/red">
</inset>

使用的时候设置 divider="@drawable/xxx" , dividerHeight="1px" 就行了。由于生成的图片本身带padding,而且纯代码的图片占空间很小,完美解决了以上问题。



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值