LinearLayout layout_weight解析

         LinearLayout是Android布局中经常使用的一种布局，layout_weight属性经在Linearlayout布局中常使用，至于layout_weight的宽度是怎样计算出来的，只有了解了其中的原理，才能真正了解layout_weight的宽度到底是怎么样确定的。

 

         以下是Linearlayout的layout_weight计算原理（只针对orientation为horizontal讲解，vertical的原理相同）。

 

layout_weight的宽度计算主要分为两种：

1、子View 的宽度都为wrap_contet 类型

三个LinearLayoutLA、LB、LC的都是 layout_width="wrap_content" 时，weight取值分别为1、2、3，会得到以下效果:

 

<?xml version="1.0" encoding="UTF-8"?>   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"       android:layout_width="fill_parent"       android:layout_height="fill_parent"       android:orientation="horizontal"     android:background="#FF000000" >           <LinearLayout         android:id="@+id/LA"         android:orientation="horizontal"         android:background="#ffff0000"           android:textColor="@android:color/white"                 android:layout_width="wrap_content"           android:layout_height="100px"           android:layout_weight="1"/>               <LinearLayout         android:id="@+id/LB"         android:orientation="horizontal"         android:background="#ffcccccc"                   android:layout_width="wrap_content"           android:layout_height="wrap_content"           android:layout_weight="2">         <TextView               android:background="#ffcccccc"               android:layout_width="300px"               android:layout_height="100px"               android:text="2"               android:textColor="@android:color/black"             android:textSize="30sp" />       </LinearLayout>          <LinearLayout            android:id="@+id/LC"         android:orientation="horizontal"         android:background="#ffddaacc"           android:textColor="@android:color/black"                   android:layout_width="wrap_content"           android:layout_height="100px"           android:layout_weight="3" />   </LinearLayout>

        

         系统先给3个LinearLayout分配他们的宽度值wrap_content（宽度足以包含他们的内容1,2,3即可），然后会把剩下来的屏幕空间按照1:2:3的比列分配给3个LinearLayout，所以就出现了上面的图像。

 

计算原理：LB中有一个TextView宽度为300px，所以会先给LB分300px，然后把剩下的宽度按比例分给LA、LB、LC

LA的宽度 = (1080 - 300) / (1 +2 +3) * 1 LB的宽度 = (1080 - 300) / (1 +2 +3) * 2 + 300 LC的宽度 = (1080 - 300) / (1 +2 +3) * 3

 

注：如果子View设有padding或者margin，先把padding或者margin去掉，然后按照上述的逻辑进行计算

如：

<?xml version="1.0" encoding="UTF-8"?>   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"       android:layout_width="fill_parent"       android:layout_height="fill_parent"       android:orientation="horizontal"     android:background="#FF000000" >           <LinearLayout         android:id="@+id/LA"         android:orientation="horizontal"         android:background="#ffff0000"           android:textColor="@android:color/white"         android:layout_marginLeft="180px"         android:layout_width="wrap_content"           android:layout_height="100px"           android:layout_weight="1"/>               <LinearLayout         android:id="@+id/LB"         android:orientation="horizontal"         android:background="#ffcccccc"                   android:layout_width="wrap_content"           android:layout_height="wrap_content"           android:layout_weight="2">         <TextView               android:background="#ffcccccc"               android:layout_width="300px"               android:layout_height="100px"               android:text="2"               android:textColor="@android:color/black"             android:textSize="30sp" />       </LinearLayout>          <LinearLayout            android:id="@+id/LC"         android:orientation="horizontal"         android:background="#ffddaacc"           android:textColor="@android:color/black"                   android:layout_width="wrap_content"           android:layout_height="100px"           android:layout_weight="3" />   </LinearLayout>

计算原理：LA设置了marginLeft180px，  LB中有一个TextView宽度为300px，所以会先把LA的marginLeft去掉，其次给LB分300px，然后把剩下的宽度按比例分给LA、LB、LC

 

LA的宽度 = (1080 - 180 - 300) / (1 +2 +3) * 1 = 100 ，marginLeft为180 LB的宽度 = (1080 - 180 - 300) / (1 +2 +3) * 2 + 300  = 500 LC的宽度 = (1080 - 180 - 300) / (1 +2 +3) * 3 = 300

 

