当 TextView 与另一个 TextView 重叠时剪切文本并添加省略号

Question

我正在尝试为 android 构建类似于 Facebook Messenger 中的聊天单元格布局。我能够轻松地复制此布局。我在名称中添加了一个 maxLine 参数，以防它真的很长，如果是这种情况，它将显示省略号。问题是，如果这个人的名字真的很长，省略号将不会出现，我的时间戳将是 2 个字符长 x 2 个字符 TextView that shows the timestamp。我也在使用 CirceImageView 库。

Build.graddle

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    compile 'com.android.support:appcompat-v7:22.2.1'
    compile 'com.android.support:design:22.2.1'
    compile 'de.hdodenhof:circleimageview:1.3.0'
}

layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="72dp"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:paddingTop="8dp"
    android:paddingBottom="8dp">
    <de.hdodenhof.circleimageview.CircleImageView
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/profile_image"
        android:layout_width="56dp"
        android:layout_height="56dp"
        android:src="@drawable/bob"
        android:layout_marginRight="16dp"
        app:border_width="0dp"
        app:border_color="#FF000000"/>
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_toStartOf="@id/lblMessageTime"
                android:text="Person name is lonnnnnnnnnnnnnng"
                android:id="@+id/person_name"
                android:textSize="15sp"
                android:textColor="#000000"
                android:layout_toLeftOf="@id/textTime"
                android:textStyle="bold"
                android:ellipsize="end"
                android:maxLines="1" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:paddingLeft="8dp"
                android:text="23:00"
                android:layout_weight="1"
                android:layout_alignParentRight="true"
                android:layout_alignBaseline="@id/person_name"
                android:id="@+id/lblMessageTime"/>
        </LinearLayout>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/grayAddSessionButton"
            android:id="@+id/textMessage"
            android:text="This is a message"/>
    </LinearLayout>
</LinearLayout>

感谢您的帮助！

Answer 1

如果您想避免重叠，您不应该使用 RelativeLayout 作为 TextViews 的容器，或者不使用 wrap_content 作为 android:layout_width 或 person_name 的容器TextView 但使其固定宽度（即“200dp”）或扩展 TextView class 并使其禁止任何超出特定宽度的拉伸。

Answer 2

我找到了一种轻松完成此操作的方法。我将 android:layout_weight="1" 删除到时间戳，并将 android:layout_weight=".5" 添加到名称 TextView。由于名称 TextView 是唯一具有权重且小于 1 的名称，因此如果它与时间戳 (see image) 重叠，则包含名称的 TextView 将不会完全显示。

这是新代码：

Layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="72dp"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:paddingTop="8dp"
    android:paddingBottom="8dp">
    <de.hdodenhof.circleimageview.CircleImageView
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/profile_image"
        android:layout_width="56dp"
        android:layout_height="56dp"
        android:src="@drawable/bob"
        android:layout_marginRight="16dp"
        app:border_width="0dp"
        app:border_color="#FF000000"/>
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:text="This name is really long but it is cut"
                android:id="@+id/person_name"
                android:textSize="15sp"
                android:textColor="#000000"
                android:layout_toLeftOf="@id/textTime"
                android:textStyle="bold"
                android:ellipsize="end"
                android:layout_weight=".5"
                android:maxLines="1"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:paddingLeft="8dp"
                android:text="23:00"
                android:layout_alignParentRight="true"
                android:id="@+id/lblMessageTime"/>
        </LinearLayout>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@color/grayAddSessionButton"
            android:id="@+id/textMessage"
            android:text="This is a message"/>
    </LinearLayout>
</LinearLayout>

当 TextView 与另一个 TextView 重叠时剪切文本并添加省略号

Cut text and add ellipses when TextView is overlapping another TextView

android

android-layout

android-xml

android-activity