Dav*_*vid 4 xml android android-support-library android-constraintlayout
我想知道是否有可能实现以下(消息线程;首先从发送者的右侧开始,而不是从接收者的一侧开始)视图:
...使用支持库中的Android约束而不是maxWidth属性,特别是对于文本气泡的宽度-我非常希望容器的宽度(由TextView以及其圆角背景以及发送者的ImageView图标组成)的宽度最多为屏幕的五分之四,然后像标准消息传递应用程序一样将下面的几行文字换行如下。因为到目前为止,我无法使用约束条件的指导来实现它,如下所示:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.constraint.Guideline
android:id="@+id/left_margin_guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.2"/>
<android.support.constraint.ConstraintLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:padding="@dimen/padding_one_half"
app:layout_constraintStart_toEndOf="@+id/left_margin_guideline"
app:layout_constraintEnd_toEndOf="parent">
<de.hdodenhof.circleimageview.CircleImageView
android:id="@+id/message_icon"
android:layout_width="@dimen/conversation_icon_size"
android:layout_height="@dimen/conversation_icon_size"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
tools:src="@drawable/ic_toolbar_logo"/>
<io.github.rockerhieu.emojicon.EmojiconTextView
android:id="@+id/message_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/ic_curved_corners_message"
android:padding="@dimen/padding_one_half"
android:layout_marginRight="@dimen/padding_one_half"
android:layout_marginEnd="@dimen/padding_one_half"
app:layout_constraintEnd_toStartOf="@+id/message_icon"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
tools:text="This is a message that should wrap if it gets too long or if there is a \nnewline in the middle of the message"/>
<TextView
android:id="@+id/message_posted"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="@dimen/font_small"
android:textColor="@color/colorGrayXLight"
android:layout_marginTop="@dimen/padding_one_half"
app:layout_constraintTop_toBottomOf="@+id/message_text"
app:layout_constraintEnd_toEndOf="@+id/message_text"
tools:text="2:45 PM"/>
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>
Run Code Online (Sandbox Code Playgroud)
...导致:
您会注意到,消息文本从一开始就被截断了,如果我要与父对象一起设置文本的开始约束,那么由于文本的宽度,它无法达到单行文本(即单个单词)的全部目的。然后,当我希望将其包裹起来时,就可以将父项与居中的文本匹配,就像上面上方屏幕截图中的样子一样。
所有这些都说明了,如果我可以在约束条件下解决问题,那就太好了,因为我希望此布局在其他屏幕尺寸上尽可能地响应,而不必将maxWidth属性与硬编码值一起使用,也可以基于屏幕大小,我发现在样板代码方面非常不便,尤其是对于消息线程视图。
是的,您可以使用该文本元素的偏心居中约束(左+右+偏倚1)和constrainedWidth(使用ConstraintLayout 1.1)来实现:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="@+id/textView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="32dp"
android:layout_marginEnd="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="32dp"
android:text="a message that should wrap if it is too long or if there is a space in the middle of the text"
app:layout_constrainedWidth="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/imageView2"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ImageView
android:id="@+id/imageView2"
android:layout_width="32dp"
android:layout_height="32dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@mipmap/ic_launcher_round" />
<TextView
android:id="@+id/textView8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:text="2:45 PM"
app:layout_constraintEnd_toStartOf="@+id/imageView2"
app:layout_constraintTop_toBottomOf="@+id/textView7" />
</android.support.constraint.ConstraintLayout>
Run Code Online (Sandbox Code Playgroud)
用较短的消息替换文本可以正确适应:
解决此类问题的正确方法是根据需要使用app:layout_constrainedWidth=\xe2\x80\x9dtrue|false\xe2\x80\x9d或。app:layout_constrainedHeight=\xe2\x80\x9dtrue|false\xe2\x80\x9d