同理：padding也是同样的计算方法

 

2、子View 的宽度都为fill_parent 类型

         在使用fill_parent时，实际发现权重小，反而分的越多，这是为什么呢？？？网上很多人说是当layout_width= "fill_parent" 时，weight值越小权重越大，优先级越高，但并不清除其中的具体计算规则。

 

三个LinearLayoutLA、LB、LC的都是 layout_width="fill_content" 时，weight取值分别为1、2、3，会得到以下效果:

 

<?xml version="1.0" encoding="UTF-8"?>   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"       android:layout_width="fill_parent"       android:layout_height="fill_parent"       android:orientation="horizontal"     android:background="#FF000000" >           <LinearLayout         android:id="@+id/LA"         android:orientation="horizontal"         android:background="#ffff0000"           android:textColor="@android:color/white"         android:layout_width="fill_parent"           android:layout_height="100px"           android:layout_weight="1"/>               <LinearLayout         android:id="@+id/LB"         android:orientation="horizontal"         android:background="#ffcccccc"                   android:layout_width="fill_parent"           android:layout_height="wrap_content"           android:layout_weight="2">         <TextView               android:background="#ffcccccc"               android:layout_width="300px"               android:layout_height="100px"               android:text="2"               android:textColor="@android:color/black"             android:textSize="30sp" />       </LinearLayout>          <LinearLayout            android:id="@+id/LC"         android:orientation="horizontal"         android:background="#ffddaacc"           android:textColor="@android:color/black"                   android:layout_width="fill_parent"           android:layout_height="100px"           android:layout_weight="3" />   </LinearLayout>

 

计算原理如下：

系统先给3个View分配他们所要的宽度fill_parent，也就是说每一都是填满他的父控件，这里就是屏幕的宽度   那么这时候的剩余空间=1个parent_width-3个parent_width=-2个parent_width (parent_width指的是屏幕宽度 )   LA的实际所占宽度 LA Width = fill_parent的宽度 + 他所占剩余空间的权重比列 即：LA Width = parent_width  +  1/6 * ( -2 parent_width) = 2/3 parent_width   LB的实际所占宽度 LB Width = parent_width + 2/6*(-2parent_width) = 1/3parent_width;   LC的实际所占宽度 LC Width = parent_width + 3/6*(-2parent_width) = 0；   所以就是2:1:0的比列显示了。   这样你也就会明白为什么当你把三个Layout_weight设置为1、2、3的话,会出现上面的效果了：

 

注：如果子View设有padding或者margin，然后按照上述的逻辑进行计算，然后再把padding或者margin从分得的宽度中去掉，

 

如：

<?xml version="1.0" encoding="UTF-8"?>   <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"       android:layout_width="fill_parent"       android:layout_height="fill_parent"       android:orientation="horizontal"     android:background="#FF000000" >           <LinearLayout         android:id="@+id/LA"         android:orientation="horizontal"         android:background="#ffff0000"           android:textColor="@android:color/white"                 android:layout_marginLeft="180px"         android:layout_width="fill_parent"           android:layout_height="100px"           android:layout_weight="1"/>               <LinearLayout         android:id="@+id/LB"         android:orientation="horizontal"         android:background="#ffcccccc"                   android:layout_width="fill_parent"           android:layout_height="wrap_content"           android:layout_weight="2">         <TextView               android:background="#ffcccccc"               android:layout_width="300px"               android:layout_height="100px"               android:text="2"               android:textColor="@android:color/black"             android:textSize="30sp" />       </LinearLayout>          <LinearLayout            android:id="@+id/LC"         android:orientation="horizontal"         android:background="#ffddaacc"           android:textColor="@android:color/black"                   android:layout_width="fill_parent"           android:layout_height="100px"           android:layout_weight="3" />   </LinearLayout>

 

 

3、总结

         layout_weight并不是view的最终宽度(或者高度)的百分比，而是根据一定的规则进行计算出来的，在进行界面布局的时候一定要注意这一点。

 

另外：一些自定义的View中使用layout_weight可能达到的效果和上面讲述的不相同，因为自定义的VIew可能修改了View的onLayout和onMeasure函数，导致界面元素宽度计算有问题

 

部分内容参考以下网站   http://mobile.51cto.com/abased-375428.htm