layer-list

效果：

这种布局应该很常见，写的比较多。

今天我就简单讨论一下效果图中上下版面的写法。

比较

可见反差还是很明显的，到最后也只有开头的四分之一。

上部分

先看常规的条目书写方法，水平线布局嵌套了三个子视图，即

左边的ImageView，中间的TextView，和右边的ImageView。

然后在每个水平线布局之间添加一个高度为1dp的视图作为水平线。

& ltlinear layout Android:layout _ width = & # 34；match _ parent & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:layout _ margin start = & # 34；@ dimen/DP _ 15 & # 34；Android:layout _ margin top = & # 34；@ dimen/DP _ 20 & # 34；Android:layout _ margin end = & # 34；@ dimen/DP _ 15 & # 34；Android:layout _ margin bottom = & # 34；@ dimen/DP _ 20 & # 34；安卓:背景= & # 34；@ drawable/shape _ BG _ white & # 34；Android:orientation = & # 34；垂直& # 34；& gt& ltlinear layout Android:id = & # 34；@+id/ll1 & # 34；Android:layout _ width = & # 34；match _ parent & # 34Android:layout _ height = & # 34；wrap _ content & # 34android:前景= & # 34；？Android:attr/selectable item background & # 34；安卓:重力= & # 34；居中_垂直& # 34；Android:orientation = & # 34；水平& # 34；Android:padding = & # 34；@ dimen/DP _ 20 & # 34；& gt& ltImageView Android:layout _ width = & # 34；wrap _ content & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:content description = & # 34；@ string/app _ name & # 34；Android:src = & # 34；@ MIP map/IC _ agreement & # 34；/& gt；& ltTextView Android:layout _ width = & # 34；0dp & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:layout _ margin start = & # 34；@ dimen/DP _ 20 & # 34；Android:layout _ weight = & # 34；1"Android:includeFontPadding = & # 34；假& # 34；Android:text = & # 34；删除个人信息& # 34；Android:text color = & # 34；@ color/color _ 505258 & # 34；Android:textSize = & # 34；@ dimen/sp _ 14 & # 34；/& gt；& ltImageView Android:layout _ width = & # 34；wrap _ content & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:content description = & # 34；@ string/app _ name & # 34；Android:src = & # 34；@ MIP map/IC _ arrow _ right & # 34；/& gt；& lt/linear layout & gt；& lt查看Android:layout _ width = & # 34；match _ parent & # 34Android:layout _ height = & # 34；1dp & # 34Android:layout _ margin start = & # 34；@ dimen/DP _ 50 & # 34；安卓:背景= & # 34；@ color/color _ f6f 6 f 6 & # 34；/& gt；& ltlinear layout Android:id = & # 34；@+id/ll2 & # 34；Android:layout _ width = & # 34；match _ parent & # 34Android:layout _ height = & # 34；wrap _ content & # 34android:前景= & # 34；？Android:attr/selectable item background & # 34；安卓:重力= & # 34；居中_垂直& # 34；Android:orientation = & # 34；水平& # 34；Android:padding = & # 34；@ dimen/DP _ 20 & # 34；& gt& ltImageView Android:layout _ width = & # 34；wrap _ content & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:content description = & # 34；@ string/app _ name & # 34；Android:src = & # 34；@ MIP map/IC _ agreement & # 34；/& gt；& ltTextView Android:layout _ width = & # 34；0dp & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:layout _ margin start = & # 34；@ dimen/DP _ 20 & # 34；Android:layout _ weight = & # 34；1"Android:includeFontPadding = & # 34；假& # 34；Android:text = & # 34；注销账户& # 34；Android:text color = & # 34；@ color/color _ 505258 & # 34；Android:textSize = & # 34；@ dimen/sp _ 14 & # 34；/& gt；& ltImageView Android:layout _ width = & # 34；wrap _ content & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:content description = & # 34；@ string/app _ name & # 34；Android:src = & # 34；@ MIP map/IC _ arrow _ right & # 34；/& gt；& lt/linear layout & gt；& lt查看Android:layout _ width = & # 34；match _ parent & # 34Android:layout _ height = & # 34；1dp & # 34Android:layout _ margin start = & # 34；@ dimen/DP _ 50 & # 34；安卓:背景= & # 34；@ color/color _ f6f 6 f 6 & # 34；/& gt；& ltlinear layout Android:id = & # 34；@+id/ll3 & # 34；Android:layout _ width = & # 34；match _ parent & # 34Android:layout _ height = & # 34；wrap _ content & # 34android:前景= & # 34；？Android:attr/selectable item background & # 34；安卓:重力= & # 34；居中_垂直& # 34；Android:orientation = & # 34；水平& # 34；Android:padding = & # 34；@ dimen/DP _ 20 & # 34；& gt& ltImageView Android:layout _ width = & # 34；wrap _ content & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:content description = & # 34；@ string/app _ name & # 34；Android:src = & # 34；@ MIP map/IC _ agreement & # 34；/& gt；& ltTextView Android:layout _ width = & # 34；0dp & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:layout _ margin start = & # 34；@ dimen/DP _ 20 & # 34；Android:layout _ weight = & # 34；1"Android:includeFontPadding = & # 34；假& # 34；Android:text = & # 34；关于& # 34；Android:text color = & # 34；@ color/color _ 505258 & # 34；Android:textSize = & # 34；@ dimen/sp _ 14 & # 34；/& gt；& ltImageView Android:layout _ width = & # 34；wrap _ content & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:content description = & # 34；@ string/app _ name & # 34；Android:src = & # 34；@ MIP map/IC _ arrow _ right & # 34；/& gt；& lt/linear layout & gt；& lt/linear layout & gt；

