AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

我的Android进阶之旅------>关于android:layout_weight属性的详细解析

2016-02-27 1027
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
本文涉及的产品
全局流量管理 GTM，标准版 1个月
公共DNS（含HTTPDNS解析），每月1000万次HTTP解析
云解析 DNS，旗舰版 1个月
简介： 关于androidlayout_weight属性的详细解析效果一效果二图3的布局代码图4的布局代码效果三图7代码图8代码效果四效果五 版权声明：本文为【欧阳鹏】原创文章，欢迎转载，转载请注明出处! 【http://blog.

版权声明：本文为【欧阳鹏】原创文章，欢迎转载，转载请注明出处!

【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的更多介绍可以参考一下资源：

作者：欧阳鹏 欢迎转载，与人分享是进步的源泉！
转载请保留原文地址：http://blog.csdn.net/ouyang_peng

这里写图片描述

文章标签：
云解析DNS
Android开发
数据格式
XML
关键词：
Android解析
android云解析DNS
云解析DNS android
云解析DNS属性
属性云解析DNS
字节卷动
目录
相关文章
游客5fdji2pvmf8888
|
1月前
|
Java 开发工具 Android开发
Android与iOS开发环境搭建全解析####
本文深入探讨了Android与iOS两大移动操作系统的开发环境搭建流程，旨在为初学者及有一定基础的开发者提供详尽指南。我们将从开发工具的选择、环境配置到第一个简单应用的创建，一步步引导读者步入移动应用开发的殿堂。无论你是Android Studio的新手还是Xcode的探索者，本文都将为你扫清开发道路上的障碍，助你快速上手并享受跨平台移动开发的乐趣。 ####
游客5fdji2pvmf8888
35 2
liuliunaina
|
3月前
|
IDE Android开发 iOS开发
深入解析Android与iOS的系统架构及开发环境差异
本文旨在探讨Android和iOS两大主流移动操作系统在系统架构、开发环境和用户体验方面的显著差异。通过对比分析，我们将揭示这两种系统在设计理念、技术实现以及市场策略上的不同路径，帮助开发者更好地理解其特点，从而做出更合适的开发决策。
liuliunaina
196 2
游客762btuqu5wybw666
|
23天前
|
存储 Linux API
深入探索Android系统架构：从内核到应用层的全面解析
本文旨在为读者提供一份详尽的Android系统架构分析，从底层的Linux内核到顶层的应用程序框架。我们将探讨Android系统的模块化设计、各层之间的交互机制以及它们如何共同协作以支持丰富多样的应用生态。通过本篇文章，开发者和爱好者可以更深入理解Android平台的工作原理，从而优化开发流程和提升应用性能。
游客762btuqu5wybw666
58 13
131王
|
1月前
|
安全 Java Linux
深入解析Android系统架构及其对开发者的意义####
【10月更文挑战第21天】 本文旨在为读者揭开Android操作系统架构的神秘面纱，探讨其如何塑造现代移动应用开发格局。通过剖析Linux内核、硬件抽象层、运行时环境及应用程序框架等关键组件，揭示Android平台的强大功能与灵活性。文章强调了理解Android架构对于开发者优化应用性能、提升用户体验的重要性，并展望了未来技术趋势下Android的发展方向。 ####
131王
47 0
131王
|
2月前
|
测试技术 数据库 Android开发
深入解析Android架构组件——Jetpack的使用与实践
本文旨在探讨谷歌推出的Android架构组件——Jetpack，在现代Android开发中的应用。Jetpack作为一系列库和工具的集合，旨在帮助开发者更轻松地编写出健壮、可维护且性能优异的应用。通过详细解析各个组件如Lifecycle、ViewModel、LiveData等，我们将了解其原理和使用场景，并结合实例展示如何在实际项目中应用这些组件，提升开发效率和应用质量。
131王
53 6
bruce_xiaowei
|
3月前
|
索引 Python
XPath解析之获取属性
XPath解析（三）
bruce_xiaowei
65 10
131王
|
3月前
|
存储 开发框架 数据可视化
深入解析Android应用开发中的四大核心组件
本文将探讨Android开发中的四大核心组件——Activity、Service、BroadcastReceiver和ContentProvider。我们将深入了解每个组件的定义、作用、使用方法及它们之间的交互方式，以帮助开发者更好地理解和应用这些组件，提升Android应用开发的能力和效率。
131王
280 5
Ant.Dream
|
3月前
|
缓存 Android开发 开发者
Android RecycleView 深度解析与面试题梳理
本文详细介绍了Android开发中高效且功能强大的`RecyclerView`，包括其架构概览、工作流程及滑动优化机制，并解析了常见的面试题。通过理解`RecyclerView`的核心组件及其优化技巧，帮助开发者提升应用性能并应对技术面试。
Ant.Dream
105 8
Ant.Dream
|
3月前
|
存储 缓存 Android开发
Android RecyclerView 缓存机制深度解析与面试题
本文首发于公众号“AntDream”，详细解析了 `RecyclerView` 的缓存机制，包括多级缓存的原理与流程，并提供了常见面试题及答案。通过本文，你将深入了解 `RecyclerView` 的高性能秘诀，提升列表和网格的开发技能。
Ant.Dream
78 8
郑小健
|
2月前
|
安全 网络安全 Android开发
深度解析：利用Universal Links与Android App Links实现无缝网页至应用跳转的安全考量
【10月更文挑战第2天】在移动互联网时代，用户经常需要从网页无缝跳转到移动应用中。这种跳转不仅需要提供流畅的用户体验，还要确保安全性。本文将深入探讨如何利用Universal Links（仅限于iOS）和Android App Links技术实现这一目标，并分析其安全性。
郑小健
387 0

