詳解Android 硬布局item的高級(jí)寫法
本文主要介紹了Android 硬布局item的高級(jí)寫法,分享給大家,具體如下:
效果:
這種布局應(yīng)該是非常常見了,且寫的比較多。今天簡(jiǎn)單探討一下效果圖中上下兩種布局的寫法。
比較上下效果一致 行數(shù) 層級(jí) 上部分 121 3 下部分 55 2 下部分繼續(xù)精簡(jiǎn) 28 2
可以看出,對(duì)比還是很明顯的,精簡(jiǎn)到最后只有最開始的四分之一。
上部分先看常規(guī)item寫法,橫向的LinearLayout嵌套三個(gè)子View,分別是
左邊的ImageView, 中間的TextView, 和右邊的ImageView。然后每個(gè)橫向的LinearLayout之間添加一個(gè)高度1dp的View來作為橫線。
<LinearLayout android:layout_width='match_parent' android:layout_height='wrap_content' android:layout_marginStart='@dimen/dp_15' android:layout_marginTop='@dimen/dp_20' android:layout_marginEnd='@dimen/dp_15' android:layout_marginBottom='@dimen/dp_20' android:background='@drawable/shape_bg_white' android:orientation='vertical'> <LinearLayout android: android:layout_width='match_parent' android:layout_height='wrap_content' android:foreground='?android:attr/selectableItemBackground' android:gravity='center_vertical' android:orientation='horizontal' android:padding='@dimen/dp_20'> <ImageViewandroid:layout_width='wrap_content'android:layout_height='wrap_content'android:contentDescription='@string/app_name'android:src='http://m.b3g6.com/bcjs/@mipmap/ic_agreement' /> <TextViewandroid:layout_width='0dp'android:layout_height='wrap_content'android:layout_marginStart='@dimen/dp_20'android:layout_weight='1'android:includeFontPadding='false'android:text='刪除個(gè)人信息'android:textColor='@color/color_505258'android:textSize='@dimen/sp_14' /> <ImageViewandroid:layout_width='wrap_content'android:layout_height='wrap_content'android:contentDescription='@string/app_name'android:src='http://m.b3g6.com/bcjs/@mipmap/ic_arrow_right' /> </LinearLayout> <View android:layout_width='match_parent' android:layout_height='1dp' android:layout_marginStart='@dimen/dp_50' android:background='@color/color_F6F6F6' /> <LinearLayout android: android:layout_width='match_parent' android:layout_height='wrap_content' android:foreground='?android:attr/selectableItemBackground' android:gravity='center_vertical' android:orientation='horizontal' android:padding='@dimen/dp_20'> <ImageViewandroid:layout_width='wrap_content'android:layout_height='wrap_content'android:contentDescription='@string/app_name'android:src='http://m.b3g6.com/bcjs/@mipmap/ic_agreement' /> <TextViewandroid:layout_width='0dp'android:layout_height='wrap_content'android:layout_marginStart='@dimen/dp_20'android:layout_weight='1'android:includeFontPadding='false'android:text='注銷賬戶'android:textColor='@color/color_505258'android:textSize='@dimen/sp_14' /> <ImageViewandroid:layout_width='wrap_content'android:layout_height='wrap_content'android:contentDescription='@string/app_name'android:src='http://m.b3g6.com/bcjs/@mipmap/ic_arrow_right' /> </LinearLayout> <View android:layout_width='match_parent' android:layout_height='1dp' android:layout_marginStart='@dimen/dp_50' android:background='@color/color_F6F6F6' /> <LinearLayout android: android:layout_width='match_parent' android:layout_height='wrap_content' android:foreground='?android:attr/selectableItemBackground' android:gravity='center_vertical' android:orientation='horizontal' android:padding='@dimen/dp_20'> <ImageViewandroid:layout_width='wrap_content'android:layout_height='wrap_content'android:contentDescription='@string/app_name'android:src='http://m.b3g6.com/bcjs/@mipmap/ic_agreement' /> <TextViewandroid:layout_width='0dp'android:layout_height='wrap_content'android:layout_marginStart='@dimen/dp_20'android:layout_weight='1'android:includeFontPadding='false'android:text='關(guān)于'android:textColor='@color/color_505258'android:textSize='@dimen/sp_14' /> <ImageViewandroid:layout_width='wrap_content'android:layout_height='wrap_content'android:contentDescription='@string/app_name'android:src='http://m.b3g6.com/bcjs/@mipmap/ic_arrow_right' /> </LinearLayout> </LinearLayout>
可以看到嵌套雖然不深,但是已經(jīng)拉的很長(zhǎng),不易閱讀修改。且 哪怕是一層的嵌套優(yōu)化,也是優(yōu)化,積少成多。
下部分利用TextView的drawableStart和drawableEnd屬性,來做簡(jiǎn)化,可以直接去掉左右兩邊的ImageView。至于分割線,利用LinearLayout的divider和showDividers屬性,寫個(gè)shape,來做簡(jiǎn)化,去掉item之間做橫線的View。
<LinearLayout android:layout_width='match_parent' android:layout_height='wrap_content' android:layout_marginHorizontal='@dimen/dp_15' android:layout_marginVertical='@dimen/dp_20' android:background='@drawable/shape_bg_white' android:divider='@drawable/shape_divider_my' android:orientation='vertical' android:showDividers='middle'> <TextView android: android:layout_width='match_parent' android:layout_height='wrap_content' android:drawablePadding='@dimen/dp_16' android:foreground='?android:attr/selectableItemBackground' android:gravity='center_vertical' android:includeFontPadding='false' android:padding='@dimen/dp_20' android:text='刪除個(gè)人信息' android:textColor='@color/color_505258' android:textSize='@dimen/sp_14' app:drawableEndCompat='@mipmap/ic_arrow_right' app:drawableStartCompat='@mipmap/ic_agreement' /> <TextView android: android:layout_width='match_parent' android:layout_height='wrap_content' android:drawablePadding='@dimen/dp_16' android:foreground='?android:attr/selectableItemBackground' android:gravity='center_vertical' android:includeFontPadding='false' android:padding='@dimen/dp_20' android:text='注銷賬戶' android:textColor='@color/color_505258' android:textSize='@dimen/sp_14' app:drawableEndCompat='@mipmap/ic_arrow_right' app:drawableStartCompat='@mipmap/ic_agreement' /> <TextView android: android:layout_width='match_parent' android:layout_height='wrap_content' android:drawablePadding='@dimen/dp_16' android:foreground='?android:attr/selectableItemBackground' android:gravity='center_vertical' android:includeFontPadding='false' android:padding='@dimen/dp_20' android:text='關(guān)于' android:textColor='@color/color_505258' android:textSize='@dimen/sp_14' app:drawableEndCompat='@mipmap/ic_arrow_right' app:drawableStartCompat='@mipmap/ic_agreement' /> </LinearLayout>
shape:
<?xml version='1.0' encoding='utf-8'?><layer-list xmlns:android='http://schemas.android.com/apk/res/android'> <item android:left='@dimen/dp_50' > <shape android:shape='rectangle'> <solid android:color='@color/color_F6F6F6' /> <size android: /> </shape> </item></layer-list>
可以看到,層級(jí)減少了,行數(shù)也減少了,看起來清爽多了。
style簡(jiǎn)化盡管如此,我們還是有可以簡(jiǎn)化的空間。TextView有一些共同屬性,可以抽取做一個(gè)style。
<style name='MyTextView'> <item name='android:layout_width'>match_parent</item> <item name='android:layout_height'>wrap_content</item> <item name='android:drawablePadding'>@dimen/dp_16</item> <item name='android:foreground'>?android:attr/selectableItemBackground</item> <item name='android:gravity'>center_vertical</item> <item name='android:includeFontPadding'>false</item> <item name='android:padding'>@dimen/dp_20</item> <item name='android:textColor'>@color/color_505258</item> <item name='android:textSize'>@dimen/sp_14</item> <item name='drawableEndCompat'>@mipmap/ic_arrow_right</item> </style>
再看簡(jiǎn)化后的代碼
<LinearLayout android:layout_width='match_parent' android:layout_height='wrap_content' android:layout_marginHorizontal='@dimen/dp_15' android:layout_marginVertical='@dimen/dp_20' android:background='@drawable/shape_bg_white' android:divider='@drawable/shape_divider_my' android:orientation='vertical' android:showDividers='middle'> <TextView android: android:text='刪除個(gè)人信息' app:drawableStartCompat='@mipmap/ic_agreement' /> <TextView android: android:text='注銷賬戶' app:drawableStartCompat='@mipmap/ic_agreement' /> <TextView android: android:text='關(guān)于' app:drawableStartCompat='@mipmap/ic_agreement' /> </LinearLayout>
更加精簡(jiǎn)了,只有簡(jiǎn)化前的一半,共同屬性封裝,只需要關(guān)注業(yè)務(wù)參數(shù)。
核心屬性LinearLayout
divider,分割線 showDividers,分割線的顯示方式 layout_marginVertical,代替原來的layout_marginTop、layout_marginBottom layout_marginHorizontal,代替原來的layout_marginStart、layout_marginEnd題外話,LinearLayout的android:animateLayoutChanges='true',可以在其子view添加移除的時(shí)候添加簡(jiǎn)單的動(dòng)畫。
TextView
drawableEndCompat,即原來的drawableEnd,設(shè)置右邊的drawable,其他方向同理 drawablePadding,drawable與文字之前的內(nèi)邊距 includeFontPadding,TextView默認(rèn)top是有6dp的padding的,false可去掉,小細(xì)節(jié) foreground,添加這個(gè)屬性會(huì)有水波紋的點(diǎn)擊效果,省了寫selector到此這篇關(guān)于詳解Android 硬布局item的高級(jí)寫法的文章就介紹到這了,更多相關(guān)Android 硬布局item內(nèi)容請(qǐng)搜索好吧啦網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持好吧啦網(wǎng)!
相關(guān)文章:
1. PHP使用Swagger生成好看的API文檔2. ASP.NET MVC使用jQuery ui的progressbar實(shí)現(xiàn)進(jìn)度條3. Python3 json模塊之編碼解碼方法講解4. Python 制作查詢商品歷史價(jià)格的小工具5. Python 如何調(diào)試程序崩潰錯(cuò)誤6. Python 利用Entrez庫篩選下載PubMed文獻(xiàn)摘要的示例7. ASP基礎(chǔ)知識(shí)VBScript基本元素講解8. python使用jenkins發(fā)送企業(yè)微信通知的實(shí)現(xiàn)9. Python sublime安裝及配置過程詳解10. Python 合并拼接字符串的方法

網(wǎng)公網(wǎng)安備