奇葩属性:layout_weight 的解释及使用

摘要

layout_weight 的含义及使用

在Android的控件布局中,有一个奇葩的 layout_weight 属性,定义如下:

layout_weight : 用于指定剩余空闲空间的分割比例。用法:

<LinearLayout
  android:orientation="horizontal">

  <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_height"
      android:layout_weight="1"
      android:text="888"/>

  <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_height"
      android:layout_weight="1"
      android:text="999999"/>

</LinearLayout>

为什么说是奇葩呢?

以上面的布局代码为例,TextView-888 和 TextView-999999 是横向排列的2个控件,它们的layout_weight="1",说明这2个控件平分了所在LinearLayout的剩余的空闲空间, 我们很容易的就误认为这2个控件平分了水平方向的空间,即:各自占据了 50% 的宽度。

其实这是错误的,而是:TextView-999999控件所占据的宽度 > TextView-888所占据的宽度。因为999999字符占据的宽度大于888占据的宽度,即:w(999999) + 1/2空闲空间 > w(888) + 1/2空闲空间

这就是它奇葩的地方,很容易就让我们一直误认为是整个控件分割空间。到这里,大家一定会认为,这样的话,layout_weight 这个属性就没有什么意义了,原以为它可以分配空间呢,原来只是分割剩余空闲空间。

其实,呵呵,layout_weight 是可以用来进行整个空间的分割的,如果我们让控件的宽度定义为0,这样比如2个控件的 layout_weight="1" 就可以各自50%平分整个空间了,因为:0 + 1/2空闲空间 = 0 + 1/2空闲空间

这是一个小技巧,也是非常实用的一个实用layout_weight分割方案:定义控件的 layout_width="0dp" 或layout_height="0dp" 配上 layout_weight 就可以实现对整个空间的比例分割了。

下面定义了2个控件的 layout_width="0dp", layout_weight="1",实现了水平方向50%平均分割:

<LinearLayout
  android:orientation="horizontal">

  <TextView
      android:layout_width="0dp"
      android:layout_height="wrap_height"
      android:layout_weight="1"
      android:text="888"/>

  <TextView
      android:layout_width="0dp"
      android:layout_height="wrap_height"
      android:layout_weight="1"
      android:text="999999"/>

</LinearLayout>

下面定义了2个控件的 layout_height="0dp", layout_weight="1",实现了竖直方向50%平均分割:

<LinearLayout
  android:orientation="vertical">

  <TextView
      android:layout_width="wrap_content"
      android:layout_height="0dp"
      android:layout_weight="1"
      android:text="888"/>

  <TextView
      android:layout_width="wrap_content"
      android:layout_height="0dp"
      android:layout_weight="1"
      android:text="999999"/>

</LinearLayout>

layout_weight 原来是可以这么用滴  

时间: 2024-10-05 15:57:29

奇葩属性:layout_weight 的解释及使用的相关文章

layout_weight 的解释及使用

layout_weight 的解释及使用 转自:http://my.oschina.net/jsan/blog/191492 在Android的控件布局中,有一个奇葩的 layout_weight 属性,定义如下: layout_weight : 用于指定剩余空闲空间的分割比例.用法: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 <LinearLayout   android:orientation="horizontal">   <

html头部meta属性大全——各种奇葩属性设置大归类

常用通用属性: <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <!--设置屏幕缩放--> <link rel="dns-prefetch" href="//www.zhoulujun.cn"> <!--设置dns缓存-->

layout_weight属性的小结

在Android的控件布局中,有一个奇葩的 layout_weight 属性,定义如下: layout_weight : 用于指定剩余空闲空间的分割比例.用法: 为什么说是奇葩呢? 以上面的布局代码为例,TextView-888 和 TextView-999999 是横向排列的2个控件,它们的layout_weight="1",说明这2个控件平分了所在LinearLayout的剩余的空闲空间, 我们很容易的就误认为这2个控件平分了水平方向的空间,即:各自占据了 50% 的宽度. 其实这

CSS 的overflowhidden 属性详细解释

overflow:hidden这个CSS样式是大家常用到的CSS样式,但是大多数人对这个样式的理解仅仅局限于隐藏溢出,而对于清除浮动这个含义不是很了解.      一提到清除浮动,我们就会想到另外一个CSS样式:clear:both,我相信对于这个属性的理解大家都不成问题的.但是对于“浮动”这个词到底包含什么样的含义呢?我们下面来详细的阐述一下.  这是一个常用的div写法,下面我们来书写样式.大家可以在DMX中自己做试验. 1  #box{  2           width:500px; 

html5新增表单元素和属性

从三方面来介绍html5表单的新特性表单结构更灵活 要提交数据的控件可以布局在form标签之外,看下面的代码,表单元素可以写到form元素之外,只需在元素中加入form="form1"属性,也可提交到form元素指定的服务器地址 <body><form action="upload.php" method="post" accept-charset="utf-8" id="form1"&g

RelativeLayout的属性设置

设有两个控件one和two,以控件one为基准.由于代码比较简单就不贴了,直接上效果图. 一.第一组:将控件two放在控件one的上.下.左.右.开始.结束. android:layout_below="" 上         android:layout_above="" 下         android:layout_toLeftOf="" 左         android:layout_toRightOf="" 右 

jQuery属性选择器.attr()和.prop()两种方法

在判断表单单选框是否被选中时,通常会想到使用$('#checkbox').attr('checked')来判断,但在一些情况下,你会发现这种方法并不管用,得到的是undefined. 原来jQuery在1.6版本以后对属性选择器做了一些调整,分为.attr()和.prop()两种方法.为的是区分元素attributes和properties之间模棱两可的东西. 那么它们之间有什么区别呢? 官方的解释是: Attributes vs. Properties The difference betwe

HTML input标签的checked属性与Razor解析

在HTML中,input标签可以通过type属性设置为checkbox.同时,也就包含了一个checked属性.对于这个checked属性,有一个特别的地方就是,它可以不需要属性值就可以表示是否选择了.这背后的原因是源自于早期的HTML,checked是一个独立的boolean属性. 所以给1)checked赋值true <input type="checkbox" checked="true" /> 和2)直接写checked <input ty

【webQD】☆★之详解position: absolute、relative属性

[webQD]☆★之详解position: absolute.relative 首先我们来看一下W3C对position的解释: 我们再看,W3C对position属性值的解释: ok,我们需要了解的是: 其中absolute和relative是最常用的,fixed用得也比较多(其中IE6并不支持fixed). 1.absolute(绝对定位) absolute是生成觉对定位的元素,脱离了文本流(即在文档中已经不占据位置),参照浏览器的左上角通过top,right,bottom,left(简称T