为什么我的 android constraintLayout 失去了它的底行 textviews？答案

【问题标题】：Why is my android constraintLayout losing its bottom row of textviews?为什么我的 android constraintLayout 失去了它的底行 textviews？
【发布时间】：2017-06-26 07:06:00
【问题描述】：

我正在尝试将此布局用作列表视图中的标题，但内部约束布局下方的文本视图的底行不可见 - 就像它的高度已折叠为零。
在 xml 中，内部约束布局声明下方有一条红线，并带有弹出消息“此视图不受垂直约束：在运行时它将跳转到左侧，除非您添加垂直约束......”（跳转到左侧？这甚至有意义吗？）并且我尝试添加像

这样的垂直约束

app:layout_constraintTop_toTopOf="parent" app:layout_constraintBottom_toBottomOf="parent"

但是发生的情况是整个布局失去了它的高度。

当设计编辑器在没有询问或警告我的情况下更改我的 xml 时，我也感到非常困惑。似乎很喜欢将 layout_width 和 height 元素设置为“0dp”，并将指南宽度和高度设置为

android:layout_width="wrap_content" android:layout_height="wrap_content"。

当唯一的元素是 textviews 的底行时，我没有设置 layout_width 和 layout_height，因为约束似乎可以完成工作。但是现在我已经添加了顶部“leaderinfo”，设计师将它们添加为“0dp”。我知道我可以将它们重置为“wrap_content”，然后 textviews 会重新出现，但为什么有必要这样做 - 设计师不是有充分的理由将它们设置为“0dp”吗？

感谢您的帮助！

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

