Question

我正在开发一个聊天功能，我希望用户消息显示在右侧上，而其他消息则来自左侧。右侧给出了一些麻烦。

由于消息很短，它应该贴在屏幕的右侧，然后用户名应紧挨着它，如下所示（Android开发人员“ show layout bounds ”是的）：

只是一些简单的 LinearLayout ，其中两个TextView对齐，但您可以看到这不适用于较长的邮件，因为它们被剪掉了这个名字通常是看不见的。我已经设法用约束布局来做到这一点：

ConstraintLayout solution, works for long messages but doesn't make short one stick to the screens edge ]

ConstraintLayout （包装器）左边有一个100dp约束的边距，在其中，名称和消息是链接的。缺点是短消息不再适用于右侧。

如何管理布局以自动调整我想要的方式？

Answer 1

您应该可以通过实施constraint Guideline来管理此功能。

通过这种方式，您可以垂直拆分整个布局，并在单独格式化每一面时分离用户消息和响应。

<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/guideline"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.5" />

尝试使用以下内容：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout android:layout_height="match_parent"
android:layout_width="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">

<android.support.constraint.Guideline
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/guideline"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.5" />

<LinearLayout
    app:layout_constraintRight_toLeftOf="@id/guideline"
    android:id="@+id/friend_column"
    android:layout_width="0dp"
    app:layout_constraintWidth_percent=".5"
    android:layout_marginLeft="10dp"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/friend"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textStyle="bold"
        android:text="Friend"/>
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginRight="10dp"
        android:gravity="end"
        android:text="Whats up?"/>
</LinearLayout>

<LinearLayout
    app:layout_constraintTop_toBottomOf="@id/friend_column"
    app:layout_constraintLeft_toRightOf="@id/guideline"
    android:id="@+id/user_column"
    android:layout_width="0dp"
    app:layout_constraintWidth_percent=".5"
    android:layout_marginRight="10dp"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <TextView
        android:id="@+id/user"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="end"
        android:textStyle="bold"
        android:text="User"/>
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginRight="10dp"
        android:gravity="end"
        android:text="I'm sailing away set an open course for the virgin sea
        I've got to be free free to face the life that's ahead of me
        On board I'm the captain so climb aboard
        We'll search for tomorrow on every shore
        And I'll try oh Lord I'll try to carry on"/>
</LinearLayout>

</android.support.constraint.ConstraintLayout>

Answer 2

如果您已经拥有ConstraintLayout，也许可以帮助您，可以使用可能的约束属性进行更多操作。

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp">

  <TextView
      android:id="@+id/name"
      style="@style/TextAppearance.AppCompat.Body1"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginStart="100dp"
      android:paddingEnd="8dp"
      android:text="Name"
      app:layout_constraintEnd_toStartOf="@id/message"
      app:layout_constraintHorizontal_chainStyle="spread_inside"
      app:layout_constraintStart_toStartOf="parent"/>

  <TextView
      android:id="@+id/message"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginEnd="16dp"
      android:text="Message"
      app:layout_constrainedWidth="true"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintStart_toEndOf="@id/name"/>

  <TextView
      android:id="@+id/name2"
      style="@style/TextAppearance.AppCompat.Body1"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginStart="100dp"
      android:paddingEnd="8dp"
      android:text="Name"
      app:layout_constraintEnd_toStartOf="@id/message2"
      app:layout_constraintHorizontal_chainStyle="spread_inside"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintTop_toBottomOf="@id/message"/>

  <TextView
      android:id="@+id/message2"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginEnd="16dp"
      android:text="A Very Long message for you to read  set we cen test to row breaking in this text Message"
      app:layout_constrainedWidth="true"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintStart_toEndOf="@id/name2"
      app:layout_constraintTop_toBottomOf="@id/message"/>
</android.support.constraint.ConstraintLayout>

神奇的是：app:layout_constrainedWidth="true"负责视图的最大宽度，具体取决于周围的视图（只需使用toStartOf ... EndOf约束）（参见：https://developer.android.com/reference/android/support/constraint/ConstraintLayout）。

另外app:layout_constraintHorizontal_chainStyle="spread_inside"注意，视图总是左右对齐，这是约束布局中的链接（https://developer.android.com/training/constraint-layout/）

希望它可以帮助您解决问题。

如何在保持最大长度的同时制作两个textviews包装内容？

2 个答案: