«

LinearLayout layout_weight解析

时间：2024-3-2 19:22     作者：韩俊     分类： Android


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

        <p>版权声明：本文为博主原创文章，未经博主允许不得转载。</p>

标签: android

热门推荐

1 android5.0系统设置搜索功能简析
2 Android的socket通信
3 Android HandlerThread 实例
4 在Android中使App快速、简单地支持新浪微博、微信、QQ、facebook等十几个主流社交平台的分享功能
5 Activity的生命周期和创建按方式
6 Android嵌入式产品【儿童定位手表】上手体验分析报告
7 Android ADB server didn&#39;t ACK * failed to start daemon * 简单有效的解决方案
8 php for android的作用是什么
9 Android文本框-android学习之旅（十七 ）
10 分析Button的android:layout_marginBottom参数失效问题

日历

标签

hbase maven eclipse sybase PostgreSQL spring emcache oracle mongodb redis nginx golang java vue android ios mysql linux 微信小程序 css html php教程 javascript python php

搜索

最新文章

热门文章