Question

我使用约束布局已经有一段时间了，但是今天我遇到一个奇怪的问题，尽管父约束布局的宽度和高度为（match-父级），结果在以下

这是布局的XML代码

    <?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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="@color/colorPrimary"
    tools:context=".Setup_SettingsActivity">

    <android.support.design.widget.TextInputLayout
        android:id="@+id/setup_pharmacy_name"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="60dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView5">

        <android.support.design.widget.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/setup_pharmacy_name" />
    </android.support.design.widget.TextInputLayout>

    <TextView
        android:id="@+id/textView5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="68dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:text="@string/setup_welcome"
        android:textColor="@color/common_google_signin_btn_text_dark_default"
        android:textSize="24sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <android.support.design.widget.TextInputLayout
        android:id="@+id/setup_pharmacy_address"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/setup_pharmacy_name">

        <android.support.design.widget.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/setup_pharmacy_address"
            android:inputType="textMultiLine" />
    </android.support.design.widget.TextInputLayout>

    <Button
        android:id="@+id/setup_save_btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="84dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:backgroundTint="@color/colorAccent"
        android:text="@string/setup_save_btn_text"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/setup_has_delivery_switch" />

    <Switch
        android:id="@+id/setup_has_delivery_switch"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginLeft="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:text="@string/setup_has_delivery_switch_text"
        android:textColor="@color/common_google_signin_btn_text_dark_default"
        android:textOff="@string/setup_delivery_switch_off"
        android:textOn="@string/setup_delivery_switch_on"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/divider" />

    <ImageButton
        android:id="@+id/imageButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginTop="36dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:backgroundTint="@color/colorAccent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.476"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/setup_pharmacy_address"
        app:srcCompat="@mipmap/position_btn" />

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="42dp"
        android:layout_height="38dp"
        android:layout_marginStart="20dp"
        android:layout_marginLeft="20dp"
        android:layout_marginTop="52dp"
        android:visibility="invisible"
        app:layout_constraintStart_toEndOf="@+id/imageButton"
        app:layout_constraintTop_toBottomOf="@+id/setup_pharmacy_address"
        app:srcCompat="@mipmap/position_done" />

    <TextView
        android:id="@+id/textView6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="24dp"
        android:layout_marginLeft="24dp"
        android:layout_marginTop="60dp"
        android:layout_marginEnd="12dp"
        android:layout_marginRight="12dp"
        android:text="@string/setup_record_position_text"

        android:textColor="@color/common_google_signin_btn_text_dark_default"
        android:textSize="12sp"
        app:layout_constraintEnd_toStartOf="@+id/imageButton"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/setup_pharmacy_address" />

    <View
        android:id="@+id/divider"
        android:layout_width="0dp"
        android:layout_height="1dp"
        android:layout_marginTop="40dp"
        android:background="@color/divider"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/imageButton" />

    <View
        android:id="@+id/divider2"
        android:layout_width="0dp"
        android:layout_height="1dp"
        android:layout_marginTop="20dp"
        android:background="@color/divider"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/setup_has_delivery_switch" />

</android.support.constraint.ConstraintLayout>

此问题可能是什么原因？

Answer 1

您的布局被下推，因为您使用的边距过大-您正在使用constraintLayout，但边距也使用了较大的固定尺寸（例如android:layout_marginTop="60dp"），并且不同的手机具有不同的屏幕尺寸，当您在视图上使用固定尺寸时，会降低布局的响应速度（可以使用小边距，但问题出在大边距处）。
如果您想在屏幕上的某个地方放置一些视图，我建议您使用guielines并将视图限制在准则中，而不要给视图留很多空白。

您只需使用chains即可获得所需的布局。

以下是您要使用cnostraintLayout和链实现的布局的示例：

<?xml version="1.0" encoding="utf-8"?>
  <android.support.constraint.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.support.design.widget.TextInputLayout
    android:id="@+id/setup_pharmacy_name"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:layout_marginEnd="8dp"
    app:layout_constraintBottom_toTopOf="@+id/setup_pharmacy_address"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/textView5">

    <android.support.design.widget.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="setup_pharmacy_name" />
</android.support.design.widget.TextInputLayout>

<TextView
    android:id="@+id/textView5"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:layout_marginEnd="8dp"
    android:text="setup_welcome"
    android:textColor="@color/common_google_signin_btn_text_dark_default"
    android:textSize="24sp"
    app:layout_constraintBottom_toTopOf="@+id/setup_pharmacy_name"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<android.support.design.widget.TextInputLayout
    android:id="@+id/setup_pharmacy_address"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:layout_marginEnd="8dp"
    app:layout_constraintBottom_toTopOf="@+id/textView6"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/setup_pharmacy_name">

    <android.support.design.widget.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="setup_pharmacy_address"
        android:inputType="textMultiLine" />
</android.support.design.widget.TextInputLayout>

<Button
    android:id="@+id/setup_save_btn"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:layout_marginEnd="8dp"
    android:backgroundTint="@color/colorAccent"
    android:text="setup_save_btn_text"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/divider2" />

<Switch
    android:id="@+id/setup_has_delivery_switch"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:layout_marginEnd="8dp"
    android:text="setup_has_delivery_switch_text"
    android:textColor="@color/common_google_signin_btn_text_dark_default"
    android:textOff="setup_delivery_switch_off"
    android:textOn="setup_delivery_switch_on"
    app:layout_constraintBottom_toTopOf="@+id/divider2"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/divider" />

<ImageButton
    android:id="@+id/imageButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:backgroundTint="@color/colorAccent"
    app:layout_constraintBottom_toBottomOf="@+id/textView6"
    app:layout_constraintEnd_toStartOf="@+id/imageView2"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/textView6"
    app:layout_constraintTop_toTopOf="@+id/textView6"
    app:srcCompat="position_btn" />

<ImageView
    android:id="@+id/imageView2"
    android:layout_width="42dp"
    android:layout_height="38dp"
    android:src="@drawable/new_question"
    android:visibility="invisible"
    app:layout_constraintBottom_toBottomOf="@+id/textView6"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/imageButton"
    app:layout_constraintTop_toTopOf="@+id/textView6" />

<TextView
    android:id="@+id/textView6"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="setup_record_position_text"

    android:textColor="@color/common_google_signin_btn_text_dark_default"
    android:textSize="12sp"
    app:layout_constraintBottom_toTopOf="@+id/divider"
    app:layout_constraintEnd_toStartOf="@+id/imageButton"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/setup_pharmacy_address" />

<View
    android:id="@+id/divider"
    android:layout_width="0dp"
    android:layout_height="1dp"
    android:layout_marginEnd="8dp"
    android:background=""
    app:layout_constraintBottom_toTopOf="@+id/setup_has_delivery_switch"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/textView6" />

<View
    android:id="@+id/divider2"
    android:layout_width="0dp"
    android:layout_height="1dp"
    android:layout_marginEnd="8dp"
    app:layout_constraintBottom_toTopOf="@+id/setup_save_btn"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/setup_has_delivery_switch" />
</android.support.constraint.ConstraintLayout>

它看起来像这样：

Answer 2

这取决于屏幕尺寸。有时候，我们的布局对于中型或大型屏幕尺寸的设备是最佳的，这会导致小型设备出现问题。为了也针对较小的设备解决此问题，请添加ScrollView作为约束布局的父布局

<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
    <android.support.constraint.ConstraintLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content">
....
</android.support.constraint.ConstraintLayout>
</ScrollView>

约束布局在屏幕边缘向下移动

2 个答案: