layout_weight的使用

最近在看写公开视频,发现layout_weight跟我以前所认知的略有不同,在这总结下。
在LinearLayout中的子控件使用layout_weight属性可以让子控件按照父控件的一定比例来显示,先看几个常规的使用方法

1 子控件与子控件按照一定比例显示

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="48dp"
    android:orientation="horizontal">

    <TextView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="#F00"
        android:text="A"
        android:textColor="@color/black" />

    <TextView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="2"
        android:background="#0F0"
        android:text="B"
        android:textColor="@color/black" />
</LinearLayout>

效果如图所示:
在这里插入图片描述

2 子控件按父控件的一定比例显示

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="48dp"
    android:gravity="center_horizontal"
    android:weightSum="2">

    <TextView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:background="#F00"
        android:text="A"
        android:textColor="@color/black" />
</LinearLayout>

效果如图所示:
在这里插入图片描述

3 某一个子控件右对齐

最常见的就是标题栏,左边一个按钮,右边一个按钮,中间是标题

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="48dp">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

    <TextView
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center"
        android:text="TITLE" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />
</LinearLayout>

在这里插入图片描述

上面几种是我们比较常用的方式,下面总结下一些"错误"的使用。

4 wrap、match乱入

我们在用layout_weight属性时一般都是指定layout_width(或layout_height)为0,如果我们指定的是wrap_content或者match_parent会有什么效果呢,如下所示:
在这里插入图片描述
代码是1中的控件A和控件B依次将layout_width设置为0,wrap_content、match_parent

从图中我们可以看到wrap_content和0显示效果接近,但还是有丝毫的差距,match_parent和0显示的效果相差甚远。
先给出一个weight的计算公式,我们在用wrap_content和match_parent带入公式,看是否符合。

子控件宽度=该控件的已知宽度+(父控件宽度-所有子控件已知宽度)/总weight*当前子控件所占的weight

先看match_parent,我的屏幕总宽度是1080px,A和B的已知宽度为match_parent(即1080px)
套用上面的公式得出A的宽度:

width_A=width_A_known+(width_P-width_A_known-width_B_konwn)/3*1
width_A_weight=1080+(1080-1080-1080)/3*1
width_A_weigh=720

其中:
width_A_known: A的已经宽度
width_B_known: B的已经宽度
width_P: 父布局宽度
以下公式相同

B的宽度

width_B=width_B_known+(width_P-width_A_known-width_B_known)/3*2
width_B=1080+(1080-1080-1080)/3*2
width_B=360

再看wrap_content,我们先看下控件A在不设置layout_weight的情况下wrap_content的宽度是多少,通过Layout_Inspector得出24px,使用上面公式
A的宽度

width_A=width_A_known+(width_P-width_A_known-width_B_known)/3*1
width_A=24+(1080-24-24)/3*1
width_A=368

B的宽度

width_B=width_B_known+width_P-width_A_known-width_B_known)/3*2
width_B=24+(1080-24-24)/3*2
width_B=712

上面结果均与Layout_Inspector中显示的结果相同。

5 指定宽高

既然上面的公式对wrap_content和match_parent均使用,那么如果指定了宽高呢,试下,将A的宽度指定为600px,B的宽度指定为300px,先看下效果:
在这里插入图片描述
此时Layout_Inspector给出的值是A的宽度是660px,B的宽度是420px,带入公式试一下:
A的宽度

width_A=width_A_known+(width_P-width_A_known-width_B_known)/3*1
width_A=600+(1080-600-300)/3*1
width_A=660

B的宽度

width_B=width_B_known+width_P-width_A_known-width_B_known)/3*2
width_B=300+(1080-600-300)/3*2
width_B=420

准确无误

6 设置Padding

padding设置对0、和match_parent都没有影响,只会对wrap_content起作用,第一行是没有padding的,第二行A的padding为20px,B的padding为30px
在这里插入图片描述
还是可以看出宽度不太一样的。
此时Layout_Inspector给出的值是A的宽度是375px,B的宽度是705px,带入公式试一下:
A的宽度

width_A=width_A_known+(width_P-width_A_known-width_B_known)/3*1
width_A=24+2*20+(1080-(24+2*20)-(24+2*30))/3*1
width_A=375

B的宽度

width_B=width_B_known+width_P-width_A_known-width_B_known)/3*2
width_B=24+2*30+(1080-(24+2*20)-(24+2*30))/3*2
width_B=705

准确无误

综上我们最终得到的layout_weight的计算公式为:
子控件宽度=该控件的已知宽度+(父控件宽度-所有子控件已知宽度)/总weight*当前子控件所占的weight

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
### 回答1: `layout_weight` 是在 Android 中用于布局的一个属性,它用于指定一个视图在布局中所占用的权重。布局中每个视图都有一个默认的权重为 `0`,当设置了 `layout_weight` 属性后,系统会根据视图的权重和所在容器的剩余空间来计算视图的实际大小。一个视图的实际大小会先根据自身的宽度或高度计算出来,然后再根据它的权重和其他视图的权重来分配剩余的空间。因此,通过设置 `layout_weight` 属性,可以实现在布局中更灵活的视图排列和分配。 ### 回答2: layout_weightAndroid布局中的一个属性,用于控制视图在父布局中的相对权重。 在LinearLayout中,父布局必须为水平或垂直方向,子视图的layout_weight属性决定它们在父布局中所占的比例。例如,如果有两个子视图,一个layout_weight为1,另一个为2,那么第一个子视图将占据父布局的1/3,而第二个子视图将占据2/3。 在RelativeLayout中,layout_weight属性无效,这是因为RelativeLayout是根据视图之间的关系来布局的。不过,可以结合使用其他属性来达到类似的效果。 layout_weight属性常用于构建灵活的布局,例如等分屏幕的两个或多个部分,或者按比例调整视图的大小。通过合理设置layout_weight,可以实现适应不同屏幕尺寸和方向的布局。 需要注意的是,更高的layout_weight并不一定意味着更大的视图,而是表示相对权重的增加。要实现适应不同分辨率的布局,还需要考虑使用dp和match_parent等属性。 综上所述,layout_weight是一种用于控制视图在父布局中相对权重的属性,可以帮助实现灵活的布局。了解并熟练使用该属性,可以更好地适配不同屏幕和实现更好的用户界面体验。 ### 回答3: layout_weightandroid中用于布局控制的一个属性。该属性只能在LinearLayout使用layout_weight用于控制View在父容器中的分配空间比例。在LinearLayout中,如果某个方向的width或height设置为0dp(match_parent也可以),并且设置了layout_weight属性,那么这个View将根据layout_weight的值来分配父容器中剩余的空间。 假设有一个水平方向的LinearLayout,其中包含了两个子View:View1和View2。如果View1的layout_weight设置为1,View2的layout_weight设置为2,那么View1将会占据1/3的水平空间,而View2将占据2/3的水平空间。 另外,如果在设置了layout_weight的View中,将width或height设置为0dp,它将会以所占比例的形式拉伸或压缩来填充剩余空间。例如,如果View1的layout_weight设置为1,width设置为0dp,而View2的layout_weight设置为2,width设置为wrap_content,那么View1将会占据1/3的水平空间,并且会被拉伸或压缩以填充剩余的空间,而View2将会根据内容自动调整宽度。 总结来说,layout_weight属性允许我们在LinearLayout中根据所设置的权重值来分配剩余的空间,从而实现不同比例的布局效果。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

得食猫

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值