android:background="@color/listheaderbg"
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.constraint.ConstraintLayout
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:id="@+id/leaderinfo"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    android:background="@color/subsection1background"
    tools:layout_editor_absoluteY="0dp"
    tools:layout_editor_absoluteX="8dp">

    <ImageView
        android:layout_width="120dp"
        android:layout_height="120dp"
        app:layout_constraintStart_toStartOf="@+id/guideline01"
        android:id="@+id/iv_profilepic"
        android:src="@drawable/ic_flag"
        app:layout_constraintTop_toTopOf="parent"
        android:layout_marginTop="2dp"
        tools:layout_editor_absoluteX="21dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        style="@style/MyTextView.thin"
        android:id="@+id/tv_username"
        tools:text="@string/username"
        android:paddingStart="10dp"
        android:paddingLeft="10dp"
        android:layout_marginTop="10dp"
        app:layout_constraintStart_toEndOf="@+id/iv_profilepic"
        app:layout_constraintTop_toTopOf="@+id/iv_profilepic"
        tools:layout_editor_absoluteX="150dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        style="@style/MyTextView.thin"
        android:id="@+id/tv_firstname"
        tools:text="@string/first_name"
        android:paddingStart="10dp"
        android:paddingLeft="10dp"
        android:layout_marginTop="5dp"
        app:layout_constraintStart_toEndOf="@+id/iv_profilepic"
        app:layout_constraintTop_toBottomOf="@+id/tv_username"
        tools:layout_editor_absoluteX="150dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        style="@style/MyTextView.thin"
        android:id="@+id/tv_lastname"
        tools:text="@string/last_name"
        android:paddingStart="10dp"
        android:paddingLeft="10dp"
        android:layout_marginTop="5dp"
        app:layout_constraintStart_toEndOf="@+id/iv_profilepic"
        app:layout_constraintTop_toBottomOf="@+id/tv_firstname"
        tools:layout_editor_absoluteX="150dp" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/floatingActionButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:elevation="0dp"
        app:elevation="0dp"
        app:fabSize="mini"
        android:layout_marginTop="20dp"
        app:layout_constraintEnd_toStartOf="@+id/guideline04"
        app:srcCompat="@android:drawable/ic_input_add"
        app:layout_constraintTop_toTopOf="parent"
        android:tint="#FFFFFF"
        app:backgroundTint="@color/submitbuttoncolor_hotpink"
        tools:layout_editor_absoluteX="351dp" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toStartOf="@+id/guideline01"
        android:id="@+id/iv_weight"
        android:src="@drawable/ic_scale"
        android:layout_marginTop="10dp"

        app:layout_constraintTop_toBottomOf="@+id/iv_profilepic"
        android:tint="@color/tealicon"
        tools:layout_editor_absoluteX="21dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        style="@style/MyTextView.thin"
        android:id="@+id/tv_weight"
        tools:text="@string/_225"
        android:padding="5dp"
        app:layout_constraintStart_toEndOf="@+id/iv_weight"
        app:layout_constraintTop_toTopOf="@+id/iv_weight"
        app:layout_constraintBottom_toBottomOf="@+id/iv_weight"
        tools:layout_editor_absoluteX="62dp" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toEndOf="@+id/guideline02"
        android:id="@+id/iv_height"
        android:src="@drawable/ic_height"
        app:layout_constraintTop_toTopOf="@+id/iv_weight"
        android:tint="@color/tealicon"
        tools:layout_editor_absoluteX="206dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        style="@style/MyTextView.thin"
        android:id="@+id/tv_height"
        tools:text="@string/_0_0"

        app:layout_constraintStart_toEndOf="@+id/iv_height"
        app:layout_constraintTop_toTopOf="@+id/iv_height"
        android:padding="5dp"
        app:layout_constraintBottom_toBottomOf="@+id/iv_height"
        tools:layout_editor_absoluteX="248dp" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toStartOf="@+id/guideline01"
        android:id="@+id/iv_age"
        android:src="@drawable/ic_age"
        app:layout_constraintTop_toBottomOf="@+id/tv_weight"
        android:layout_marginTop="10dp"
        android:tint="@color/tealicon"
        tools:layout_editor_absoluteX="21dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        style="@style/MyTextView.thin"
        android:id="@+id/tv_age"
        tools:text="23"
        app:layout_constraintStart_toEndOf="@+id/iv_age"
        app:layout_constraintTop_toTopOf="@+id/iv_age"
        android:padding="5dp"
        app:layout_constraintBottom_toBottomOf="@+id/iv_age"
        tools:layout_editor_absoluteX="62dp" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toStartOf="@+id/guideline02"
        android:id="@+id/iv_country"
        android:src="@drawable/ic_flag"
        app:layout_constraintTop_toTopOf="@+id/iv_age"
        android:tint="@color/tealicon"
        tools:layout_editor_absoluteX="206dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        style="@style/MyTextView.thin"
        android:id="@+id/tv_country"
        tools:text="CA"
        app:layout_constraintStart_toEndOf="@+id/iv_country"
        app:layout_constraintTop_toTopOf="@+id/iv_country"
        android:padding="5dp"
        app:layout_constraintBottom_toBottomOf="@+id/iv_country"
        tools:layout_editor_absoluteX="248dp" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/iv_followers"
        android:src="@drawable/ic_followers"
        app:layout_constraintStart_toStartOf="@+id/guideline01"
        app:layout_constraintTop_toBottomOf="@+id/tv_age"
        android:layout_marginTop="10dp"
        android:tint="@color/tealicon"
        tools:layout_editor_absoluteX="21dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        style="@style/MyTextView.thin"
        android:id="@+id/tv_followers"
        tools:text="223"
        app:layout_constraintStart_toEndOf="@+id/iv_followers"
        app:layout_constraintTop_toTopOf="@+id/iv_followers"
        android:padding="5dp"
        app:layout_constraintBottom_toBottomOf="@+id/iv_followers"
        tools:layout_editor_absoluteX="62dp" />



    <android.support.constraint.Guideline
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/guideline01"
        app:layout_constraintGuide_percent="0.05"
        android:orientation="vertical"
        tools:layout_editor_absoluteY="81dp"
        tools:layout_editor_absoluteX="21dp" />

    <android.support.constraint.Guideline
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/guideline02"
        app:layout_constraintGuide_percent="0.5"
        android:orientation="vertical"
        tools:layout_editor_absoluteY="81dp"
        tools:layout_editor_absoluteX="206dp" />

    <android.support.constraint.Guideline
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/guideline03"
        app:layout_constraintGuide_percent="0.69"
        android:orientation="vertical"
        tools:layout_editor_absoluteY="81dp"
        tools:layout_editor_absoluteX="284dp" />

    <android.support.constraint.Guideline
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/guideline04"
        app:layout_constraintGuide_percent="0.95"
        android:orientation="vertical"
        tools:layout_editor_absoluteY="81dp"
        tools:layout_editor_absoluteX="391dp" />

