如何根据文本视图的长度对齐文本视图

Posted 2023-03-17

【中文标题】如何根据文本视图的长度对齐文本视图

【英文标题】：How to align a TextView according to its length

【发布时间】：2020-05-14 09:47:32

【问题描述】：

我有一个接口，其中包含两个 ImageButton 和一个 TextView。 TextView 包含一个数字，两个 ImageButtons 控制该数字，添加或删除 1。 问题是当数字变为两位数时：TextView 宽度增加并且两个 ImageButtons 之一移动。

正如您所见，当数字为一位时，没有任何类型的问题，但当它变为两位时，ImageButton 会从他的位置移动。我已经尝试过使用android:layout_gravity 和android:gravity，但它们不起作用。有一种方法可以让 TextView “居中”并确保 ImageButton 不会移动？

<?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:autofit="http://schemas.android.com/tools"
    android:layout_
    android:layout_
    android:paddingStart="5dp">

    <LinearLayout
        android:layout_
        android:layout_
        android:layout_weight="1"
        android:gravity="center_vertical"
        android:orientation="vertical">

        <TextView
            android:id="@+id/foodName"
            android:layout_
            android:layout_
            android:layout_marginEnd="10dp"
            android:gravity="center_vertical"
            android:hint="food_name"
            android:maxLines="2"
            android:textAllCaps="false"
            android:textColor="@android:color/black"
            android:textSize="18sp"
            android:textStyle="bold" />
    </LinearLayout>

    <LinearLayout
        android:layout_
        android:layout_
        android:layout_gravity="end"
        android:gravity="end"
        android:orientation="horizontal"
        android:padding="5dp">

        <ImageButton
            android:id="@+id/addFood"
            android:layout_
            android:layout_
            android:background="@null"
            app:srcCompat="@drawable/ic_add_black_40dp" />

        <TextView
            android:id="@+id/foodQuantity"
            android:layout_
            android:layout_
            android:layout_gravity="center|center_horizontal"
            android:layout_marginStart="10dp"
            android:layout_marginEnd="10dp"
            android:gravity="center|center_horizontal"
            android:maxLength="2"
            android:text="0"
            android:textColor="#707070"
            android:textSize="20sp"
            android:textStyle="bold" />

        <ImageButton
            android:id="@+id/removeFood"
            android:layout_
            android:layout_
            android:background="@null"
            app:srcCompat="@drawable/ic_remove_black_40dp" />

    </LinearLayout>

</LinearLayout>

这是我的代码，这是 RecyclerView 成员的布局，因为我创建了一个个性化元素。 非常感谢。

【参考方案1】：

我建议您使用android:layout_weight，以便您可以在必要时定义哪个元素正在填充剩余空间。因此，当将 TextView 的 layout_weight 设置为 1 并将 ImageButtons 的 layout_weight 设置为 0 时，您可以随后将定义 TextView 内部重力的 TextView 的 android:gravity 设置为 center，并且它将始终居中。

但是：您需要将LinearLayout 的宽度设置为match_parent，以便它填充父级。否则，LinearLayout 将永远不会获得一些剩余空间，因为它总是会缩小到所有元素一起需要的大小

【讨论】：

你说的是包含 ImageButtons 和 textView 的布局吗？

所以我尝试了你的建议，如果我将 linearLayout 宽度设置为 match_parent 它会覆盖所有空间。

【参考方案2】：

由于您的foodQuantity TextView 上有wrap_content，addFood 将移动以适应添加多个数字所需的额外间距。如果你想保持按钮的位置固定，并确保按钮不移动，那么你将不得不给你的TextView 一个固定的宽度，以适应你可以预期的最大字符数。

【讨论】：

好的，我明白了。所以我需要为 dp 中的 textView 设置一个固定的尺寸？

是的。而不是wrap_content，而是给foodQuantity一个固定的宽度60dp或任何你认为最适合你的设计的宽度，基于你将支持的最大位数。

好的，但我需要针对不同类型的屏幕进行调整吗？

没有。你的foodNameTextView 的宽度会根据设备的宽度而变化，所以这种情况下不用担心屏幕尺寸不同。

好的，我把尺寸设置为 25 dp，它可以工作。非常感谢！

【参考方案3】：

...
...
<LinearLayout
   android:id="@+id/layout_count"
   android:layout_
   or android:layout_wrap_content"
   android:orientation="vertical">

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

       <ImageView
           android:layout_
           android:layout_
           android:src="@drawable/ic_complete" />

       <TextView
           android:layout_
           android:layout_weight="1"
           android:gravity="center"
           android:layout_
           android:text="1" />

      <ImageView
           android:layout_
           android:layout_
           android:src="@drawable/ic_complete" />

   </LinearLayout>

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

       <ImageView
           android:layout_
           android:layout_
           android:src="@drawable/ic_complete" />

       <TextView
           android:layout_
           android:layout_weight="1"
           android:gravity="center"
           android:layout_
           android:text="1" />

      <ImageView
           android:layout_
           android:layout_
           android:src="@drawable/ic_complete" />

   </LinearLayout>

</LinearLayout>

【讨论】：

我不明白这是什么。

如果您尝试使用此代码，您可以理解。该代码与您发布的图像相同（左图）。如果你愿意，你可以写 3 或 4 位数字。您的图像不会移动。