android:layout_weight 属性详解

android:layout_weight 属性详解


【一】计算方法

        (以宽度为例)设总宽度为 W,子组件 x1、x2、x3 的声明宽度为分别为 w'1、w'2、w'3,“剩余宽度”分配计算前子组件已占用的总宽度为 W' (即:子组件声明宽度总和 W'= w'1+w'2+w'3),子组件 x1、x2、x3 的最终实际宽度分别为 w1、w2、w3,剩余总宽度为 W* 。子组件 x1、x2、x3 的 layout_weight 值分别为 weight1、weight2、weight3 。则:
        
        剩余总宽度 = 总宽度 - 声明总宽度
         W* = W - W'  
         W* =W -(w'1+w'2+w'3)
  
        最终实际宽度 = 声明宽度 + 剩余总宽度 × weight权重
         w1 = w'1 +  W* × Ratio1    其中:Ratio1=  weight1 /(weight1+weight2+weight3)
         w2 = w'2 +  W* × Ratio2    其中:Ratio2=  weight2 /(weight1+weight2+weight3)
         w3 = w'3 +  W* × Ratio3    其中:Ratio3=  weight3 /(weight1+weight2+weight3)

【二】举个栗子

  1. 控件的 layout_width设置为"0"

   1)xml配置
<LinearLayout

      android:orientation="horizontal"

      android:layout_width="fill_parent"

      android:layout_height="fill_parent"

      android:layout_weight="1">

      <TextView

          android:layout_width="0dp"

          android:layout_height="fill_parent"

          android:layout_weight="1"

          android:background="#aa0000"

          android:gravity="center"

          android:text="1111111111111111111111111111111111111111111"/>

      <TextView

          android:layout_width="0dp"

          android:layout_height="fill_parent"

          android:layout_weight="2"

          android:background="#00aa00"

          android:gravity="center"

          android:text="2"/>

      <TextView

          android:layout_width="0dp"

          android:layout_height="fill_parent"

          android:layout_weight="3"

          android:background="#0000aa"

          android:gravity="center"

          android:text="3"/>

  </LinearLayout>

      2)效果
    3)说明
     因为 android:layout_width="0dp",w'1=w'2=w'3=0,W'=0     
     所以 w1=0+(W-0)×(1/6)=1/6W 
             w2=0+(W-0)×(2/6)=2/6W
             w3=0+(W-0)×(3/6)=3/6W
     比例为 1:2:3



  2. 控件的layout_width设置为"wrap_content"

    1)xml配置

<LinearLayout

      android:orientation="horizontal"

      android:layout_width="fill_parent"

      android:layout_height="fill_parent"

      android:layout_weight="1"

     >

      <TextView

          android:layout_width="wrap_content"

          android:layout_height="fill_parent"

          android:layout_weight="1"

          android:background="#aa0000"

          android:gravity="center"

          android:text="1"/>

      <TextView

          android:layout_width="wrap_content"

          android:layout_height="fill_parent"

          android:layout_weight="2"

          android:background="#00aa00"

          android:gravity="center"

          android:text="1"/>

      <TextView

          android:layout_width="wrap_content"

          android:layout_height="fill_parent"

          android:layout_weight="3"

          android:background="#0000aa"

          android:gravity="center"

          android:text="1"/>

  </LinearLayout>

    2)效果
    3)说明
       因为 android:layout_width="wrap_content",且content都是一个数字,w'1=w'2=w'3=一个数字宽度
       w1、w2、w3 与上例差异不大
       比例接近 1:2:3

  3. 控件的layout_width设置为"wrap_content",TextView1的文本长度较大

    1)xml配置

