如何使用android中的任何布局将两个文本视图与背景水平对齐？答案

【问题标题】：How to align two text view horizontally with background using any layout in android?如何使用android中的任何布局将两个文本视图与背景水平对齐？
【发布时间】：2019-04-25 09:08:26
【问题描述】：

我正在使用两个带背景的文本视图，我想将两个文本视图并排对齐，并在它们之间留出一些边距。我已经尝试过这段代码，但它不适用于较小的设备。

<LinearLayout
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:layout_marginBottom="10dp"
                android:orientation="horizontal"
                android:weightSum="2">


                <TextView
                    android:id="@+id/btn_back"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="10dp"
                    android:layout_weight="1"
                    android:background="@drawable/bg_rounded_green_1"
                    android:gravity="center"
                    android:layout_gravity="top"
                    android:paddingTop="3dip"
                    android:paddingBottom="3dip"
                    android:text="Save &amp; Close"
                    android:textColor="@android:color/white"
                    android:textSize="13sp"
                    android:minLines="2"/>


                <TextView
                    android:id="@+id/btn_next"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_gravity="top"
                    android:layout_marginTop="10dip"
                    android:layout_weight="1"
                    android:background="@drawable/bg_rounded_green_1"
                    android:gravity="center"
                    android:minLines="2"
                    android:paddingTop="3dip"
                    android:paddingBottom="3dip"
                    android:text="@string/label_next_shipping_method"
                    android:textColor="@android:color/white"
                    android:textSize="13sp" />

            </LinearLayout>


        </LinearLayout>

【问题讨论】：

通过查看图像，我认为您的意思是垂直。将android:gravity="center_vertical" 设置为LinearLayout。
到你的父布局-> android:layout_gravity="center"

标签： android xml android-layout textview android-linearlayout

【解决方案1】：

我检查了你的代码，它很好，但需要进行一些更改才能获得你想要的布局。

只需将android:gravity="center" 添加到您的LinearLayout

从'textviews`中删除android:layout_gravity="top"和android:layout_marginTop="10dp"

试试下面的代码，在下面的代码中我添加View 并更改android:layout_weight 以使布局更具响应性。

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="60dp"
    android:layout_marginBottom="10dp"
    android:orientation="horizontal"
    android:gravity="center_vertical">

    <View
        android:layout_weight=".03"
        android:layout_width="0dp"
        android:layout_height="0dp"/>
    <TextView
        android:id="@+id/btn_back"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight=".45"
        android:background="@drawable/bg_rounded_green_1"
        android:gravity="center"
        android:paddingTop="3dip"
        android:paddingBottom="3dip"
        android:text="Save &amp; Close"
        android:textColor="@android:color/white"
        android:textSize="13sp"
        android:minLines="2"/>
    <View
        android:layout_weight=".04"
        android:layout_width="0dp"
        android:layout_height="0dp"/>

    <TextView
        android:id="@+id/btn_next"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight=".45"
        android:background="@drawable/bg_rounded_green_1"
        android:gravity="center"
        android:minLines="2"
        android:paddingTop="3dp"
        android:paddingBottom="3dp"
        android:text="Next - Select Shipping \nMethod"
        android:textColor="@android:color/white"
        android:textSize="13sp" />
    <View
        android:layout_weight=".03"
        android:layout_width="0dp"
        android:layout_height="0dp"/>
</LinearLayout>

输出如下图：

我希望它对你有用。

【讨论】：

【解决方案2】：

尝试将此添加到您的LinearLayout：

android:gravity="top|center_horizontal"

【讨论】：

【解决方案3】：

尝试将您在 textview 中的高度从 wrap_content 替换为 match_parent，这样两者的大小将相同。您也可以将 LinearLayout 的高度设置为wrap_content

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content" ... />
    <TextView
        android:id="@+id/btn_back"
        android:layout_width="0dp"
        android:layout_height="match_parent" ... />
    <TextView
        android:id="@+id/btn_next"
        android:layout_width="0dp"
        android:layout_height="match_parent" ... />
</LinearLayout>

【讨论】：

【解决方案4】：

我已经测试了你的代码并为你重新编写了它，试试下面的代码可能会帮助你解决你的问题

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="10dp"
    android:gravity="center"
    android:layout_marginTop="10dp"
    android:orientation="horizontal"
    android:weightSum="2">

    <TextView
        android:id="@+id/btn_back"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="@drawable/bg_rounded_green_1"
        android:gravity="center"
        android:minLines="2"
        android:padding="3dp"
        android:text="Save &amp; Close"
        android:textColor="@android:color/white"
        android:textSize="13sp" />

    <TextView
        android:id="@+id/btn_next"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:padding="3dp"
        android:background="@drawable/bg_rounded_green_1"
        android:gravity="center"
        android:minLines="2"
        android:text="@string/label_next_shipping_method"
        android:textColor="@android:color/white"
        android:textSize="13sp" />

</LinearLayout>

【讨论】：

【解决方案5】：

