在android开发中LinearLayout很常用,LinearLayout的内控件的android:layout_weight在某些场景显得非常重要,比如我们需要按比例显示。android并没用提供table这样的控件,虽然有TableLayout,但是它并非是我们想象中的像html里面的table那么好用,我们常用ListView实现table的效果,但是列对齐确比较麻烦,现在用LinearLayout及属性android:layout_weight能很好地解决。下面我们共同体验下layout_weight这个属性。

 一、LinearLayout内的控件的layout_width设置为"wrap_content",请看一下xml配置:

<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#aa0000"
android:gravity="center"
android:text="1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="2"
android:background="#00aa00"
android:gravity="center"
android:text="1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="3"
android:background="#0000aa"
android:gravity="center"
android:text="1"/>
</LinearLayout>

可以看到这三个TextView是按照1:2:3的比例进行显示的,这样看来似乎可以实现按照比例显示了,但是有个问题,如果TextView内的文本长度一同那么较长文本的TextView会宽度会有所增加,见下面配置及效果:

<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#aa0000"
android:gravity="center"
android:text="1111111111111111111111111111111111111111111"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="2"
android:background="#00aa00"
android:gravity="center"
android:text="2"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="3"
android:background="#0000aa"
android:gravity="center"
android:text="3"/>
</LinearLayout>

效果如下:

这样看来我们所需要的按比例又无法实现了,经过满天地google终于找到了解决方案,就是设置layout_width设置为"wrap_content"。配置及效果见下:

<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<TextView
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#aa0000"
android:gravity="center"
android:text="1111111111111111111111111111111111111111111"/>
<TextView
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="2"
android:background="#00aa00"
android:gravity="center"
android:text="2"/>
<TextView
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="3"
android:background="#0000aa"
android:gravity="center"
android:text="3"/>
</LinearLayout>

这样终于达到我们的按比例显示的效果了,感觉很是奇怪,android开发框架的大佬们有时候设计确实有点匪夷所思。

二、LinearLayout内的控件的layout_width设置为"fill_parent",请看一下xml配置:

<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#aa0000"
android:gravity="center"
android:text="1"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="2"
android:background="#00aa00"
android:gravity="center"
android:text="2"/>
</LinearLayout>

奇怪吧,整个宽度平分3块,第一个TextView占了两块,这样看来weight值越小的优先级越大。只有两个TextView似乎看出些道理,那么让我们看看三个是什么效果:

<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:background="#aa0000"
android:gravity="center"
android:text="1"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="2"
android:background="#00aa00"
android:gravity="center"
android:text="2"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="3"
android:background="#0000aa"
android:gravity="center"
android:text="3"/>
</LinearLayout>

layout_weight体验(实现按比例显示)的更多相关文章

  1. 转 layout_weight体验(实现按比例显示)

    http://www.cnblogs.com/zhmore/archive/2011/11/04/2236514.html 在android开发中LinearLayout很常用,LinearLayou ...

  2. Ui篇--layout_weight体验(实现按比例显示)

    在android开发中LinearLayout很常用,LinearLayout的内控件的android:layout_weight在某些场景显得非常重要,比如我们需要按比例显示.android并没用提 ...

  3. js控制 固定框架内图片 按比例显示 以及 占满框架 居中显示

    js控制 固定框架内图片 等比例显示 以及 占满框架 纵横居中显示 通过设置 js函数 fitDiv里面var fit的值就好 function fitDiv (obj) { var target_w ...

  4. 让自定义view宽高成比例显示

    有时候我们自定义一个View,比如ImageView,我们需要让它宽高按照一定的比例显示,例如在ImageView在GridView中显示,GridView设置了3列,由于ImageVIew的宽度会根 ...

  5. 页面布局 ——图片自动按比例显示&&图片随外部div的增大而按比例增大

    图片按比例显示,分为两种情况. 1.空的div内加图片 <div class="emty"><img src="img/my.png"> ...

  6. 利用 :before 特性实现图片按比例显示

    好吧,想不到自称布局小沙弥的我会被图片按比例显示给尴尬到. 设计师跟我说,这里的图要按 750x330 的,好吧,但这图是屏宽呀,屏幕宽度会变化的,那高度也会不定咯, 要么裁图片(工作量大),要么给定 ...

  7. 最新javascript自动按比例显示图片,按比例压缩图片显示

    最新javascript自动按比例显示图片,按比例压缩图片显示 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//E ...

  8. CSS3可伸缩框属性,可用于等分显示子元素或按比例显示子元素的大小

    使用方法跟Android的android:layout_weight属性类似.可类比Android中的使用方法.这样比較好记,因为眼下全部浏览器都不支持大部分的属性,所以全部的属性都须要加上Firef ...

  9. android LinearLayout android:layout_weight 作用,固定比例

    android 中的 LinearLayout  是线性布局有水平布局horizontal  垂直布局vertical .本文针对 水平布局horizontal 布局的weight属性做一个标记,以免 ...

随机推荐

  1. JAX-WS开发WebService程序

    近来公司里要用的到WebService做开发,所以就自己学习了一下,刚开始感觉挺难的,但是真正学会以后,原来这么简单. 今天把这些东西哦记下来,以便日后的复习. 我来介绍一下我的开发环境:Eclips ...

  2. [转]Displaying standard DataTables in MVC

    本文转自:http://stackoverflow.com/questions/2243898/displaying-standard-datatables-in-mvc Controller act ...

  3. P1707 刷题比赛

    P1707 刷题比赛 10通过 38提交 题目提供者nodgd 标签倍增递推矩阵洛谷原创 难度提高+/省选- 提交该题 讨论 题解 记录 最新讨论 不科学 题目背景 nodgd是一个喜欢写程序的同学, ...

  4. 一分钟加入google站内搜索代码

    一分钟加入google站内搜索代码| 一分钟加入google站内搜索代码|只有7行最精简.网上有很多 google 站内搜索代码,但是出于某些目的,很多都加入了多余的代码,从seo的角度来讲,是很不优 ...

  5. freeCodeCamp:Sorted Union

    写一个 function,传入两个或两个以上的数组,返回一个以给定的原始数组排序的不包含重复值的新数组. 换句话说,所有数组中的所有值都应该以原始顺序被包含在内,但是在最终的数组中不包含重复值. 非重 ...

  6. Table of Contents - HttpClient

    HttpClient 4.3.5 Getting Started HttpClient 简单示例 Fundamentals Request Execution HTTP Request & H ...

  7. $_SERVER 中重要的元素

      元素/代码 描述 $_SERVER['PHP_SELF'] 返回当前执行脚本的文件名. $_SERVER['GATEWAY_INTERFACE'] 返回服务器使用的 CGI 规范的版本. $_SE ...

  8. 19款绚丽实用的jQuery/CSS3侧边栏菜单

    jQuery作为一款主流的JavaScript前端开发框架,深受广告开发者的亲睐,同时jQuery有着不计其数的插件,特别是菜单插件更为丰富,本文将要为大家介绍20个绚丽而实用的jQuery侧边栏菜单 ...

  9. hdu 2176 取(m)石子游戏

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2176 题意分析:给出M堆石子,两人交替取子,给出先手能否胜利. 不能输出No, 能则输出Yes并给出第 ...

  10. C89 和 C99的标准比较

    本文转载自: C89和C99标准比较  原文转载自: http://blog.programfan.com/article.asp?id=14051  http://blog.csdn.net/xgb ...