无法使用“fill_parent”获得正确的布局

Question

我正在尝试在 Android 中创建这个简单的布局。

A 应该换行以适合其内容并left|center_vertical 对齐。

B 应尽可能扩大，填满所有空白空间。

C 应该右对齐，环绕以填充其内容，并且还对齐center_vertical。

这是我的布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal"
        android:gravity="left|center_vertical">
    <!-- A -->
    <ImageView android:id="@+id/example_item_icon"
            android:layout_width="48px"
            android:layout_height="48px"/>
    <!-- B -->
    <LinearLayout android:orientation="vertical"
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
             android:gravity="left|center_vertical"
             android:padding="5px">

        <TextView android:id="@+id/example_item_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textStyle="bold"/>

        <TextView android:id="@+id/example_item_level_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textStyle="bold|italic"
                android:lines="1"
                android:textSize="10px"/>
    </LinearLayout>
    <!-- C -->
    <TextView android:id="@+id/example_item_count_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textStyle="bold"
            android:textSize="14px"/>
</LinearLayout>

在此布局中，C 被推到屏幕外。我怎样才能使这个布局工作？

Answer 1

诀窍，使用相对布局...这是一个示例（在我脑海中 - 未检查并且缺少高度字段和垂直对齐设置，以便轻松查看重要内容）。

<relativelayout android:width="fillParent">
    <textview android:id="@+id/left" android:text="left" 
              android:width="wrap_content"
              android:layout_alignParentleft="true" />
    <textview android:id="@+id/right" android:text="right"
              android:width="wrap_content"
              android:layout_alignParentright="true" />
    <textview android:id="@+id/middle" android:text="middle"
              android:width="wrap_content"
              android:layout_alignleft="@id/right" android:layout_alignright="@id/left" />
</relativelayout>

编辑：这里已经清理了错别字（并且经过测试可以正常工作）

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
<TextView
    android:id="@+id/left"
    android:text="left"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true" />
<TextView
    android:id="@+id/right"
    android:text="right"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true" />
<TextView
    android:id="@+id/middle"
    android:text="middle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_toLeftOf="@id/right"
    android:layout_toRightOf="@id/left" />
</RelativeLayout>

Answer 2

这是我的答案。我只是将 B 上的layout_weight 设置为1。显然，layout_weight 类似于基于百分比的布局方法。我不知道它是如何工作的，但这是我的成品，看起来很棒：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal"
        android:gravity="left|center_vertical">

    <ImageView android:id="@+id/example_item_icon"
            android:layout_width="48px"
            android:layout_height="48px"/>

    <LinearLayout android:orientation="vertical"
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
             android:gravity="left|center_vertical"
             android:layout_weight="1"
             android:padding="5px">

        <TextView android:id="@+id/example_item_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textStyle="bold"/>

        <TextView android:id="@+id/example_item_level_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textStyle="bold|italic"
                android:lines="1"
                android:textSize="10px"/>
    </LinearLayout>

    <TextView android:id="@+id/example_item_count_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textStyle="bold"
            android:textSize="14px"/>
</LinearLayout>

Answer 3

试试这个。我用TextViews 替换了ImageViews，以便更容易地显示在XML 编辑器中。请注意，我在“A”上保留了 48px 的宽度，这不是我认为你真正想要的。将其替换为 wrap_content。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal"
        android:gravity="center_vertical">

    <!-- A -->
    <TextView android:layout_height="48px"
    android:id="@+id/example_item_count_text2"
    android:textSize="14px"
    android:layout_weight="1"
    android:text="this is item a"
    android:textStyle="bold"
    android:layout_width="48px">
    </TextView>

    <!-- B -->
    <LinearLayout android:orientation="vertical"
             android:layout_width="wrap_content"
             android:layout_height="fill_parent"
             android:gravity="center_vertical"
             android:layout_weight="1"
             android:padding="5px">

        <TextView android:id="@+id/example_item_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="this is B"
                android:textStyle="bold"/>

        <TextView android:id="@+id/example_item_level_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="this should be underneath B"
                >
    </LinearLayout>

    <!-- C -->
    <TextView android:id="@+id/example_item_count_text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="this is item c"
            android:layout_weight="1"
            android:textStyle="bold"
            android:textSize="14px"/>
</LinearLayout>

Answer 4

fill_parent 的意思是“与父级一样大”，而不是“使用剩余的空白空间”。而不是 fill_parent，只需使用 android:layout_width="0dip" 和 android:layout_weight="1"。