Android - 如何在使用带有权重的 LinearLayout 时消除不需要的间隙

Posted 2023-04-18

【中文标题】Android - 如何在使用带有权重的 LinearLayout 时消除不需要的间隙

【英文标题】：Android - How to remove unwanted gaps when using LinearLayout with weights

【发布时间】：2021-09-08 18:37:00

【问题描述】：

我有一个包含 2 个水平 LinearLayouts 的垂直 LinearLayout。在垂直 LL 下方，我有另一个水平 LL。由于我使用的是 weight 属性，因此我将 layouts 的 height 或 width 属性设置为 0dp。

代码-

   <LinearLayout
        android:layout_
        android:layout_
        android:layout_weight="0.2"
        android:orientation="vertical">

        <LinearLayout
            android:layout_
            android:layout_
            android:layout_weight="0.5"
            android:orientation="horizontal">

            <Button
                android:layout_
                android:layout_
                android:layout_weight="0.25"
                android:id="@+id/buttonBack"
                android:text="back" />

            <Button
                android:layout_
                android:layout_
                android:layout_weight="0.25"
                android:id="@+id/buttonRefresh"
                android:text="refresh" />

        </LinearLayout>

        <LinearLayout
            android:layout_
            android:layout_
            android:layout_weight="0.5"
            android:orientation="horizontal">

            <Button
                android:layout_
                android:layout_
                android:layout_weight="0.25"
                android:id="@+id/buttonScore1"
                android:text="Score: " />

            <Button
                android:layout_
                android:layout_
                android:layout_weight="0.25"
                android:id="@+id/buttonScore2"
                android:text="Score: " />

        </LinearLayout>

    </LinearLayout>

    <LinearLayout
        android:layout_
        android:layout_
        android:layout_weight="0.1"
        android:orientation="horizontal">

        <Button
            android:id="@+id/buttonPlayer1"
            android:layout_
            android:layout_
            android:layout_weight="0.25"
            android:text="P1"
        />

        <Button
            android:id="@+id/buttonPlayer2"
            android:layout_
            android:layout_
            android:layout_weight="0.25"
            android:text="P2" />

    </LinearLayout>

这就是它的样子-

如您所见，元素之间存在不需要的间隙（和圆角）。如何删除空格？

【问题讨论】：

将背景颜色设置为该单独线性布局的按钮颜色。

请显示完整的xml

【参考方案1】：

用材料按钮替换所有按钮

app:cornerRadius="0dp"这将删除角落

android:background="#000000" 用于将按钮展开到全高

<com.google.android.material.button.MaterialButton
android:layout_
app:cornerRadius="0dp" //
android:layout_
android:layout_weight="0.25"
android:background="#000000"
android:id="@+id/buttonRefresh"
android:text="refresh" />

【参考方案2】：

使用我刚刚为您的线性布局添加背景的代码

 <LinearLayout
    android:layout_
    android:layout_
    android:layout_weight="0.2"
    android:orientation="vertical">

    <LinearLayout
        android:layout_
        android:layout_
        android:layout_weight="0.5"
        android:background="@color/purple_500"
        android:orientation="horizontal">

        <Button
            android:layout_
            android:layout_
            android:layout_weight="0.25"
            android:id="@+id/buttonBack"
            android:text="back" />

        <Button
            android:layout_
            android:layout_
            android:layout_weight="0.25"
            android:id="@+id/buttonRefresh"
            android:text="refresh" />

    </LinearLayout>

    <LinearLayout
        android:layout_
        android:layout_
        android:layout_weight="0.25"
        android:layout_marginTop="10dp"
        android:background="@color/purple_500"
        android:orientation="horizontal">

        <Button
            android:layout_
            android:layout_
            android:layout_weight="0.25"
            android:id="@+id/buttonScore1"
            android:text="Score: " />

        <Button
            android:layout_
            android:layout_
            android:layout_weight="0.25"
            android:id="@+id/buttonScore2"
            android:text="Score: " />

    </LinearLayout>

</LinearLayout>

<LinearLayout
    android:layout_
    android:layout_
    android:layout_weight="0.1"
    android:layout_marginTop="10dp"
    android:background="@color/purple_500"
    android:orientation="horizontal">

    <Button
        android:id="@+id/buttonPlayer1"
        android:layout_
        android:layout_
        android:layout_weight="0.25"
        android:text="P1"
        />

    <Button
        android:id="@+id/buttonPlayer2"
        android:layout_
        android:layout_
        android:layout_weight="0.25"
        android:text="P2" />

</LinearLayout>

【参考方案3】：

像这样？

<LinearLayout
    android:layout_
    android:layout_
    android:gravity="center"
    android:orientation="horizontal">

    <LinearLayout
        android:layout_
        android:layout_
        android:orientation="vertical"
        android:layout_gravity="center"
        android:layout_weight="1.0">

        <Button
            android:layout_
            android:layout_
            android:text="BACK"
            android:padding="1px"
            android:layout_weight="1.0"
            android:id="@+id/buttonBack"/>

        <Button
            android:layout_
            android:layout_
            android:text="SCORE:"
            android:padding="1px"
            android:layout_weight="1.0"
            android:id="@+id/buttonScore1"/>

        <Button
            android:layout_
            android:layout_
            android:text="P1"
            android:padding="1px"
            android:layout_weight="1.0"
            android:id="@+id/buttonPlayer1"/>

    </LinearLayout>

    <LinearLayout
        android:layout_
        android:layout_
        android:orientation="vertical"
        android:layout_gravity="center"
        android:layout_weight="1.0">

        <Button
            android:layout_
            android:layout_
            android:text="REFRESH"
            android:padding="1px"
            android:layout_weight="1.0"
            android:id="@+id/buttonRefresh"/>

        <Button
            android:layout_
            android:layout_
            android:text="SCORE:"
            android:padding="1px"
            android:layout_weight="1.0"
            android:id="@+id/buttonScore2"/>

        <Button
            android:layout_
            android:layout_
            android:text="P2"
            android:padding="1px"
            android:layout_weight="1.0"
            android:id="@+id/buttonPlayer2"/>

    </LinearLayout>

</LinearLayout>

由于在 Button 中呈现文本时出现 Android 错误，我为每个 Button 设置了 1px 的填充。