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

Question

我有一个接口，其中包含两个 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_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingStart="5dp">

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center_vertical"
        android:orientation="vertical">

        <TextView
            android:id="@+id/foodName"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            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_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end"
        android:gravity="end"
        android:orientation="horizontal"
        android:padding="5dp">

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

        <TextView
            android:id="@+id/foodQuantity"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            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_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@null"
            app:srcCompat="@drawable/ic_remove_black_40dp" />

    </LinearLayout>

</LinearLayout>

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

Answer 1

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

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

Answer 2

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

Answer 3

...
...
<LinearLayout
   android:id="@+id/layout_count"
   android:layout_width="200dp"
   or android:layout_width="match_parent
   android:layout_height="wrap_content"
   android:orientation="vertical">

   <LinearLayout
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:orientation="horizontal"
       android:gravity="center_vertical">

       <ImageView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:src="@drawable/ic_complete" />

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

      <ImageView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:src="@drawable/ic_complete" />

   </LinearLayout>

   <LinearLayout
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:orientation="horizontal"
       android:gravity="center_vertical">

       <ImageView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:src="@drawable/ic_complete" />

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

      <ImageView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:src="@drawable/ic_complete" />

   </LinearLayout>

</LinearLayout>