相信大家應(yīng)該都用過(guò)LinearLayout的android:layout_weight屬性,android:layout_weight是線性布局LinearLayout中非常重要的一個(gè)屬性,它的主要作用是分配剩余空間,所謂的剩余空間是線性布局中把子組件所占的空間分配后剩余的空間铺韧,每個(gè)子組件占用剩余的比例等于自身所設(shè)的layout_weight參數(shù)乘以所有子組件所設(shè)置layout_weight參數(shù)之和,下面就以LinearLayout的horizontal方向舉例
計(jì)算公式:
剩余空間 = 父組件的寬度 - 各子組件所設(shè)置的寬或所占的寬
子組件所占空間 = 所設(shè)置的寬或所占寬 + layout_weight * 剩余空間
*注: 最終子組件所占用的空間大小 與 android:layout_width 屬性有很大關(guān)系,以下分別舉例 *
設(shè)置值為: match_parent
首先看一下布局xml:
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="match_parent情況:(1:2:3)"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="30dp"
android:orientation="horizontal">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="item1"
android:background="#FF0000"/>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="2"
android:gravity="center"
android:text="item2"
android:background="#00FF00"/>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="3"
android:gravity="center"
android:text="item3"
android:background="#FF00FF"/>
</LinearLayout>
效果圖如下:
看到效果圖后是不是覺(jué)得很驚訝灶搜,怎么只顯示1祟蚀、2,而3沒(méi)顯示出來(lái)割卖。不要著急前酿,我們根據(jù)計(jì)算公式,一步一步來(lái)解析鹏溯,查看xml布局可以看到各子組件android:layout_weight之和為6罢维,TextView1、TextView2丙挽、TextView3各占剩余空間比例為1/6肺孵、2/6、3/6颜阐。各子組件和父組件寬度屬性都為android:layout_width="match_parent"平窘,即都撐滿整個(gè)屏幕寬度,套用公式可以得出:
剩余空間 = 屏幕寬度 - TextView1所設(shè)置寬度(即屏幕寬度) - TextView2所設(shè)置寬度(即屏幕寬度) - TextView3所設(shè)置寬度(即屏幕寬度) = -2個(gè)屏幕寬度(是的凳怨,你沒(méi)看錯(cuò)瑰艘。此處剩余空間為負(fù))
那么組件1所占空間 = TextView1所設(shè)置寬度(即屏幕寬度) + 1/6 * (-2個(gè)屏幕寬度) = 2/3個(gè)屏幕寬度
組件2所占空間 = TextView2所設(shè)置寬度(即屏幕寬度) + 2/6 * (-2個(gè)屏幕寬度) = 1/3個(gè)屏幕寬度
組件3所占空間 = TextView3所設(shè)置寬度(即屏幕寬度) + 3/6 * (-2個(gè)屏幕寬度) = 0
根據(jù)計(jì)算,我們可以看到組件3所占空間為0肤舞,且組件1和組件2所占空間比為2:1紫新,和效果圖一樣。
設(shè)置值為: wrap_content
看一下布局xml
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="wrap_content:(1:2:3)"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="30dp"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="item1"
android:background="#FF0000"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="2"
android:gravity="center"
android:text="item2"
android:background="#00FF00"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="3"
android:gravity="center"
android:text="item3"
android:background="#FF00FF"/>
</LinearLayout>
效果圖如下:
可以看到各子組件android:layout_weight之和為6李剖,TextView1芒率、TextView2、TextView3各占剩余空間比例為1/6篙顺、2/6偶芍、3/6充择。各子組件所設(shè)置android:layout_width屬性為wrap_content,即依內(nèi)容而定腋寨,此處為各自文本字符串1聪铺、2化焕、3的寬度萄窜;父組件寬度屬性為android:layout_width="match_parent",即撐滿整個(gè)屏幕寬度撒桨,套用公式可以得出:
剩余空間 = 屏幕寬度 - 字符串1寬度 - 字符串2寬度 - 字符串3寬度
子組件1所占空間 = TextView1內(nèi)容寬度 + 1/6 * 剩余空間
子組件2所占空間 = TextView2內(nèi)容寬度 + 2/6 * 剩余空間
字組件3所占空間 = TextView3內(nèi)容寬度 + 3/6 * 剩余空間
主意:主意使用wrap_content值的時(shí)候查刻,是會(huì)計(jì)算組件內(nèi)容寬度的,而不是從0計(jì)算的
設(shè)置值為: 0dp
還是先看一下布局xml
<!--wrap_content情況和上面的一樣所以就不寫(xiě)了-->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="0dp:(1:2:3)"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="30dp"
android:orientation="horizontal">
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="item1"
android:background="#FF0000"/>
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:gravity="center"
android:text="item2"
android:background="#00FF00"/>
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="3"
android:gravity="center"
android:text="item3"
android:background="#FF00FF"/>
</LinearLayout>
跟wrap_content對(duì)比后的效果圖:
通過(guò)效果圖對(duì)比可以看到android:layout_weight之和為同樣都是6凤类,各子組件所占比例同樣都是1/6穗泵、2/6、3/6谜疤。但是為什么兩種布局方式子組件所占空間大小卻不同那佃延?答案我就不寫(xiě)了,相信只要仔細(xì)看過(guò)文章都能知道答案了夷磕!