</android.support.constraint.ConstraintLayout>

<TextView
    android:id="@+id/text1"
    style="@style/MyTextView"
    android:gravity="center"
    android:text="@string/exercise"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintEnd_toStartOf="@+id/guideline1"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/leaderinfo"
    android:layout_marginBottom="2dp"
    android:layout_marginTop="2dp"
    android:background="@color/listheaderbg"
    android:layout_height="0dp"
    android:layout_width="0dp" />

<TextView
    style="@style/MyTextView"
    app:layout_constraintStart_toEndOf="@+id/guideline1"
    app:layout_constraintEnd_toStartOf="@+id/guideline2"
    android:gravity="center"
    android:text="@string/rm1"
    android:id="@+id/text2"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/leaderinfo"
    android:layout_marginBottom="2dp"
    android:layout_marginTop="2dp"
    android:background="@color/listheaderbg"
    android:layout_height="0dp"
    android:layout_width="0dp"
    tools:layout_editor_absoluteX="213dp" />

<TextView
    style="@style/MyTextView"
    app:layout_constraintStart_toEndOf="@+id/guideline2"
    app:layout_constraintEnd_toEndOf="parent"
    android:gravity="center"
    android:text="@string/rm1bw"
    android:id="@+id/text3"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/leaderinfo"
    android:layout_marginBottom="2dp"
    android:layout_marginTop="2dp"
    android:background="@color/listheaderbg"
    android:layout_height="0dp"
    android:layout_width="0dp"
    tools:layout_editor_absoluteX="310dp" />

<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_constraintStart_toEndOf="@+id/guideline3"
    app:layout_constraintEnd_toEndOf="parent"
    android:id="@+id/iv_rank"
    android:src="@drawable/ic_rank"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/leaderinfo"
    android:visibility="gone"
    android:background="@color/listheaderbg"
    tools:layout_editor_absoluteX="376dp" />

<android.support.constraint.Guideline
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/guideline1"
    app:layout_constraintGuide_percent="0.44"
    android:orientation="vertical"
    tools:layout_editor_absoluteY="0dp"
    tools:layout_editor_absoluteX="181dp" />

<android.support.constraint.Guideline
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/guideline2"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.71"
    tools:layout_editor_absoluteY="0dp"
    tools:layout_editor_absoluteX="292dp" />

<android.support.constraint.Guideline
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/guideline3"
    app:layout_constraintGuide_percent="0.83"
    android:orientation="vertical"
    tools:layout_editor_absoluteY="0dp"
    tools:layout_editor_absoluteX="341dp" />

【问题讨论】：

标签： android listview android-constraintlayout

【解决方案1】：

关于内部布局需要垂直约束的第一个问题，您只需像这样约束顶部：

app:layout_constraintTop_toTopOf="parent"

底部不需要约束，因为高度是wrap_content。

关于底部文本视图，你的外部约束布局为wrap_content，所以如果文本视图的高度也为wrap_content，那么布局可以确定外部容器的适当大小，即高度内部约束布局的 + 文本视图的高度。

但是如果文本视图设置为0dp，这意味着匹配约束，那么存在无法解析的依赖关系。换句话说，文本视图的高度大小取决于外部约束布局（匹配约束）的大小，但外部约束布局的大小取决于其内容的大小，其中包括文本视图的高度，但在不知道其容器大小的情况下无法确定。不可能两者兼而有之，因此设计师试图通过进行您提到的更改来帮助您摆脱这种困境。

底线是只限制内部布局的顶部并为文本视图指定高度大小。如果您进行了这些更改，那么它应该可以工作。

【讨论】：

这是有道理的，但是当我在底部文本视图中将 layout_height 设置为 wrap_content 时，它可以工作，但我提到的 constraintLayout 声明下的红线仍然存在。此外，最初将 layout_height 设置为 0dp 的是设计师，而不是我。即便如此，当我运行该应用程序时，它仍然有效。
@lostbaby 如果将 ConstraintLayout 的顶部约束到父级的顶部，红线将消失。它在您运行应用程序时起作用，因为默认的无约束位置位于 (0,0)，这与将顶部约束设置为父级顶部相同。至于设计师在你的文本视图上将高度更改为 0dp，它仍然很新，所以可能需要解决一些错误。
好的，添加回来，可怕的红线消失了。谢谢。