Android常用布局属性解析 -- Layout_weight

　　Layout_weight是Android开发中一个比较常用的布局属性,在面试中也经常被问到.下面通过实例彻底搞懂Layout_weight的用法.

　　先看下面的布局代码:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="horizontal"
              android:layout_width="match_parent"
              android:layout_height="match_parent">
    <TextView
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="#44ff0000"
        android:gravity="center"
        android:text="111111111111"/>
    <TextView
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="2"
        android:background="#4400ff00"
        android:gravity="center"
        android:text="2"/>
    <TextView
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="3"
        android:background="#440000ff"
        android:gravity="center"
        android:text="3"/>
</LinearLayout>

 　　在水平方向的线性布局中,有三个TextView,layout_width都是0dp,layout_weight分别为1,2,3,所以这三个TextView应该按1:2:3的比例分布,

　　 显示效果:

　　

　　可以看到,虽然三个TextView是按1:2:3的比例进行分布的,但是第一个TextView却没有和另外两个对齐,这是为什么呢?

　　仔细看就能发现,虽然三个TextView不是对齐的,但是第一行的文本是对齐的.

　　

　　我们只需将LinearLayout的baselineAligned属性设置为false即可,baselineAligned表示是否以文本基准线对齐.

　　

　　这只是对layout_weight属性最基本的用法.假如把第一个TextView的layout_width该为wrap_content,会出现什么情况呢?

　　

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="horizontal"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:baselineAligned="false">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="#44ff0000"
        android:gravity="center"
        android:text="111111111111"/>
    <TextView
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="2"
        android:background="#4400ff00"
        android:gravity="center"
        android:text="2"/>
    <TextView
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="3"
        android:background="#440000ff"
        android:gravity="center"
        android:text="3"/>
</LinearLayout>
View Code

 

　　看下效果:

　　

　　发现三个TextView并没有再按照1:2:3的比例进行分配.其实,layout_weight属性是先按控件声明的尺寸进行分配,然后将剩余的尺寸按layout_weight的比例进行分配.　　

　　设屏幕总宽度为sum,第一个TextView声明的尺寸为x,那么,

　　第一个TextView的宽度为: x + (sum - x) * 1/6

　　第二个TextView的宽度为: (sum - x) * 2/6

　　第三个TextView的宽度为: (sum - x) * 3/6

　　为了证实这个结论,接下来继续修改布局,将三个TextView的layout_width都设置为match_parent,把layout_weight分别设置为1,2,2

　　

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="horizontal"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:baselineAligned="false">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="#44ff0000"
        android:gravity="center"
        android:text="111111111111"/>
    <TextView
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:layout_weight="2"
        android:background="#4400ff00"
        android:gravity="center"
        android:text="2"/>
    <TextView
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:layout_weight="2"
        android:background="#440000ff"
        android:gravity="center"
        android:text="3"/>
</LinearLayout>
View Code

 

　　先看下效果:

　　

　　看到这个结果可能会感到很诧异,第一个TextView的layout_weight明明比其它两个的小,为什么宽度却比它们大呢?

　　我们按刚才得出的结论算一下.

　　依然设屏幕总宽度为sum,由于这三个TextView声明的尺寸都是match_parent,也就是sum,那么,

　　第一个TextView的宽度为: sum + (sum - 3*sum) * 1/5 = sum*3/5

　　第二个TextView的宽度为: sum + (sum - 3*sum) * 2/5 = sum*1/5

　　第三个TextView的宽度为: sum + (sum - 3*sum) * 2/5 = sum*1/5

　　三个TextView的宽度比例为 3:1:1,所以我们的结论是正确的.　　　　

　　需要注意的是,我们结论所说的剩余的尺寸可能是负的,如 sum - 3*sum,

　　另外,通过最后这个例子可以看出,并不是layout_weight越大,宽度越大.

 

作者：caobotao
本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文链接，否则保留追究法律责任的权利。
posted @ 2015-11-15 21:07  caobotao  阅读(815)  评论(0)  编辑  收藏  举报