<LinearLayout

      android:orientation="horizontal"

      android:layout_width="fill_parent"

      android:layout_height="fill_parent"

      android:layout_weight="1">

      <TextView

          android:layout_width="wrap_content"

          android:layout_height="fill_parent"

          android:layout_weight="1"

          android:background="#aa0000"

          android:gravity="center"

          android:text="1111111111111111111111111111111111111111111"/>

      <TextView

          android:layout_width="wrap_content"

          android:layout_height="fill_parent"

          android:layout_weight="2"

          android:background="#00aa00"

          android:gravity="center"

          android:text="2"/>

      <TextView

          android:layout_width="wrap_content"

          android:layout_height="fill_parent"

          android:layout_weight="3"

          android:background="#0000aa"

          android:gravity="center"

          android:text="3"/>

  </LinearLayout></span>

    2)效果


    3)说明
       因为 android:layout_width="wrap_content",且TextView1 的 content 较长,
       估设w'1=40, w'2=1,w'3=1 ,总宽W=64
       则,W'=42 , W*=64-42=22 ,
       w1=40+22×(1/6)=44
       w2=1+22×(2/6)=8
       w3=1+22×(3/6)=12
       比例接近 11:2:3

  4. 控件的layout_width设置为"fill_parent" , weight为1、2、3

    1)xml配置
<LinearLayout

      android:orientation="horizontal"

      android:layout_width="fill_parent"

      android:layout_height="fill_parent"

      android:layout_weight="1">

      <TextView

          android:layout_width="fill_parent"

          android:layout_height="fill_parent"

          android:layout_weight="1"

          android:background="#aa0000"

          android:gravity="center"

          android:text="1"/>

      <TextView

          android:layout_width="fill_parent"

          android:layout_height="fill_parent"

          android:layout_weight="2"

          android:background="#00aa00"

          android:gravity="center"

          android:text="2"/>

      <TextView

          android:layout_width="fill_parent"

          android:layout_height="fill_parent"

          android:layout_weight="3"

          android:background="#0000aa"

          android:gravity="center"

          android:text="3"/>

  </LinearLayout>

    2)效果

    3)说明
       因为 android:layout_width="fill_parent", w'1=w'2=w'3=W(总宽),W'=3W ,W*=W-3W=-2W
       w1=W+(-2W) ×(1/6)=2/3W
       w2=W+(-2W)×(2/6)=1/3W
       w3=W+(-2W)×(3/6)=0
       比例= 2:1:0

  5. 控件的layout_width设置为"fill_parent",weight为2、3、4

    1) xml配置
<LinearLayout

      android:orientation="horizontal"

      android:layout_width="fill_parent"

      android:layout_height="fill_parent"

      android:layout_weight="1">

      <TextView

          android:layout_width="fill_parent"

          android:layout_height="fill_parent"

          android:layout_weight="2"

          android:background="#aa0000"

          android:gravity="center"

          android:text="2"/>

      <TextView

          android:layout_width="fill_parent"

          android:layout_height="fill_parent"

          android:layout_weight="3"

          android:background="#00aa00"

          android:gravity="center"

          android:text="3"/>

      <TextView

          android:layout_width="fill_parent"

          android:layout_height="fill_parent"

          android:layout_weight="4"

          android:background="#0000aa"

          android:gravity="center"

          android:text="4"/>

  </LinearLayout>

    2)效果

    3)说明
       因为 android:layout_width="fill_parent", w'1=w'2=w'3=W(总宽),W'=3W ,W*=W-3W=-2W
       w1=W+(-2W) ×(2/9)=5/9W
       w2=W+(-2W)×(3/9)=3/9W
       w3=W+(-2W)×(4/9)=1/9W
       比例= 5:3:1

     【注】如果需 w1:w2:w3 = 1:2:3 
                 可以这么算:1/6 : 2/6 : 3/6  --> (分母-分子)--> 5:4:3(即 layout_weight值)

【三】参考源码

         http://blog.sina.com.cn/s/blog_7cd0c0a80100zmfe.html

猜你喜欢

转载自blog.csdn.net/zhoaya188/article/details/47088081
今日推荐