关于Android开发中布局属性weight的解释
2016-07-12 19:58
369 查看
如题,很多Android开发者,特别是新手,对页面布局进行划分时,用到一个布局属性,这个属性就是layout_weight(布局权重),在使用过程中,因为对这个属性了解不深入,常常陷入误区,例如:
<!--想法:布局比例设置成为1:2>
预览效果如下图:
(附图1)
“诶,不是1:2,怎么成了2:1了!郁闷!”
要想知道原因,我们首先学会找“”官方解释“”,打开Android开发API_6.0:
翻译过来就是:weight 是表示将布局相关的布局参数(就是上面例子所解释的布局参数1,布局参数2,说白了就是两块布局区域)的剩余空间进行摊分,注意是剩余空间!!那么摊分的权重就是设定的weight值(上例为1:2)。
我们回过头来分析一下上述例子到底问题出现在哪里?
比较发现,两个布局参数均在layout_height中设置“match_parent”属性,即高度铺满整个屏幕,那么整个屏幕剩余的空间为几呢,我们将一个完整的屏幕大小设置成为3个单元(为便于后面计算,这个值可以自己设定),那么剩余空间为:3单元-3单元(布局参数1所占的空间)+3单元(布局参数2所占的空间)=-3单元,可以算出布局参数1最后所占的空间为1单元+(-3单元)=-2单元;同理可知布局参数2最后所占的空间为2单元+(-3单元)=-1单元,最后所占空间比例为(-2):(-1)=2:1,所以出现附图1所出现的结果。
因此,为了方便起见,在开发过程中,我们习惯将layout_height设置成为0dp,也就是剩余空间为整个屏幕,然后再根据weight来进行划分。
···
··· android:layout_height="0dp"
android:layout_weight="2"
<!--想法:布局比例设置成为1:2>
<LinearLayout //布局参数1 android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="1"//将此weight值设置成为1.android:background="#FFFF0000"></LinearLayout> //为对比明显起见,将背景刷成红色 <LinearLayout //布局参数2android:layout_width="match_parent" android:layout_height="match_parent" android:layout_weight="2" //将此weight值设置成为2. android:background="#FF00FF00"></LinearLayout> //为对比明显起见,将背景刷成绿色
预览效果如下图:
(附图1)
“诶,不是1:2,怎么成了2:1了!郁闷!”
要想知道原因,我们首先学会找“”官方解释“”,打开Android开发API_6.0:
翻译过来就是:weight 是表示将布局相关的布局参数(就是上面例子所解释的布局参数1,布局参数2,说白了就是两块布局区域)的剩余空间进行摊分,注意是剩余空间!!那么摊分的权重就是设定的weight值(上例为1:2)。
我们回过头来分析一下上述例子到底问题出现在哪里?
比较发现,两个布局参数均在layout_height中设置“match_parent”属性,即高度铺满整个屏幕,那么整个屏幕剩余的空间为几呢,我们将一个完整的屏幕大小设置成为3个单元(为便于后面计算,这个值可以自己设定),那么剩余空间为:3单元-3单元(布局参数1所占的空间)+3单元(布局参数2所占的空间)=-3单元,可以算出布局参数1最后所占的空间为1单元+(-3单元)=-2单元;同理可知布局参数2最后所占的空间为2单元+(-3单元)=-1单元,最后所占空间比例为(-2):(-1)=2:1,所以出现附图1所出现的结果。
因此,为了方便起见,在开发过程中,我们习惯将layout_height设置成为0dp,也就是剩余空间为整个屏幕,然后再根据weight来进行划分。
···
android:layout_height="0dp" android:layout_weight="1"
···
··· android:layout_height="0dp"
android:layout_weight="2"
···
结果如附图2所示:
(附图2)
相关文章推荐
- Android布局的小窍门?
- Web布局连载——两栏固定布局(五)
- Android实现表情 抓取新浪表情
- 详解Android解析Xml的三种方式——DOM、SAX以及XMLpull
- 样式表CSS布局经验
- 在winform下实现左右布局多窗口界面的方法之续篇
- css网页布局中注意的几个问题小结
- DL.DT.DD实现左右的布局简单例子第1/2页
- 使用CSS框架布局的缺点和优点小结
- div+CSS网页布局的意义与副作用原因小结第1/2页
- 在winform下实现左右布局多窗口界面的方法
- Android布局技巧之创建可重用的UI组件
- Android编程之代码创建布局实例分析
- CSS顶级技巧大放送,div+css布局必知
- 用div实现像table一样的布局方法
- Bootstrap三种表单布局的使用方法
- 精彩的Bootstrap案例分享 重点在注释!(选项卡、栅格布局)
- 第七篇Bootstrap表单布局实例代码详解(三种表单布局)
- jQuery EasyUi实战教程之布局篇
- jQuery EasyUI 布局之动态添加tabs标签页