最外层线性布局的背景:

& lt？xml版本= & # 34；1.0"编码= & # 34；utf-8 & # 34；？& gt& ltshape xmlns:Android = & # 34；http://schemas.android.com/apk/res/android" & gt；& lt角落Android:radius = & # 34；10dp & # 34/& gt；& lt固体安卓:color = & # 34@ color/white & # 34；/& gt；& lt/shape & gt；

可以看出，虽然嵌套不深，但是已经拉得很长了，不容易阅读和修改。

而且就算是一层嵌套优化也是一个优化，积少成多。

下部分

利用TextView的drawableStart和drawableEnd属性进行简化，可以直接去掉左右ImageView。

至于分割线，使用LinearLayout的divider和showDividers属性编写一个形状来简化它，并删除项目之间有水平线的视图。

& ltlinear layout Android:layout _ width = & # 34；match _ parent & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:layout _ marginHorizontal = & # 34；@ dimen/DP _ 15 & # 34；Android:layout _ margin vertical = & # 34；@ dimen/DP _ 20 & # 34；安卓:背景= & # 34；@ drawable/shape _ BG _ white & # 34；Android:divider = & # 34；@ drawable/shape _ divider _ my & # 34；Android:orientation = & # 34；垂直& # 34；Android:show dividers = & # 34；中间& # 34；& gt& ltTextView Android:id = & # 34；@+id/TV _ delete _ user & # 34；Android:layout _ width = & # 34；match _ parent & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:drawable padding = & # 34；@ dimen/DP _ 16 & # 34；android:前景= & # 34；？Android:attr/selectable item background & # 34；安卓:重力= & # 34；居中_垂直& # 34；Android:includeFontPadding = & # 34；假& # 34；Android:padding = & # 34；@ dimen/DP _ 20 & # 34；Android:text = & # 34；删除个人信息& # 34；Android:text color = & # 34；@ color/color _ 505258 & # 34；Android:textSize = & # 34；@ dimen/sp _ 14 & # 34；app:drawableEndCompat = & # 34；@ MIP map/IC _ arrow _ right & # 34；app:drawableStartCompat = & # 34；@ MIP map/IC _ agreement & # 34；/& gt；& ltTextView Android:id = & # 34；@+id/TV _ logout _ user & # 34；Android:layout _ width = & # 34；match _ parent & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:drawable padding = & # 34；@ dimen/DP _ 16 & # 34；android:前景= & # 34；？Android:attr/selectable item background & # 34；安卓:重力= & # 34；居中_垂直& # 34；Android:includeFontPadding = & # 34；假& # 34；Android:padding = & # 34；@ dimen/DP _ 20 & # 34；Android:text = & # 34；注销账户& # 34；Android:text color = & # 34；@ color/color _ 505258 & # 34；Android:textSize = & # 34；@ dimen/sp _ 14 & # 34；app:drawableEndCompat = & # 34；@ MIP map/IC _ arrow _ right & # 34；app:drawableStartCompat = & # 34；@ MIP map/IC _ agreement & # 34；/& gt；& ltTextView Android:id = & # 34；@+id/TV _关于& # 34；Android:layout _ width = & # 34；match _ parent & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:drawable padding = & # 34；@ dimen/DP _ 16 & # 34；android:前景= & # 34；？Android:attr/selectable item background & # 34；安卓:重力= & # 34；居中_垂直& # 34；Android:includeFontPadding = & # 34；假& # 34；Android:padding = & # 34；@ dimen/DP _ 20 & # 34；Android:text = & # 34；关于& # 34；Android:text color = & # 34；@ color/color _ 505258 & # 34；Android:textSize = & # 34；@ dimen/sp _ 14 & # 34；app:drawableEndCompat = & # 34；@ MIP map/IC _ arrow _ right & # 34；app:drawableStartCompat = & # 34；@ MIP map/IC _ agreement & # 34；/& gt；& lt/linear layout & gt；

