Android中的layout_weight属性详解

Android开发中,不可避免的都会使用到Layout_weight属性,也是面试题木钟常考的知识点。layout_weight属性在屏幕适配等方面有很大的作用。本文将从一个初学者的角度总结layout_weight属性在开发中常见的问题及解决方法,描述不周的地方还请指出,共同进步。


一、 首先请看下面的代码,并思考屏幕显示结果

<?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:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="#44ff0000"
        android:gravity="center"
        android:text="1111111111" />
    <TextView
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="2"
        android:background="#4400ff00"
        android:gravity="center"
        android:text="2222" />
    <TextView
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="3"
        android:background="#440000ff"
        android:gravity="center"
        android:text="3333" />
</LinearLayout>

期望的屏幕显示结果是这样的:1:2:3
这里写图片描述
但实际上是这样的:
这里写图片描述

出现这种情况的原因是:引用这篇文章来解释这个问题,相信大家看了之后应该也可以明白原理了

解决方法:
在代码中做如下修改

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:baselineAligned="false" <!--将基准线对齐设置为false-->
    android:orientation="horizontal">

问题得以解决,屏幕显示结果就是期望中的结果啦。


  • 接下来将代码做一些修改,请思考显示效果
    将第一个TextView做出修改如下
    <TextView
        android:layout_width="wrap_content" <!--修改行-->
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="#44ff0000"
        android:gravity="center"
        android:text="1111111111" />

修改之后的显示效果如下:
这里写图片描述
可见三个TextView的宽度并不是 1:2:3 ,为什么呢?
因为LinearLayout中的控件首先都会按照声明的宽度进行分配,然后将剩余的尺寸再按照layout_weight设置的数值进行分配。所以才会出现如图所示的结果。


二、接下来再对代码进行修改

<?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"
    android:orientation="horizontal">
    <TextView
        android:layout_width="match_parent" <!-- 修改1 -->
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="#44ff0000"
        android:gravity="center"
        android:text="1111111111" />
    <TextView
        android:layout_width="match_parent" <!-- 修改2 --!>
        android:layout_height="48dp"
        android:layout_weight="2"
        android:background="#4400ff00"
        android:gravity="center"
        android:text="2222" />
    <TextView
        android:layout_width="match_parent" <!-- 修改3 -->
        android:layout_height="48dp" 
        android:layout_weight="2"  <!-- 修改4 -->
        android:background="#440000ff"
        android:gravity="center"
        android:text="3333" />
</LinearLayout>

显示结果是这个样子的:
这里写图片描述
并没有预期中的1:2:2,反而比例为1的占比更大了!
原因如下:
layout_weight使用时,首先减去控件声明的尺寸,然后将剩下的尺寸按比例分配。

假设外层Linearlayout的width为480
那么剩余尺寸是:rest = 480 - 480 * 3 = -480 * 2;

 - TextView 1 : 480 - (-480 * 2) * (1 / 5) = 480 * (3 / 5);
 - TextView 2 : 480 - (-480 * 2) * (2 / 5) = 480 * (1 / 5);
 - TextView 3 : 480 - (-480 * 2) * (2 / 5) = 480 * (1 / 5);

由此可得,第一个TextView所占宽度的比例为3/5,后两个为1/5!


三、如果LinearLayout中只有一个TextView,而且让它的宽度占父控件的一半,应该怎么做呢?
代码如下:

<?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">  <!-- 将该属性设置为2即可 -->
    <TextView
        android:layout_width="0dp"
        android:layout_height="48dp"
        android:layout_weight="1"
        android:background="#44ff0000"
        android:gravity="center"
        android:text="1111111111" />
</LinearLayout>

效果展示:
这里写图片描述


四、屏幕适配,在一个横线排列的线性布局中要想使某个控件始终适配屏幕,该怎么办呢?

<?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:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_weight="0" <!--设置为0-->
        android:background="#ff00ff00"
        android:gravity="center"
        android:text="1111" />
    <TextView
        android:layout_width="0dp"
        android:layout_height="50dp"
        android:layout_weight="1"  <!--设置为1-->
        android:background="#ffff0000"
        android:gravity="center"
        android:text="222" />
    <TextView
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_weight="0"  <!--设置为0-->
        android:background="#ffff00ff"
        android:gravity="center"
        android:text="333" />
</LinearLayout>

这里写图片描述
这样中间的TextView就可以随着屏幕大小的变化而适应屏幕了,二另外两个TextView则始终保持自身大小。

©️2020 CSDN 皮肤主题: 大白 设计师: CSDN官方博客 返回首页
实付0元
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值