学习 android:layout_weight 权重

写了一个小Demo遇到了android:layout_weight了解了一下原理。 具体分配剩余空间为什么这样算我也不清楚！

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
            android:orientation="horizontal">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="#77bc1f"
                android:text="AAA"
                android:textColor="#fff"
                android:textSize="23sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:background="#06d992"
                android:text="BBB"
                android:textColor="#fff"
                android:textSize="23sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="3"
                android:background="#EEA32E"
                android:text="CCC"
                android:textColor="#fff"
                android:textSize="23sp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
            android:orientation="horizontal">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="#77bc1f"
                android:text="AAA"
                android:textColor="#fff"
                android:textSize="23sp" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:background="#06d992"
                android:text="BBB"
                android:textColor="#fff"
                android:textSize="23sp" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="3"
                android:background="#EEA32E"
                android:text="CCC"
                android:textColor="#fff"
                android:textSize="23sp" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
            android:orientation="horizontal">

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="#77bc1f"
                android:text="AAA"
                android:textColor="#fff"
                android:textSize="23sp" />

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="2"
                android:background="#06d992"
                android:text="BBB"
                android:textColor="#fff"
                android:textSize="23sp" />

            <TextView
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="3"
                android:background="#EEA32E"
                android:text="CCC"
                android:textColor="#fff"
                android:textSize="23sp" />
        </LinearLayout>
    </LinearLayout>

这段代码实现的UI效果如下：

image

整个布局是个垂直的LinearLayout，里面有三个水平方向的LinearLayout，内部放置了三个TextView，三个TextView高度为wrap_content；其内容和背景色也不同（这里只是为了看起来方便），重点是其宽度：

第一行内三个TextView

layout_width="wrap_content"

第二行内三个TextView

android:layout_width="match_parent"

第三行内三个TextView

android:layout_width="0dp"

而每一个LinearLayout内部三个TextView的layout_weight分别1，2，3。由此，看见由于其wrap_content的不同，使其layout_weight的分配受到了影响。这里就来分析一下，按照之前所说，layout_weight会按屏幕剩余空间，按权重分配空间。

第一种情况（第一个LinearLayout）

系统先给3个TextView分配他们的宽度值wrap_content（宽度足以包含他们的内容1,2,3即可），然后会把剩下来的屏幕空间按照1:2:3的比列分配给3个textview，
上面的UI 比重为 ：
61/6 ，62/6，6*3/6 即1:2:3 ，如UI 第一行呈现的那样。

第二种情况（第二个LinearLayout）

系统先给3个textview分配他们所要的宽度match_parent，也就是说每一都是填满他的父控件，这里就是屏幕的宽度.
那么这时候的剩余空间=1个parent_width-3个parent_width=-2个parent_width (parent_width指的是屏幕宽度 )

那么第一个TextView的实际所占宽度应该=match_parent的宽度,
即parent_width + 他所占剩余空间的权重比列1/6 * 剩余空间大小（-2 parent_width）=2/3parent_width

同理第二个TextView的实际所占宽度=parent_width + 2/6*(-2parent_width)=1/3parent_width;

第三个TextView的实际所占宽度=parent_width + 3/6*(-2parent_width)=0parent_width；所以就是2:1:0的比列显示了。
即如UI第二行呈现的那样。

第二种的另一个解释：

第二种情况具体分析如下：
假设屏幕宽度为1。那么三个控件占据后的剩余空间就是 1-1*3=-2；
然后将剩余的-2宽度屏幕控件按照 1：2：3 的比例分给三个控件。

A: -2*(1/6)=-1/3 ； 然后原来分配给控件的宽度为1；1+(-1/3)=2/3；故实际宽度为2/3

B: -2*(2/6)=-2/3 ；同上，1+(-2/3)=1/3；故实际宽度为1/3

C: -2*(3/6)=-1；同上，1+(-1)=0;故实际宽度为0

整理自：https://www.jianshu.com/p/ddc9253be59f 及其评论内容