形状:

& lt？xml版本= & # 34；1.0"编码= & # 34；utf-8 & # 34；？& gt& lt层列表xmlns:Android = & # 34；http://schemas.android.com/apk/res/android" & gt；& ltitem Android:left = & # 34；@ dimen/DP _ 50 & # 34；& gt& ltshape Android:shape = & # 34；矩形& # 34；& gt& lt固体安卓:color = & # 34@ color/color _ f6f 6 f 6 & # 34；/& gt；& lt尺寸Android:height = & # 34；1dp & # 34/& gt；& lt/shape & gt；& lt/item & gt；& lt/layer-list & gt；

大家可以看到，层次减少了，行数也减少了，看起来清新很多。

style简化

尽管如此，我们仍然有空个房间可以简化。

TextView有一些可以提取为样式的通用属性。

& ltstyle name = & # 34MyTextView & # 34& gt& lt项目名称= & # 34；Android:layout _ width & # 34；& gtmatch _ parent & lt/item & gt；& lt项目名称= & # 34；Android:layout _ height & # 34；& gtwrap _ content & lt/item & gt；& lt项目名称= & # 34；Android:drawable padding & # 34；& gt@ dimen/DP _ 16 & lt；/item & gt；& lt项目名称= & # 34；android:前景& # 34；& gt？Android:attr/selectable item background & lt；/item & gt；& lt项目名称= & # 34；安卓:重力& # 34；& gt居中垂直& lt/item & gt；& lt项目名称= & # 34；Android:includeFontPadding & # 34；& gtfalse & lt/item & gt；& lt项目名称= & # 34；Android:padding & # 34；& gt@ dimen/DP _ 20 & lt；/item & gt；& lt项目名称= & # 34；Android:text color & # 34；& gt@ color/color _ 505258 & lt；/item & gt；& lt项目名称= & # 34；Android:textSize & # 34；& gt@ dimen/sp _ 14 & lt；/item & gt；& lt项目名称= & # 34；drawableEndCompat & # 34& gt@ MIP map/IC _ arrow _ right & lt；/item & gt；& lt/style & gt；

再看简码。

& ltlinear layout Android:layout _ width = & # 34；match _ parent & # 34Android:layout _ height = & # 34；wrap _ content & # 34Android:layout _ marginHorizontal = & # 34；@ dimen/DP _ 15 & # 34；Android:layout _ margin vertical = & # 34；@ dimen/DP _ 20 & # 34；安卓:背景= & # 34；@ drawable/shape _ BG _ white & # 34；Android:divider = & # 34；@ drawable/shape _ divider _ my & # 34；Android:orientation = & # 34；垂直& # 34；Android:show dividers = & # 34；中间& # 34；& gt& ltTextView Android:id = & # 34；@+id/TV _ delete _ user & # 34；style = & # 34@ style/my textview & # 34；Android:text = & # 34；删除个人信息& # 34；app:drawableStartCompat = & # 34；@ MIP map/IC _ agreement & # 34；/& gt；& ltTextView Android:id = & # 34；@+id/TV _ logout _ user & # 34；style = & # 34@ style/my textview & # 34；Android:text = & # 34；注销账户& # 34；app:drawableStartCompat = & # 34；@ MIP map/IC _ agreement & # 34；/& gt；& ltTextView Android:id = & # 34；@+id/TV _关于& # 34；style = & # 34@ style/my textview & # 34；Android:text = & # 34；关于& # 34；app:drawableStartCompat = & # 34；@ MIP map/IC _ agreement & # 34；/& gt；& lt/linear layout & gt；

更精简，只有简化前的一半，有通用属性封装，只需要关注业务参数。

核心属性LinearLayoutdivider，分割线showDividers，分割线的显示方式layout_marginVertical，代替原来的layout_marginTop、layout_marginBottomlayout_marginHorizontal，代替原来的layout_marginStart、layout_marginEnd

题外话，LinearLayout的Android:AnimateLayoutChanges = & # 34；真& # 34；，您可以在添加或删除其子视图时添加简单动画。

TextViewdrawableEndCompat，即原来的drawableEnd，设置右边的drawable，其他方向同理drawablePadding，drawable与文字之前的内边距includeFontPadding，TextView默认top是有6dp的padding的，false可去掉，小细节foreground，添加这个属性会有水波纹的点击效果，省了写selector

好了，这就结束了，枯燥的知识又多了起来。