约束布局问题

Question

UI 约束布局在 Android Studio 上显示良好，但在移动设备上构建和测试后变得不规则和分散。当将我的约束布局更改为相对或线性布局时，我的设计完美无缺。那么，如果我们不能在其中正确编码，那么约束布局有什么好处。这是我的代码：

   <?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/background_color"
        android:paddingHorizontal="@dimen/button_horizontal_padding">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="143dp"
            android:layout_marginStart="143dp"
            android:text="@string/booking_done_title"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Title"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            tools:ignore="MissingConstraints"
            tools:layout_editor_absoluteY="56dp" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="@string/booking_done_sub_title"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Small"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            tools:ignore="MissingConstraints"
            tools:layout_editor_absoluteY="95dp" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_booking_done_image"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            tools:ignore="MissingConstraints"
            tools:layout_editor_absoluteY="188dp" />

        <Button
            android:id="@+id/hotelBookNowBtn"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_marginHorizontal="@dimen/button_horizontal_padding"
            android:background="@drawable/green_button_background"
            android:gravity="center"
            android:paddingHorizontal="@dimen/button_horizontal_padding"
            android:text="@string/done"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Medium"
            android:textColor="@color/white"
            android:textStyle="normal"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            tools:ignore="MissingConstraints"
            tools:layout_editor_absoluteY="353dp" />

        <TextView
            android:id="@+id/viewSummaryView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/view_full_summary"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Medium"
            android:textColor="@color/colorPrimary"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.498"
            app:layout_constraintStart_toStartOf="parent"
            tools:ignore="MissingConstraints"
            tools:layout_editor_absoluteY="425dp" />

        <android.support.constraint.Group
            android:id="@+id/group"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />

    </android.support.constraint.ConstraintLayout>

Answer 1

tools 命名空间属性启用仅在布局编辑器中使用的 design-time 功能。 tools:layout_editor_absoluteY 的值在运行时对 View 没有影响。

当 View 缺少适当的约束时，布局编辑器将显示警告。但是，在您的情况下，您通过为 Views 设置 tools:ignore="MissingConstraints" 忽略了这些警告。您只为 Views 设置了水平约束，但缺少垂直约束。

为了在布局编辑器中为 View 设置约束，您需要单击 View 边缘的圆圈并将它们拖向其他 Views 或parent 的边缘。也可以使用适当的属性直接在 XML 中设置约束。完整列表可以在 ConstraintLayout documentation

中找到

Answer 2

我遇到了同样的问题，结果发现你处理的所有视图都必须是约束的。例如，如果你在布局的 bottom/middle 处有一个按钮并且你想留在那个地方你需要对布局的两侧和底部使用约束。 Android工作室给你一个警告。

约束布局问题

Constraint Layout Issues

android

responsive-design

android-constraintlayout