如何获得以下效果

Question

期望的输出：

获得的输出：

如何按照第1张图像获得所需的输出？

MyLayout：

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:padding="10dp"
    android:layout_marginLeft="20dp"
    android:layout_marginTop="5dp"
    android:layout_marginBottom="5dp"
    android:layout_marginRight="10dp">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:id="@+id/tvQty"
        android:textColor="@color/baseDark"
        android:text="x1"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/tvFoodName"
        android:layout_weight="3"
        android:text="Ceaser Salad with Herb Grilled Chicken Ceaser Ceaser Salad with Herb "
        android:textColor="@color/baseDark"
        android:maxLines="1"
        android:ellipsize="end"
        android:gravity="center_vertical"
        android:layout_gravity="center_vertical"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/tvFoodPrice"
        android:layout_weight="2"
        android:text="1234"
        android:textColor="@color/baseDark"
        android:layout_gravity="center_vertical"
        android:gravity="center"/>
</LinearLayout>

我的问题是什么？ 除了TableLayout之外，还有其他方法可以获得所需的结果吗？ 我应该计算每个TextView的宽度并从代码中设置它吗？

Answer 1

表格布局

使用TableLayout可以轻松实现此类布局。

示例：http://www.tutorialspoint.com/android/android_table_layout.htm

在您的情况下，您需要一个包含3行和3列的表。

线性布局

此外，您可以使用两种类型的LinearLayout来布置您的视图，例如该图片。

• 一个垂直方向的容器LinearLayout。
• 多个LinearLayout的作用类似于水平方向的行。

每一行都应该是这样的：

<LinearLayout>
    <TextView
        android:layout_width="0dp"
        android:layout_weight="1" />
    <TextView
        android:layout_width="0dp"
        android:layout_weight="3" />
    <TextView
        android:layout_width="0dp"
        android:layout_weight="1" />
</LinearLayout>

Answer 2

  

除了TableLayout之外，还有其他选择可以获得所需   导致？

使用RelativeLayout

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:alignParentLeft="true"
        android:id="@+id/tvQty"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:toLeftOf="@id/tvFoodPrice"
        android:toRightOf="@id/tvQty"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:alignParentRight="true"
        android:id="@+id/tvFoodPrice"/>

</RelativeLayout>

然后你可以添加填充，边距和重力来实际获得你想要的东西

Answer 3

尝试以下内容。

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:padding="10dp"
android:weightSum="6"
>
<TextView
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:id="@+id/tvQty"
    android:layout_weight="1"
    android:textColor="@color/baseDark"
    android:text="x1"/>
<TextView
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:id="@+id/tvFoodName"
     android:layout_weight="4"
    android:text="Ceaser Salad with Herb Grilled Chicken Ceaser Ceaser Salad with Herb "
    android:textColor="@color/baseDark"
    android:gravity="center_vertical"
    android:layout_gravity="center_vertical"/>
    <TextView
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:id="@+id/tvFoodPrice"
    android:layout_weight="1"
    android:text="1234"
    android:textColor="@color/baseDark"
    android:layout_gravity="center_vertical"
    android:gravity="center"/>
    </LinearLayout>