视图在ConstraintLayout中被推出其约束 [英] View is pushed out of its constraints in ConstraintLayout

问题描述

我有一个 ConstraintLayout 和一个 ImageView ，以及3个链式 TextViews 和一个spread_inside链式:

I have a ConstraintLayout with an ImageView and 3 chained TextViews with a spread_inside chain style:

<android.support.design.card.MaterialCardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <android.support.constraint.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingBottom="@dimen/space_normal"
        android:paddingEnd="@dimen/space_normal"
        android:paddingStart="@dimen/space_normal"
        android:paddingTop="@dimen/space_big">

        <ImageView
            android:id="@+id/ivImage"
            android:layout_width="@dimen/feed_list_image_size"
            android:layout_height="@dimen/feed_list_image_size"
            android:layout_marginBottom="@dimen/space_normal"
            android:contentDescription="@null"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.0"
            tools:src="@color/debug_3" />

        <TextView
            android:id="@+id/tvTitle"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginEnd="@dimen/space_normal"
            android:ellipsize="end"
            android:maxLines="3"
            android:textSize="@dimen/text_size_big"
            app:layout_constraintBottom_toTopOf="@+id/tvContent"
            app:layout_constraintEnd_toStartOf="@+id/ivImage"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_chainStyle="spread_inside"
            app:textAllCaps="true"
            tools:text="@tools:sample/lorem" />

        <TextView
            android:id="@+id/tvContent"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginBottom="@dimen/space_big"
            android:layout_marginTop="@dimen/space_normal"
            android:ellipsize="end"
            android:maxLines="4"
            android:textColor="@color/gray_600"
            android:textSize="@dimen/text_size_normal"
            app:layout_constraintBottom_toTopOf="@+id/tvDate"
            app:layout_constraintEnd_toEndOf="@+id/tvTitle"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/tvTitle"
            tools:text="@tools:sample/lorem/random" />

        <TextView
            android:id="@+id/tvDate"
            style="@style/AppTheme.ItemFeedList.Date"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="@dimen/space_normal"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/tvContent"
            tools:text="@tools:sample/date/hhmm" />

    </android.support.constraint.ConstraintLayout>

</android.support.design.card.MaterialCardView>

这在编辑器中呈现了一个漂亮而灵活的布局:

This renders a nice and flexible layout in the editor:

但是有时顶视图会从其约束中弹出"，因此文本呈现是错误的(剪切).这很奇怪，因为spread_inside链样式应该膨胀并缩小中间视图.从布局检查器:

But sometimes the top view is "pushed" out of its contraints so the text rendering is wrong (clipped). It's wierd because spread_inside chain style should inflate and narrow the middle view. From the Layout Inspector:

这是怎么了?

推荐答案

在ConstraintLayout的1.1版中进行的更改可能会对您有所帮助.尝试在麻烦的TextView上设置app:layout_constrainedHeight=true.从 ConstraintLayout开发人员指南:

A change made in version 1.1 of ConstraintLayout may help you. Try setting app:layout_constrainedHeight="true" on your troublesome TextView. From the developer guide for ConstraintLayout:

WRAP_CONTENT:强制执行约束(在1.1中添加)

WRAP_CONTENT : enforcing constraints (Added in 1.1)

如果将尺寸设置为WRAP_CONTENT，则在1.1之前的版本中，它们将被视为文字尺寸-意味着，约束将不会限制生成的尺寸.通常，这足够了(并且更快)，但在某些情况下，您可能想使用WRAP_CONTENT，但仍要强制执行约束以限制结果尺寸.在这种情况下，您可以添加相应的属性之一:

If a dimension is set to WRAP_CONTENT, in versions before 1.1 they will be treated as a literal dimension -- meaning, constraints will not limit the resulting dimension. While in general this is enough (and faster), in some situations, you might want to use WRAP_CONTENT, yet keep enforcing constraints to limit the resulting dimension. In that case, you can add one of the corresponding attribute:

app:layout_constrainedWidth =" true | false"
app:layout_constrainedHeight =" true | false"

app:layout_constrainedWidth="true|false"
app:layout_constrainedHeight="true|false"

这篇关于视图在ConstraintLayout中被推出其约束的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！