Android:在列表项中的ImageView后面画线

时间:2014-09-18 05:35:18

标签: android android-listview imageview

我想在列表项中的ImageView后面画一条线,它填充列表项的整个高度。以下链接中的图像显示了我想要的结果。蓝线是我想要的。

https://www.dropbox.com/s/fbdsuvcyxaz1pnj/listViewDesired.png?dl=0

我有一个ListView,每行都有一个自定义适配器和布局。该行由具有几个元素的相对布局组成:具有锚定在左侧的特定大小的图像,具有锚定到右侧的特定大小的文本视图,以及填充其间的其余空间的文本视图。

我想在ImageView的顶部和底部显示一条细线,并填充该列表项的剩余空间。如果中间有大量文本,则列表项的大小可能会大于图像大小。我怎样才能做到这一点?

我尝试了多种方法,其中framelayout具有匹配/填充父级和ImageView的视图,以及具有3个视图的线性布局(顶行,imageView,填充父级的底线),并且图像看起来正确IDE渲染,但线条不会一直延伸,甚至在应用程序实际运行时显示。

这是我的布局,在imageview后面没有一行。

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:padding="@dimen/marginTop"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">
  <!--Line should be "behind" (extending from top and bottom) of this imageView and should extend to the full height of the RelativeLayout after it has been rendered-->
  <ImageView
          android:id="@+id/tabIcon"
          android:src="@drawable/face"
          android:layout_marginTop="@dimen/margin"
          android:layout_width="@dimen/catchSize"
          android:layout_height="@dimen/catchSize"/>
  <TextView
          android:id="@+id/tabUpdateTime"
          android:layout_marginLeft="@dimen/margin"
          android:layout_alignParentRight="true"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"/>
  <TextView
          android:id="@+id/tabText"
          android:text="@string/long_string"
          android:layout_marginLeft="@dimen/margin"
          android:layout_marginRight="@dimen/margin"
          android:layout_toRightOf="@id/tabIcon"
          android:layout_toLeftOf="@id/tabUpdateTime"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"/>

</RelativeLayout>

2 个答案:

答案 0 :(得分:1)

您只需为图像和垂直线创建单独的布局,并绘制垂直线,您需要添加宽度为1dp的视图或所需的厚度。

尝试使用以下代码:

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

    <!-- Line should be "behind" (extending from top and bottom) of this imageView and should extend to the full height of the RelativeLayout after it has been rendered -->

    <RelativeLayout
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/tabText" >

        <View
            android:id="@+id/verticleLine"
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:layout_centerInParent="true"
            android:background="#0000ff" />

        <ImageView
            android:id="@+id/tabIcon"
            android:layout_width="@dimen/catchSize"
            android:layout_height="@dimen/catchSize"
            android:layout_centerInParent="true"
            android:layout_marginTop="@dimen/margin"
            android:src="@drawable/face" />
    </RelativeLayout>

    <TextView
        android:id="@+id/tabUpdateTime"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_marginLeft="@dimen/margin" />

    <TextView
        android:id="@+id/tabText"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="@dimen/margin"
        android:layout_marginRight="@dimen/margin"
        android:layout_toLeftOf="@id/tabUpdateTime"
        android:layout_toRightOf="@id/image"
        android:text="@string/long_string" />

</RelativeLayout>

答案 1 :(得分:0)

所以我设法通过使用封闭的LinearLayout来解决问题。我改变了一些边缘的东西,但我得到了我想要的效果。 :)

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="horizontal"
              android:paddingLeft="@dimen/marginTop"
              android:paddingRight="@dimen/marginTop"
              android:layout_width="match_parent"
              android:layout_height="match_parent">
  <!--Line should be "behind" (extending from top and bottom) of this imageView and should extend to the full height of the RelativeLayout after it has been rendered-->
  <LinearLayout
          android:orientation="vertical"
          android:clipChildren="false"
          android:id="@+id/frameTabIcon"
          android:layout_marginRight="@dimen/margin"
          android:layout_width="wrap_content"
          android:layout_height="match_parent">
    <View
            android:id="@+id/tabTopLine"
            android:layout_width="@dimen/lineThickNess"
            android:layout_height="@dimen/marginTop"
            android:background="@android:color/black"
            android:layout_gravity="center_horizontal"/>
    <ImageView
            android:onClick="deletePersonOnClick"
            android:id="@+id/tabIcon"
            android:src="@drawable/face"
            android:layout_width="@dimen/catchSize"
            android:layout_height="@dimen/catchSize"/>

    <View
          android:id="@+id/tabBottomLine"
          android:background="@android:color/black"
          android:layout_gravity="center_horizontal"
          android:minHeight="@dimen/marginTop"
          android:layout_width="@dimen/lineThickNess"
          android:layout_height="match_parent"/>

  </LinearLayout>

  <RelativeLayout
          android:layout_marginTop="@dimen/marginTop"
          android:layout_marginBottom="@dimen/marginTop"
          android:layout_width="match_parent"
          android:layout_height="match_parent">

    <TextView
            android:id="@+id/tabUpdateTime"
            android:layout_marginLeft="@dimen/margin"
            android:layout_alignParentRight="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
    <TextView
            android:id="@+id/tabText"
            android:text="@string/long_string"
            android:layout_marginLeft="@dimen/margin"
            android:layout_marginRight="@dimen/margin"
            android:layout_toLeftOf="@id/tabUpdateTime"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"/>
  </RelativeLayout>
</LinearLayout>