如何使用相对布局垂直对齐列表中的项目？

Question

我在 Android 1.5 中使用列表视图来显示图像列表和图像旁边的文本。我正在尝试将文本垂直居中，但文本位于行的顶部而不是居中。下面是我的布局：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/row"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:padding="10dip">

    <ImageView android:id="@+id/item_image" android:layout_width="wrap_content" 
        android:layout_height="wrap_content"  android:paddingRight="10dip" 
        android:src="@drawable/default_image" android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_alignParentBottom="true"
        android:layout_centerVertical="true"
        android:gravity="center_vertical"/>

    <TextView android:id="@+id/item_title" 
        android:layout_width="wrap_content" android:layout_height="wrap_content" 
        android:layout_toRightOf="@id/item_image" 
        android:layout_alignParentTop="true"
        android:layout_alignParentBottom="true"
        android:layout_centerVertical="true"
        android:gravity="center_vertical"
        />

</RelativeLayout>

当我试图将文本垂直居中时，我需要设置 alignParentTop="true" 似乎很奇怪，但如果我不这样做，文本甚至不会出现。我做错了什么？

Answer 1

按照 cmets 编辑：

事实证明，使用 RelativeLayout 进行这项工作并不容易。在答案的底部，我包含了一个可以提供所需效果的 RelativeLayout，但仅在它包含在 ListView 中之前。之后，出现了与问题中描述的相同的问题。改用 LinearLayout(s) 已解决此问题。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingLeft="10dp"
    android:orientation="horizontal">

    <ImageView android:id="@+id/pickImageImage" 
        android:layout_width="100dp"
        android:layout_height="80dp"
        android:background="@drawable/icon"
        android:scaleType="fitXY"
        android:layout_marginRight="10dp"/>

    <TextView android:id="@+id/pickImageText" 
        android:layout_height="fill_parent"
        android:layout_width="fill_parent"
        android:gravity="left|center_vertical"
        android:text="I'm the text"/>

</LinearLayout>

如果你想有两个文本框，你可以在 ImageView 之后嵌套第二个orientation="vertical" 和 LinearLayout，然后将文本框放在那里。

这行得通，但我不得不承认我不知道为什么 RelativeLayouts 没有。例如，这个blog post by Romain Guy 专门说RelativeLayout 应该。当我尝试它时，我从来没有让它完全工作。诚然，我并没有像他那样完全做到这一点，但我唯一的改变是 TextViews 的一些属性，这不应该有太大的区别。

---

这是原始答案：

我认为您将 Android 与 RelativeLayout 中所有那些有些矛盾的指令混淆了。我将你的东西重新格式化为：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/row"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:padding="10dip">

    <ImageView android:id="@+id/item_image"
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content"
        android:paddingRight="10dip" 
        android:src="@drawable/icon"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"/>

    <TextView android:id="@+id/item_title" 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:layout_toRightOf="@id/item_image" 
        android:layout_centerVertical="true"
        android:text="Blah!"/>

</RelativeLayout>

而且效果很好。我删除了许多多余的android:layout_alignParentxxx，因为它们不是必需的。这个视图现在出现在左上角的图片和旁边垂直居中的文本。如果您还希望图片垂直居中，那么您不能将 RelativeLayout 放在 android:layout_height="wrap_content" 上，因为它试图使自己不高于图片的高度。您必须指定一个高度，例如80dp，然后使用 android:scaleType="fitXY" 将 ImageView 设置为 60dp 等固定高度，使其按比例缩小以适合。

Answer 2

在类似的问题上停留了一段时间，但从 CommonsWare 中找到了这个：

“当你膨胀布局时，使用inflate(R.layout.whatever, parent, false)，其中parent是ListView。”

仅当您将行高设置为特定值时才有效（即您不能使用 wrap_content）。

Answer 3

Baseline 指令可以做到这一点，但 ImageView 从今天起根本不支持基线对齐。您可以通过创建 ImageView 的子类、覆盖 getBaseline() 方法并返回图像的高度来解决此问题。