java - 约束布局 : Why does the height of a view affect its children?

Question

我正在 Android Studio 中构建一个应用程序，但遇到了问题，我不知道为什么会发生这种情况以及如何解决它。这是我的代码:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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="match_parent"

android:background="#f4f4f4"
tools:context=".MainActivity">

<TextView
android:id="@+id/textView"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="144dp"
android:gravity="center"
android:shadowColor="#000000"
android:text="@string/title"
android:textColor="#eadca6"
android:textSize="60sp"
android:textStyle="bold"
app:layout_constraintBottom_toTopOf="@+id/button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.500"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />

<Button
android:id="@+id/button"
android:layout_width="342dp"
android:layout_height="0dp"
android:layout_marginStart="160dp"
android:layout_marginLeft="160dp"
android:layout_marginTop="260dp"
android:layout_marginEnd="160dp"
android:layout_marginRight="160dp"
android:background="#eadca6"
android:text="@string/all_quotes"
android:textAllCaps="false"
android:textSize="20sp"
app:layout_constraintBottom_toTopOf="@+id/button2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.500"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/textView" />

<Button
android:id="@+id/button2"
android:layout_width="342dp"
android:layout_height="0dp"
android:layout_marginStart="160dp"
android:layout_marginLeft="160dp"
android:layout_marginTop="20dp"
android:layout_marginEnd="160dp"
android:layout_marginRight="160dp"
android:layout_marginBottom="50dp"
android:background="#eadca6"
android:text="@string/favorite_quotes"
android:textAllCaps="false"
android:textSize="20sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.500"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/button" />
</androidx.constraintlayout.widget.ConstraintLayout>

但是，如果您运行这样的代码，标题将被切成两半。但 2 个按钮将具有正常尺寸。如果我在textview上使用wrap_content，TextView将正常显示，但按钮高度也只会与内部文本一样大(就像继承wrap内容)，即使我不在按钮字段中写入wrap_content。 LayoutEditor 告诉我一切都很好，但是当我运行应用程序时，这些设计“错误”就会发生。

Answer 1

我在您的代码中添加了一些修改，并添加了此代码的屏幕截图

<androidx.constraintlayout.widget.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="match_parent"
android:background="#f4f4f4"
tools:context=".MainActivity">

<TextView
    android:id="@+id/textView"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="144dp"
    android:shadowColor="#000000"
    android:text="title"
    android:textAlignment="center"
    android:textColor="#eadca6"
    android:textSize="60sp"
    android:textStyle="bold"
    app:layout_constraintBottom_toTopOf="@+id/button"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.500"
    app:layout_constraintVertical_bias="0.0" />

<Button
    android:id="@+id/button"
    android:layout_width="342dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="260dp"
    android:layout_marginLeft="35dp"
    android:layout_marginRight="35dp"
    android:background="#eadca6"
    android:text="all_quotes"
    android:textAllCaps="false"
    android:textSize="20sp"
    app:layout_constraintBottom_toTopOf="@+id/button2"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/textView" />

<Button
    android:id="@+id/button2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="10dp"
    android:paddingBottom="10dp"
    android:layout_marginTop="23dp"
    android:layout_marginBottom="50dp"
    android:layout_marginLeft="35dp"
    android:layout_marginRight="35dp"
    android:background="#eadca6"
    android:text="favqussdi"
    android:textAllCaps="false"
    android:textSize="20sp"
    app:layout_constraintTop_toBottomOf="@+id/button"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent" />

如您所见，我更改了以下内容:

1. android:layout_height 将值更改为wrap_content;
2. android:layout_width 将值更改为match_parent;
3. 在按钮中添加了 android:paddingTop="10dp" 和 android:paddingBottom="10dp"；
4. 修改layout_marginLeft和layout_marginRight；

去掉一些多余的代码，并尽可能避免添加静态号码。希望我能帮到你一点点的帮助^^