2

我有一个 Android ListView，我希望它包含一个TextView带有文本 ( titleTextView) 的行，并且我想要一个左 ( leftCellBorder) 和右 ( rightCellBorder) 边框图像，该图像被拉伸以填充行的高度。

行的高度取决于 中有多少文本titleTextView。如果文本溢出到第二行，则应垂直拉伸两个边框以填充边框的高度。

因此，对于单行文本，行视图应如下所示：

在此处输入图像描述

使用两行文本，行视图应如下所示：

在此处输入图像描述

我的 XML 的第一个版本是这样的：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

     <ImageView
         android:id="@+id/leftCellBorder"
         android:layout_width="wrap_content"
         android:layout_height="match_parent"
         android:layout_alignParentBottom="true"
         android:layout_alignParentLeft="true"
         android:layout_alignParentTop="true"
         android:layout_gravity="fill_vertical"
         android:adjustViewBounds="true"
         android:scaleType="fitXY"
         android:src="@drawable/cell_border_left" />

    <TextView
        android:id="@+id/titleTextView"
        android:layout_width="210dp"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:gravity="center"
        android:text="Title"
        android:textSize="30dp" />

    <ImageView
        android:id="@+id/rightCellBorder"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:src="@drawable/cell_border_right" />

</RelativeLayout>

我认为拥有andleftCellBorder就rightCellBorder足以确保它们被拉伸到正确的高度，但这不起作用，我得到的结果如下：layout_heightmatch_parent

在此处输入图像描述

即图像没有被拉伸以填充高度。

所以然后我回去尝试LinearLayout在根部使用水平而不是RelativeLayout有3个子视图。这实际上有效，并且左右边界被适当拉伸以填充高度，但是我遇到的问题是似乎没有办法用 a 夹住rightCellBorder右侧LinearLayout（除非我我错过了一些东西）。

那么——我怎样才能达到我想要的效果呢？最好我想坚持，RelativeLayout因为这给了我更多的灵活性。当然这不应该那么困难！

4

3 回答 3

1

如果您想坚持RelativeLayout将 ImageViews 的属性更改为：

android:layout_height="wrap_content"
android:layout_alignTop="@+id/titleTextView"
android:layout_alignBottom="@+id/titleTextView"

并删除alignParentTop,alignParentBottom和layout_gravity.

于 2013-08-13T19:44:33.127 回答
1

线性布局绝对是您设计的更好布局选择（并且渲染速度更快）。您只需要使用 layout_weight 属性。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/leftCellBorder"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:src="@drawable/cell_border_left" />

    <TextView
        android:id="@+id/titleTextView"
        android:layout_width="0dp" <!-- When assigning a weight, either the width or the height will be inferred from the weight depending upon your layouts orientation. Whichever will be inferred should be set to 0dp, it's more efficient. -->
        android:layout_height="wrap_content"
        android:layout_weight="1" <!-- If only one child has weight, it occupies all the remaining space. (As with real children.) -->
        android:gravity="center"
        android:text="Lorem Ipsum Dolor Sit Amet Consecteteur Adipiscing Elit"
        android:textSize="30dp" />

    <ImageView
        android:id="@+id/rightCellBorder"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:src="@drawable/cell_border_right" />

</LinearLayout>

编辑：然而，最简单的解决方案是为您的背景可绘制创建一个 9-patch，放弃 ImageViews 并将其应用于您的 TextView；您可以简单地使用填充来确保文本保留在透明部分中......就像这样：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <TextView
        android:id="@+id/titleTextView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingLeft="20dp" <!-- Use the padding to space the text from your sides -->
        android:paddingRight="20dp"
        android:background="@drawable/YOUR_9_PATCH"
        android:gravity="center"
        android:text="Lorem Ipsum Dolor Sit Amet Consecteteur Adipiscing Elit"
        android:textSize="30dp" />

</LinearLayout>

如果您想要/需要在 TextView 之外但在周围元素之前的空间，您可以在布局上使用填充...

于 2013-08-13T19:49:04.130 回答
0

回到 LinearLayout 并尝试：

<ImageView
.
.
android:layout_weight="0"
>
<TextView
.
.
android:layout_weight="1"
>
<ImageView
.
.
android:layout_weight="0"
>

（确保所有视图上的 android:layout_width="wrap_content" ）

于 2013-08-13T19:33:22.640 回答