Android - 无法正确调整用于 ListView 行的 xml 布局

Question

我正在尝试设置一个 xml 布局以用于 ListView 中的一行。该布局由一个根 LinearLayout 和一个子 RelativeLayout 组成，子 RelativeLayout 包含两个 ImageView(一个锚定到另一个的底部/右角)和一个子垂直LinearLayout 包含两个 TextViews。我希望 ListView 中的每一行都具有相同的宽度和高度，尽 pipe View 中内容的大小。我意识到我不能使用 wrap_content 来根据内容调整 View 的大小，但我不清楚应该使用什么来实现统一的宽度/高度。我尝试使用固定的 dp 值，但这只会让情况变得更糟。我附上了两个截图。第一个来自 iOS 版本，展示了它的外观，而第二个展示了它在 Android 版本上的外观，布局如下。如前所述，我知道出了什么问题(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" >

    <RelativeLayout
       android:layout_width="wrap_content"
       android:layout_height="wrap_content" 
       android:id="@+id/campaign_thumbnail_container" >

        <ImageView
            android:id="@+id/campaign_thumbnail"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
        />

        <ImageView
           android:id="@+id/campaign_mark_new"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_alignBottom="@id/campaign_thumbnail"
           android:layout_alignRight="@id/campaign_thumbnail"
           android:src="@drawable/new1" />
    </RelativeLayout>

   <LinearLayout
        android:id="@+id/campaign_bg"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/word_bar"
        android:orientation="vertical" >

       <TextView
            android:id="@+id/campaign_category"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Medium Text"
            android:textAppearance="?android:attr/textAppearanceMedium" />

      <TextView
        android:id="@+id/campaign_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Large Text"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <TextView
        android:id="@+id/campaign_desc"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Small Text"
        android:textAppearance="?android:attr/textAppearanceSmall" />

    <TextView
        android:id="@+id/campaign_footer"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Small Text"
        android:textAppearance="?android:attr/textAppearanceSmall" />

</LinearLayout>

Answer 1

编辑 - 根据以下评论:

一件通用的事情:要统一调整 LinearLayout 中的元素大小，您需要做两件事:

• 对每个元素使用相等的android:layout_weight
• 设置宽度或高度(无论大小必须唯一)="0dip"

这是因为权重因子仅用于填充剩余的可用空间。首先使用它们的重量/高度放置所有元素，然后计算仍然可用的空间并按重量分配给每个元素。

编辑结束

现在，让我逐步创建布局。 首先，这将是您的一个条目的布局，没有“新广告系列”指示。

<!-- Type 1: Picture left, text right. half-half size. Picture resized to fit -->
<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="0dip"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:scaleType="fitCenter"
        android:src="@android:drawable/ic_menu_camera" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="0dip"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:gravity="center"
        android:text="Your Text"
        android:textAppearance="?android:attr/textAppearanceLarge" />

</LinearLayout>

您会收到警告，因为 LinearLayout 本身有权重。这是必要的，以便为所有列表条目提供相同的高度。

这是类型 2:

<!-- Type 2: Picture right, text left. half-half size. Picture resized to fit -->
<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/textView2"
        android:layout_width="0dip"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:gravity="center"
        android:text="Your Text"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="0dip"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:scaleType="fitCenter"
        android:src="@android:drawable/ic_menu_camera" />

</LinearLayout>

(我的“这很简单!”按钮在哪里？)

还有类型 3。更简单:

<!-- Type 3: Picture full width. Picture resized to fit -->
<ImageView
    android:id="@+id/imageView2"
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1"
    android:scaleType="fitCenter"
    android:src="@android:drawable/ic_menu_camera" />

现在是最后一件事。将这三个布局放在单独的 XML 文件中，并将它们包含在一个包装 RelativeLayout 中。

<!-- Finally overlay the entry with a new indication -->
<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1" >

    <ImageView
        android:id="@+id/newIndication"
        android:layout_width="24dip"
        android:layout_height="24dip"
        android:layout_alignRight="@+id/entry1"
        android:layout_alignBottom="@+id/entry1"
        android:scaleType="fitCenter"
        android:src="@android:drawable/ic_input_add" />

    <include
        layout="@layout/type1entry"
        android:id="@+id/entry1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

</RelativeLayout>

注意 include。我将 Type1 LinearLayout 放在它自己的名为“type1entry”的 XML 文件中。通过使用 @+id/entry1 给它一个新的 id，我可以在 Activity 中明确地访问这个条目。此外，我已将指标的大小设置为 24dip in square。相应地将其更改为您的图像。

我检查了 Eclipse 中的布局，它们确实符合我的预期。