我的Android进阶之旅------>关于android:layout_weight属性的详细解析
来源:互联网 发布:用友软件是什么 编辑:程序博客网 时间:2024/06/08 20:18
- 关于androidlayout_weight属性的详细解析
- 效果一
- 效果二
- 图3的布局代码
- 图4的布局代码
- 效果三
- 图7代码
- 图8代码
- 效果四
- 效果五
版权声明:本文为【欧阳鹏】原创文章,欢迎转载,转载请注明出处!
【http://blog.csdn.net/ouyang_peng/article/details/50757149】
关于android:layout_weight属性的详细解析
效果一
图1
上面的效果图中三个文本框的宽度比为 1:2:3
图2
代码如下所示:
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/textView1" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="1" android:background="#44ff0000" android:gravity="center" android:text="1" /> <TextView android:id="@+id/textView2" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="2" android:background="#4400ff00" android:gravity="center" android:text="2" /> <TextView android:id="@+id/textView3" 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,所以展示的比例也为1:2:3
效果二
图3
图4
看到上面两个图片可以发现:
图3中的第一个文本框与第二、第三个文本框是不对齐的
图4中的第一个文本框与第二、第三个文本框是对齐的
图3的布局代码
下面来看图3的布局代码,如下所示
图5
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/textView1" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="1" android:background="#44ff0000" android:gravity="center" android:text="111111111111111111" /> <TextView android:id="@+id/textView2" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="2" android:background="#4400ff00" android:gravity="center" android:text="2" /> <TextView android:id="@+id/textView3" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="3" android:background="#440000ff" android:gravity="center" android:text="3" /></LinearLayout>
图4的布局代码
下面来看图4的布局代码,如下所示
图6
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:baselineAligned="false"> <TextView android:id="@+id/textView1" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="1" android:background="#44ff0000" android:gravity="center" android:text="111111111111111111" /> <TextView android:id="@+id/textView2" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="2" android:background="#4400ff00" android:gravity="center" android:text="2" /> <TextView android:id="@+id/textView3" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="3" android:background="#440000ff" android:gravity="center" android:text="3" /></LinearLayout>
可以发现图3和图4的布局文件的差别是在父布局LinearLayout中设置了android:baselineAligned=”false”
效果三
图7
图7代码
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:baselineAligned="false"> <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="48dp" android:layout_weight="1" android:background="#44ff0000" android:gravity="center" android:text="111111111111111111" /> <TextView android:id="@+id/textView2" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="2" android:background="#4400ff00" android:gravity="center" android:text="2" /> <TextView android:id="@+id/textView3" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="3" android:background="#440000ff" android:gravity="center" android:text="3" /></LinearLayout>
图8
图8代码
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:baselineAligned="false"> <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="48dp" android:layout_weight="1" android:background="#44ff0000" android:gravity="center" android:text="111111111111111111" /> <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="48dp" android:layout_weight="2" android:background="#4400ff00" android:gravity="center" android:text="2" /> <TextView android:id="@+id/textView3" android:layout_width="wrap_content" android:layout_height="48dp" android:layout_weight="3" android:background="#440000ff" android:gravity="center" android:text="3" /></LinearLayout>
图7和图8看起来好像效果一样。
- 图7的代码只是设置textView1的layout_width为“wrap_content”,textView2、textView3的layout_width都为“0dp”
- 图8的代码只是设置textView1、textView2、textView3的layout_width都为“wrap_content”
效果四
图9
图9代码如下:
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:baselineAligned="false"> <TextView android:id="@+id/textView1" android:layout_width="match_parent" android:layout_height="48dp" android:layout_weight="1" android:background="#44ff0000" android:gravity="center" android:text="111111111111111111" /> <TextView android:id="@+id/textView2" android:layout_width="match_parent" android:layout_height="48dp" android:layout_weight="2" android:background="#4400ff00" android:gravity="center" android:text="2" /> <TextView android:id="@+id/textView3" android:layout_width="match_parent" android:layout_height="48dp" android:layout_weight="3" android:background="#440000ff" android:gravity="center" android:text="3" /></LinearLayout>
图10
图10代码如下:
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:baselineAligned="false"> <TextView android:id="@+id/textView1" android:layout_width="match_parent" android:layout_height="48dp" android:layout_weight="1" android:background="#44ff0000" android:gravity="center" android:text="111111111111111111" /> <TextView android:id="@+id/textView2" android:layout_width="match_parent" android:layout_height="48dp" android:layout_weight="2" android:background="#4400ff00" android:gravity="center" android:text="2" /> <TextView android:id="@+id/textView3" android:layout_width="match_parent" android:layout_height="48dp" android:layout_weight="2" android:background="#440000ff" android:gravity="center" android:text="3" /></LinearLayout>
图9和图10的区别是:
图9中没有展示出TextView3,而图10中展示出TextView3而图9和图10的代码区别只是TextView3的 android:layout_weight在图9中为3,在图10中为2
下面我们来弄清楚一下到底为什么会这样:
图11
如图11所示:假设外层的父布局LinearLayout的width为480dp,
参考:布局首先按照控件声明的尺寸进行分配,然后再将剩下的尺寸按weight进行分配。
按上面的参考来计算一下三个TextView的具体width。
第一步:计算剩余的尺寸
由于三个TextView的width都设置为match_parent,即都是480dp,那么剩余的尺寸为
restWidth=480-480*3=-480*2
第二步:计算TextView1的尺寸
参考:控件的最终宽度=控件声明的宽度+父控件剩余的宽度*所占的比例
分析 如图9:
按上面的参考来计算一下三个TextView的具体width。
即:TextView1的width1如下所示:
width1=480+(-480*2)(1/6)=480(4/6)
即:TextView2的width2如下所示:
width2=480+(-480*2)(2/6)=480(2/6)
即:TextView3的width3如下所示:
width3=480+(-480*2)(3/6)=480(0/6)
所以width1:width2:width3=2:1:0 如图9所示
分析 如图10:
按上面的参考来计算一下三个TextView的具体width。
即:TextView1的width1如下所示:
width1=480+(-480*2)(1/5)=480(3/5)
即:TextView2的width2如下所示:
width2=480+(-480*2)(2/5)=480(1/5)
即:TextView3的width3如下所示:
width3=480+(-480*2)(2/5)=480(1/5)
所以width1:width2:width3=3:1:1 如图10所示
效果五
图12
有时候需要展示如图12所示的效果:子控件占据父布局宽度的1/2或者1/3等要求的时候,就需要设置父布局android:weightSum参数
图12的代码如下所示:
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal" android:weightSum="2"> <TextView android:id="@+id/textView1" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="1" android:background="#44ff0000" android:gravity="center" android:text="111111111111111111" /></LinearLayout>
图12
当父布局不设置android:weightSum参数的时候如下图所示:
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal" android:weightSum="3"> <TextView android:id="@+id/textView1" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="1" android:background="#44ff0000" android:gravity="center" android:text="111111111111111111" /></LinearLayout>
分析一下图12:
假设外层的父布局LinearLayout的width为480dp,
参考:布局首先按照控件声明的尺寸进行分配,然后再将剩下的尺寸按weight进行分配。
按上面的参考来计算一下三个TextView的具体width。
第一步:计算剩余的尺寸
由于三个TextView的width都设置为match_parent,即都是480dp,那么剩余的尺寸为
restWidth=480-0=480
第二步:计算TextView1的尺寸
参考:控件的最终宽度=控件声明的宽度+父控件剩余的宽度*(weight/weightSum)
TextView的width=0+480*(1/3)=160
所以TextView的宽度为父布局控件LinearLayout的1/3
图13
图13的代码如下:
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal" > <TextView android:id="@+id/textView1" android:layout_width="0dp" android:layout_height="48dp" android:layout_weight="1" android:background="#44ff0000" android:gravity="center" android:text="111111111111111111" /></LinearLayout>
版权声明:本文为【欧阳鹏】原创文章,欢迎转载,转载请注明出处!
【http://blog.csdn.net/ouyang_peng/article/details/50757149】
关于android:layout_weight的更多介绍可以参考一下资源:
- 我的Android进阶之旅——>关于android:layout_weight属性的一个面试题
- http://www.cnblogs.com/angeldevil/archive/2012/04/08/2437747.html
- http://blog.csdn.net/softmanfly/article/details/7636510
- http://developer.android.com/guide/topics/ui/layout/linear.html#Weigh
- http://www.cnblogs.com/draem0507/archive/2013/05/11/3073508.html
- Android 对Layout_weight属性完全解析以及使用ListView来实现表格
作者:欧阳鹏 欢迎转载,与人分享是进步的源泉!
转载请保留原文地址:http://blog.csdn.net/ouyang_peng
- 我的Android进阶之旅------>关于android:layout_weight属性的详细解析
- 我的Android进阶之旅------>关于android:layout_weight属性的一个面试题
- Android开发之layout_weight属性的应用
- 关于Android的layout_weight
- Android:Layout_weight属性解析
- Android布局之Layout_weight属性解析
- android:layout_weight属性的使用
- android:layout_weight属性的使用
- Android的layout_weight属性详解
- Android的layout_weight属性释疑
- Android布局的layout_weight属性
- android Layout_weight属性的详解
- 我的Android进阶之旅------>Android中android:visibility 属性VISIBLE、INVISIBLE、GONE的区别
- android之layout_weight属性
- 我的Android进阶之旅------>ListView中android:cacheColorHint,android:listSelector属性作用 .
- 关于android:layout_weight属性你不知道的事
- 关于android layout_weight的疑问
- 关于android LinearLayout 的layout_weight
- js中的call及apply
- MySQL知识(十八)——MySQL触发器
- hdu 3338 Kakuro Extension(网络流dinic邻接表实现)
- C#综合揭秘——细说多线程(下)
- Android 5.x之CardView
- 我的Android进阶之旅------>关于android:layout_weight属性的详细解析
- asp.net中<%@ Page Language....的意思
- 自定义view相关学习
- HLS+CDN巧妙的串流技術組合
- 真正的问题不在于长大,而在于遗忘。
- linux(ubuntu)mysql自动安装
- Benchmark库的建立05:任务Post失败 Bug
- Python之sax的ContentHandler类方法处理多行内容的情况
- git随笔四则 - pull v.s. fetch, stash, rebase, merge