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

时间:2017-10-05 11:17:05

标签: android textview margin android-constraintlayout

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

Layout with two text views

标题微妙只是单行文字时,它会按预期工作。问题来自更长的文本。如您所见,标题微妙相互重叠:

Results

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

<?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 PM

似乎只能在运行Android 6.0(API 23)的设备/模拟器上重现。在运行API 21-22,24 +的设备上按预期工作。

3 个答案:

答案 0 :(得分:3)

我建议您仅使用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>

答案 1 :(得分:3)

在带有ConstraintLayout版本1.0.0-beta5的API 23上,看起来顶部边距未得到尊重或顶部TextView的高度未正确计算。我确实在API 23上看到了重叠,但在此版本的ConstraintLayout上没有看到API 24。

但是,使用ConstraintLayout版本1.1.0-beta2,API 23和API 24上的所有内容都显示正常,因此这可能是一个已得到纠正的问题。我建议您升级到ConstraintLayout的更高版本,以查看问题是否仍然存在。

答案 2 :(得分:0)

您的TextView1没有下限。

只需添加

app:layout_constraintBottom_toTopOf="@+id/textView2"

为您的第一个textView