热门文章

最新文章

  • 1
    Android官方技术文档翻译——ApplicationId 与 PackageName
  • 2
    android webview pre[name=code] syntaxHighlighter 代码高亮
  • 3
    android实现gif动态图的使用
  • 4
    android防止内存溢出浅析
  • 5
    Android4.x对长按电源键（挂断键）和短按电源键（挂断键）的详细处理流程
  • 6
    Android GPU呈现模式原理及卡顿掉帧浅析
  • 7
    Android消息通知-Notification
  • 8
    [Android Pro] 常用的android工具类和库
  • 9
    Android 旋转字体 实现（应用角标，如：新，火等关键字）
  • 10
    想抢先体验Android操作系统的魅力吗？那就使用Android LiveCD吧！
  • 1
    【Uniapp 专栏】Uniapp 的状态管理功能深度解析
    344
  • 2
    React Hooks实战：从useState到useContext深度解析
    108
  • 3
    销售利器大集结：13种智能销售工具全面解析
    316
  • 4
    【Uniapp 专栏】基于 Uniapp 的电商应用开发案例解析
    213
  • 5
    XML DOM 解析器
    60
  • 6
    构建高效AI系统：深度学习优化技术解析
    619
  • 7
    Java 8新特性之Lambda表达式与Stream API的深度解析
    103
  • 8
    深入解析Linux tee命令：从基础用法到高级场景的全面指南
    1383
  • 9
    PandasTA 源码解析（二十三）
    78
  • 10
    PandasTA 源码解析（二十二）（3）
    76

    • 相关课程

    更多
  • 云计算工程师解析与实战-网络专家篇（体验版）
  • 深入解析Docker容器化技术
  • 开源Android容器化框架Atlas开发者指南
  • Java面试疑难点解析 - 面试技巧及语言基础
  • Java面试疑难点解析 - Java Web开发
  • Java面试疑难点解析 - 系统架构及项目设计

    • 相关电子书

    更多
  • 神龙云服务器产品及技术深度解析
  • 弹性创造价值：基于ECS的最佳性价比实践解析
  • 又快又稳：阿里云下一代虚拟交换机解析

    • 相关实验场景

    更多
  • 通过云拨测对指定服务器进行Ping/DNS监测

    • 推荐镜像

    更多
  • DNS
  • DNS
  • DNS
    • 下一篇
    【案例实战】SpringBoot整合阿里云文件上传OSS