ConstraintLayout 的问题 - 垂直边距不起作用

Question

我想使用 ConstraintLayout 构建这个简单的布局：

当 Title 和 Subtle 只是单行文本时，它按预期工作。问题来自较长的文本。如您所见，Title 和 Subtle 相互重叠：

这是我用于布局的源代码：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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.support.constraint.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="#EEEEEE">

        <TextView
            android:id="@+id/textView1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="24dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
            android:textAppearance="@style/TextAppearance.AppCompat.Headline"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent" />

        <TextView
            android:id="@+id/textView2"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="16dp"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            android:layout_marginBottom="24dp"
            android:text="Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
            app:layout_constraintTop_toBottomOf="@+id/textView1"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintBottom_toBottomOf="parent" />

    </android.support.constraint.ConstraintLayout>

</FrameLayout>

那么问题出在哪里呢？

编辑 1 10/5/2017 1:19 下午

似乎只能在 devices/simulators 运行 Android 6.0 (API 23) 上复制。在设备运行 API 21-22、24+ 上按预期工作。

Answer 1

您的 TextView1 没有下边界。

只需添加

app:layout_constraintBottom_toTopOf="@+id/textView2"

第一个 textView

Answer 2

我建议您只使用 ConstraintLayout，它会给您 chaining option。有了它，您可以打包两个 TextView 并在 ConstraintLayout 本身中将它们垂直居中，而无需 FrameLayout 和您面临的问题：

<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:background="#EEEEEE">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="16dp"
        android:layout_marginRight="16dp"
        android:layout_marginTop="24dp"
        android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
        android:textAppearance="@style/TextAppearance.AppCompat.Headline"
        app:layout_constraintBottom_toTopOf="@+id/textView2"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_chainStyle="packed" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="24dp"
        android:layout_marginLeft="16dp"
        android:layout_marginRight="16dp"
        android:layout_marginTop="16dp"
        android:text="Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView1" />

</android.support.constraint.ConstraintLayout>

Answer 3

在 API 23 ConstraintLayout 版本 1.0.0-beta5 上，看起来上边距没有得到遵守或顶部 TextView 的高度计算不正确。我确实看到 API 23 与此版本的 ConstraintLayout.

有重叠，但 API 24 没有重叠

然而，对于 ConstraintLayout 版本 1.1.0-beta2，在 API 23 和 API 24 上一切看起来都正常，所以这可能是一个已更正的问题。我建议您升级到更高版本的 ConstraintLayout 以查看问题是否仍然存在。

ConstraintLayout 的问题 - 垂直边距不起作用

Problems with ConstraintLayout - vertical margin doesn't work

android

margin

textview

android-constraintlayout