如何在GUI中添加适当的约束以使布局看起来像设计视图中的布局？

Question

我正在努力使用GUI进行约束布局。我已经看过并完成了教程，但是应用它们却使我陷入困境。有什么建议可以使我的屏幕快照在约束下保持原样吗？

这是我到目前为止通过GUI实现的内容：

<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:id="@+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.udacity.sandwichclub.DetailActivity">


<ImageView
    android:id="@+id/image_iv"
    android:layout_width="0dp"
    android:layout_height="200dp"
    android:layout_marginBottom="8dp"
    android:adjustViewBounds="true"
    android:contentDescription="@string/sandwich_picture_content_description"
    android:scaleType="centerCrop"
    app:layout_constraintBottom_toBottomOf="@+id/description_tv"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.031" />

<TextView
    android:id="@+id/origin_tv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/detail_error_message"
    app:layout_constraintBaseline_toBaselineOf="@+id/origin_label_tv"
    app:layout_constraintEnd_toStartOf="parent"
    app:layout_constraintStart_toStartOf="parent" />

<TextView
    android:id="@+id/origin_label_tv"
    android:layout_width="95dp"
    android:layout_height="22dp"
    android:labelFor="@id/origin_tv"
    android:text="@string/detail_place_of_origin_label"
    android:textStyle="bold"
    tools:layout_editor_absoluteX="8dp"
    tools:layout_editor_absoluteY="304dp" />


<TextView
    android:id="@+id/also_known_tv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/detail_error_message"
    app:layout_constraintBaseline_toBaselineOf="@+id/also_knwon_label_tv"
    app:layout_constraintEnd_toStartOf="parent"
    app:layout_constraintStart_toStartOf="parent" />

<TextView
    android:id="@+id/also_knwon_label_tv"
    android:layout_width="91dp"
    android:layout_height="16dp"
    android:labelFor="@id/also_known_tv"
    android:text="@string/detail_also_known_as_label"
    android:textStyle="bold"
    tools:layout_editor_absoluteX="8dp"
    tools:layout_editor_absoluteY="414dp" />


<TextView
    android:id="@+id/ingredients_tv"
    android:layout_width="395dp"
    android:layout_height="72dp"
    android:text="@string/detail_error_message"
    tools:layout_editor_absoluteX="8dp"
    tools:layout_editor_absoluteY="545dp" />

<TextView
    android:id="@+id/detail_ingredients_label_tv"
    android:layout_width="84dp"
    android:layout_height="18dp"
    android:labelFor="@id/ingredients_tv"
    android:text="@string/detail_ingredients_label"
    android:textStyle="bold"
    tools:layout_editor_absoluteX="8dp"
    tools:layout_editor_absoluteY="519dp" />


<TextView
    android:id="@+id/description_tv"
    android:layout_width="395dp"
    android:layout_height="72dp"
    android:text="@string/detail_error_message"
    tools:layout_editor_absoluteX="8dp"
    tools:layout_editor_absoluteY="651dp" />

<TextView
    android:id="@+id/detail_description_label_tv"
    android:layout_width="85dp"
    android:layout_height="18dp"
    android:labelFor="@id/description_tv"
    android:text="@string/detail_description_label"
    android:textStyle="bold"
    tools:layout_editor_absoluteX="8dp"
    tools:layout_editor_absoluteY="625dp" />