如下修改你的代码，你的问题就解决了！

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:layout_marginBottom="10dp"
        android:orientation="horizontal"
        android:weightSum="2"
        android:layout_gravity="center_vertical"
        android:gravity="center_vertical"
        android:paddingLeft="5dp"
        android:paddingRight="5dp"
        android:background="#CCCCCC">

        <TextView
            android:id="@+id/btn_back"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/rectangle_drawable"
            android:gravity="center"
            android:layout_gravity="center_vertical"
            android:paddingTop="3dip"
            android:paddingBottom="3dip"
            android:text="Save &amp; Close"
            android:textColor="@android:color/white"
            android:textSize="13sp"
            android:minLines="2"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"/>

        <TextView
            android:id="@+id/btn_next"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:background="@drawable/rectangle_drawable"
            android:gravity="center"
            android:layout_gravity="center_vertical"
            android:minLines="2"
            android:paddingTop="3dip"
            android:paddingBottom="3dip"
            android:text="Next - Select Shipping Method Method Method"
            android:textColor="@android:color/white"
            android:textSize="13sp"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"/>

    </LinearLayout>

我设置了我自己的背景，所以你自己设置。

这是结果：

【讨论】：

【解决方案6】：

请检查以下代码。它将解决您的问题。如果您遇到任何问题，请在评论部分告诉我。

使用您自己的可绘制对象和资产。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="10dp"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:orientation="horizontal">

        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:layout_marginEnd="5dp"
            android:layout_weight="1"
            android:gravity="center"
            android:paddingTop="3dp"
            android:paddingBottom="3dp"
            android:text="Total Optional Service:"
            android:textColor="@android:color/darker_gray"
            android:textSize="13sp" />

        <TextView
            android:id="@+id/tv_optional_service_amount"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:layout_marginEnd="5dp"
            android:layout_weight="1"
            android:gravity="center"
            android:paddingTop="3dp"
            android:paddingBottom="3dp"
            android:text="$18.00"
            android:textColor="@android:color/black"
            android:textSize="13sp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/btn_back"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:layout_marginEnd="5dp"
            android:layout_weight="1"
            android:background="@color/colorBlack"
            android:gravity="center"
            android:minLines="2"
            android:paddingTop="3dp"
            android:paddingBottom="3dp"
            android:text="Save &amp; Close"
            android:textColor="@android:color/white"
            android:textSize="13sp" />

        <TextView
            android:id="@+id/btn_next"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:layout_marginStart="5dp"
            android:layout_weight="1"
            android:background="@color/colorBlack"
            android:gravity="center"
            android:minLines="2"
            android:paddingTop="3dp"
            android:paddingBottom="3dp"
            android:text="Next - Select Shipping Method"
            android:textColor="@android:color/white"
            android:textSize="13sp" />
    </LinearLayout>
</LinearLayout>

如果它对您有用，请批准答案。谢谢！

【讨论】：

【解决方案7】：

我认为其他答案很好，有些可能会解决您的问题 （例如，@Android Geek 的回答非常好） ，但他们都没有提到constraintLayout，所以我想提供另一种解决方案。

在我们开始之前，让我解释一下为什么我要添加 constraintLayout 解决方案，而不是像上面提到的那样只使用LinearLayout：

当您使用 LinearLayout 并在其中使用嵌套视图并另外使用 android:layout_weight 和 android:weightSum 属性时，您可能会发现您的布局性能受到影响（尽管在这种情况下只有 2 个视图不会影响您的布局）。这可能是因为需要更多计算才能显示所有嵌套视图。

好的，让我们进入代码 - 使用 constraintLayout 您可以在 2 个视图之间简单地使用 chain：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:layout_width="match_parent"
 android:layout_height="match_parent">


<Button
    android:id="@+id/button"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    android:text="Save"
    app:layout_constraintBottom_toBottomOf="@+id/button2"
    app:layout_constraintEnd_toStartOf="@+id/button2"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="@+id/button2" />

<Button
    android:id="@+id/button2"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_margin="8dp"
    android:text="Next"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/button"
    app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>

得到你想要的结果：

现在，如果您已经在答案中通过了上述所有内容，您可能会想知道 - 也许我会留在 LinearLayout，好吧，您可以，这将是您的决定，但以下是 ConstraintLayout 的一些优势：

您的布局将响应所有屏幕尺寸，因此无需为每种屏幕尺寸创建布局。
使用ConstraintLayout 进行布局的速度要快得多，可以节省大量时间。
在几乎所有情况下，与使用LinearLayout 制作的相同布局相比，您的布局性能都会更好

很高兴编码，我希望这个答案会有所帮助，如果您有任何问题，请随时发表评论和提问。

【讨论】：

这看起来不错，但我不想使用“按钮”标签。请让我知道您是否使用“TextView”创建了它。
你可以用任何你想要的视图来创建它，这只是一个例子。随意更改它
非常感谢。你做得很好。
如果这对您有所帮助，请接受答案，以便对其他人有所帮助。

【解决方案8】：

试试这个：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:orientation="horizontal"
        android:gravity="center">

        <TextView
            android:id="@+id/btn_back"
            android:layout_width="0dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:background="@drawable/bg_rounded_green_1"
            android:gravity="center"
            android:layout_margin="5dp"
            android:text="Save &amp; Close"
            android:textColor="@android:color/white"
            android:textSize="13sp" />

        <TextView
            android:id="@+id/btn_next"
            android:layout_width="0dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:background="@drawable/bg_rounded_green_1"
            android:gravity="center"
            android:layout_margin="5dp"
            android:text="@string/label_next_shipping_method"
            android:textColor="@android:color/white"
            android:textSize="13sp" />

    </LinearLayout>

【讨论】：