logo标签列表

在RelativeLayout中，TextView与ImageView重叠问题

androidlistviewtextviewimageviewoverlap
3

我有一个在getView中膨胀的listitem.xml，用于视频列表显示。当标题txtTitle很长时，它会重叠在其右侧的arrowImage上，覆盖它。

有什么建议可以避免这种情况吗？如何让标题文本换行显示？

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/list_selector"
android:orientation="horizontal"
android:padding="5dip" >


<ImageView
    android:id="@+id/imgIcon"
    android:background="@drawable/image_bg"
    android:layout_width="109dp"
    android:layout_height="68dp"
    android:scaleType="fitXY"
    android:padding="3dip"/>

    <TextView
        android:id="@+id/txtTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="#b0b0b0"
        android:layout_centerVertical="true"
        android:layout_toRightOf="@+id/imgIcon"
        android:typeface="sans"
        android:textSize="12dip"
        android:layout_marginLeft="6dip"
        android:layout_marginRight="6dip"
        android:paddingRight="10dip"
        android:textStyle="bold" />


    <ImageView    
    android:id="@+id/arrowImage"
    android:src="@drawable/arrow"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_centerVertical="true"
    android:padding="3dip"
    android:paddingLeft="10dip"
    android:paddingRight="10dip" />

   </RelativeLayout>
为什么不使用“复合可绘制对象”？图像将位于TextView内部，因此不会被文本覆盖，因为它在TextView内有自己的保留空间。 - Phantômaxx
在你的TEXTVIEW中尝试使用android:layout_toLeftOf="@+id/arrowImage"和android:layout_toRightOf="@+id/imgIcon"。 - MilapTank
这个可行 @andruboy，没错！ - andreasperelli
我应该发布为答案吗？ - MilapTank
是的，@andruboy，谢谢。 - andreasperelli
3个回答
2

尝试使用这段代码

在您的TextView中添加代码

android:layout_toLeftOf="@+id/arrowImage" 
android:layout_toRightOf="@+id/imgIcon"

最终代码

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:background="@drawable/list_selector"
  android:orientation="horizontal"
  android:padding="5dip" >

          <ImageView
             android:id="@+id/imgIcon"
             android:background="@drawable/image_bg"
             android:layout_width="109dp"
             android:layout_height="68dp"
             android:scaleType="fitXY"
             android:padding="3dip"/>

         <TextView
             android:id="@+id/txtTitle"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:textColor="#b0b0b0"
             android:layout_centerVertical="true"
             android:layout_toRightOf="@+id/imgIcon"
             android:layout_toLeftOf="@+id/arrowImage"
             android:typeface="sans"
             android:textSize="12dip"
             android:layout_marginLeft="6dip"
             android:layout_marginRight="6dip"
             android:paddingRight="10dip"
             android:textStyle="bold" />

         <ImageView    
             android:id="@+id/arrowImage"
             android:src="@drawable/arrow"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_alignParentRight="true"
             android:layout_centerVertical="true"
             android:padding="3dip"
             android:paddingLeft="10dip"
             android:paddingRight="10dip" />

</RelativeLayout>
1
使用复合绘制。图像将位于TextView内部，因此不会被文本覆盖，因为它在TextView内部有自己的保留空间。
请注意，较少的视图（和/或布局）=更好的性能（这是一个教条）。
移除ImageView并在您的TextView中设置：
android:drawableTop|Left|Right|Bottom="@drawable/your_image"

在你的情况下，
android:drawableLeft="@drawable/your_image"

并且

android:drawableRight="@drawable/arrow_image"

如果您已经有一个TextView的引用，想要通过编程方式设置复合绘图，只需使用setCompoundDrawablesWithIntrinsicBounds()方法分配一个或多个复合图像即可。详情请参见此处：http://developer.android.com/reference/android/widget/TextView.html#setCompoundDrawablesWithIntrinsicBounds(int, int, int, int)

顺序为：左，上，右，下。
这个方法很管用（不会重叠）。顺便说一下，我需要将箭头图像固定在右侧。使用这种解决方案，箭头不是固定位置，而是随着TextView长度而变化。 - andreasperelli
只需对箭头图像执行相同的操作！android:drawableRight="@drawable/arrow_image" - 我更新了我的答案。 - Phantômaxx
这是最优化的方法来做到那件事。 - Phantômaxx
唯一的问题是我应该从Java代码中分配动态图像（imgIcon是视频缩略图），而setCompoundDrawablesWithIntrinsicBounds（int，int，int，int）需要来自R.drawable的图像。 - andreasperelli
我实际上是通过以下方式获取图像的：holder.thumbImage = (ImageView) convertView.findViewById(R.id.imgIcon); holder.thumbImage.setImageBitmap(curThumb); - andreasperelli
显示剩余2条评论
1

你能试一下这段代码吗？

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

    <LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_toLeftOf="@+id/relativeLayout1"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/imgIcon"
            android:background="@drawable/image_bg"
            android:layout_width="109dp"
            android:layout_height="68dp"
            android:scaleType="fitXY"
            android:padding="3dip"/>

        <TextView
            android:id="@+id/txtTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:layout_marginLeft="5dp"
            android:textColor="#b0b0b0"
            android:typeface="sans"
            android:textSize="12dip"
            android:textStyle="bold" />
    </LinearLayout>

    <RelativeLayout
        android:id="@+id/relativeLayout1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true" >

        <ImageView
            android:id="@+id/arrowImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:src="@drawable/arrow" />
    </RelativeLayout>

</RelativeLayout>
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接