Схема ограничения - Как НЕ использовать цепочки для соединения всех видов

Question

Я новичок в Android Studio. Я только что создал простой проект, используя макет ограничения для дизайна.

Тем не менее, я использую цепочки, чтобы соединить все виды вместе, и это выглядит очень странно для меня, но я не знаю, как использовать другие функции, такие как направляющие и т.д., для соединения видов. Я уже прочитал Официальную страницу Android или другие страницы в Интернете, чтобы попытаться понять концепцию каждой функции, но я не знаю, как использовать их на практике.

Буду очень признателен, если кто-нибудь может внести изменения в коды в файле activity_main.xml, используя профессиональный код проектирования вместо простого использования цепочек для соединения всех представлений от начала до конца.

Большое спасибо !!!!

Вот мой код: https://github.com/marco-c1/PlanetEarthQuiz

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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/scrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <Button
        android:id="@+id/button4"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:onClick="submit"
        android:text="@string/submit"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="@+id/question10Spinner"
        app:layout_constraintStart_toStartOf="@+id/editText_Question10" />

    <EditText
        android:id="@+id/name"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginRight="8dp"
        android:ems="10"
        android:hint="@string/name"
        android:inputType="textPersonName"
        app:layout_constraintBottom_toTopOf="@+id/earth_photo"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <ImageView
        android:id="@+id/earth_photo"
        android:layout_width="0dp"
        android:layout_height="173dp"
        android:layout_marginTop="16dp"
        android:scaleType="centerInside"
        app:layout_constraintBottom_toTopOf="@+id/question1"
        app:layout_constraintEnd_toEndOf="@+id/name"
        app:layout_constraintStart_toStartOf="@+id/name"
        app:layout_constraintTop_toBottomOf="@+id/name"
        app:srcCompat="@drawable/earth_photo" />

    <TextView
        android:id="@+id/question1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/question1"
        android:textSize="18sp"
        app:layout_constraintBottom_toTopOf="@+id/question1RadioButton"
        app:layout_constraintEnd_toEndOf="@+id/earth_photo"
        app:layout_constraintStart_toStartOf="@+id/earth_photo"
        app:layout_constraintTop_toBottomOf="@+id/earth_photo"
        android:textColor="#0D47A1"/>

    <RadioGroup
        android:id="@+id/question1RadioButton"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:orientation="horizontal"
        app:layout_constraintBottom_toTopOf="@+id/question2"
        app:layout_constraintEnd_toEndOf="@+id/question1"
        app:layout_constraintStart_toStartOf="@+id/question1"
        app:layout_constraintTop_toBottomOf="@+id/question1">

        <RadioButton
            android:id="@+id/yes_Q1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/yes"
            tools:layout_editor_absoluteX="35dp"
            tools:layout_editor_absoluteY="702dp" />

        <RadioButton
            android:id="@+id/no_Q1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/no" />
    </RadioGroup>

    <TextView
        android:id="@+id/question2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/question2"
        android:textColor="#0D47A1"
        android:textSize="18sp"
        app:layout_constraintBottom_toTopOf="@+id/question2RadioButton"
        app:layout_constraintEnd_toEndOf="@+id/question1RadioButton"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/question1RadioButton"
        app:layout_constraintTop_toBottomOf="@+id/question1RadioButton" />

    <RadioGroup
        android:id="@+id/question2RadioButton"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:orientation="horizontal"
        app:layout_constraintBottom_toTopOf="@+id/question3"
        app:layout_constraintEnd_toEndOf="@+id/question2"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/question2"
        app:layout_constraintTop_toBottomOf="@+id/question2">

        <RadioButton
            android:id="@+id/yes_Q2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="@string/yes" />

        <RadioButton
            android:id="@+id/no_Q2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="@string/no"
            tools:layout_editor_absoluteX="249dp"
            tools:layout_editor_absoluteY="530dp" />

    </RadioGroup>

    <TextView
        android:id="@+id/question3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/question3"
        android:textColor="#0D47A1"
        android:textSize="18sp"
        app:layout_constraintBottom_toTopOf="@+id/question3RadioButton"
        app:layout_constraintEnd_toEndOf="@+id/question2RadioButton"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/question2RadioButton"
        app:layout_constraintTop_toBottomOf="@+id/question2RadioButton" />

    <RadioGroup
        android:id="@+id/question3RadioButton"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:orientation="horizontal"
        app:layout_constraintBottom_toTopOf="@+id/question4"
        app:layout_constraintEnd_toEndOf="@+id/question3"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/question3"
        app:layout_constraintTop_toBottomOf="@+id/question3">

        <RadioButton
            android:id="@+id/yes_Q3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/yes" />

        <RadioButton
            android:id="@+id/no_Q3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/no" />
    </RadioGroup>

    <TextView
        android:id="@+id/question4"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/question4"
        android:textColor="#0D47A1"
        android:textSize="18sp"
        app:layout_constraintBottom_toTopOf="@+id/editText_Question4"
        app:layout_constraintEnd_toEndOf="@+id/question3RadioButton"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/question3RadioButton"
        app:layout_constraintTop_toBottomOf="@+id/question3RadioButton" />

    <EditText
        android:id="@+id/editText_Question4"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:ems="10"
        android:hint="@string/hintForAnswer"
        android:inputType="textShortMessage"
        android:singleLine="false"
        app:layout_constraintBottom_toTopOf="@+id/question5"
        app:layout_constraintEnd_toEndOf="@+id/question4"
        app:layout_constraintStart_toStartOf="@+id/question4"
        app:layout_constraintTop_toBottomOf="@+id/question4" />

    <TextView
        android:id="@+id/question5"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/question5"
        android:textColor="#0D47A1"
        android:textSize="18sp"
        app:layout_constraintBottom_toTopOf="@+id/editText_Question5"
        app:layout_constraintEnd_toEndOf="@+id/editText_Question4"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/editText_Question4"
        app:layout_constraintTop_toBottomOf="@+id/editText_Question4" />

    <EditText
        android:id="@+id/editText_Question5"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:hint="@string/hintForAnswer"
        android:inputType="textShortMessage"
        android:textSize="18sp"
        app:layout_constraintBottom_toTopOf="@+id/Question6"
        app:layout_constraintEnd_toEndOf="@+id/question5"
        app:layout_constraintStart_toStartOf="@+id/question5"
        app:layout_constraintTop_toBottomOf="@+id/question5" />

    <TextView
        android:id="@+id/Question6"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/question6"
        android:textColor="#0D47A1"
        android:textSize="18sp"
        app:layout_constraintBottom_toTopOf="@+id/question6RadioGroup"
        app:layout_constraintEnd_toEndOf="@+id/editText_Question5"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/editText_Question5"
        app:layout_constraintTop_toBottomOf="@+id/editText_Question5" />

    <RadioGroup
        android:id="@+id/question6RadioGroup"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:layout_weight="1"
        android:orientation="horizontal"
        app:layout_constraintBottom_toTopOf="@+id/question7"
        app:layout_constraintEnd_toEndOf="@+id/Question6"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/Question6"
        app:layout_constraintTop_toBottomOf="@+id/Question6">

        <RadioButton
            android:id="@+id/radioButton4"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="@string/question6RadioButton"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/earth_photo" />

        <RadioButton
            android:id="@+id/radioButton3"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="@string/question6SecondRadioButton" />

        <RadioButton
            android:id="@+id/radioButton2"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="@string/question6ThirdRadioButton"
            app:layout_constraintEnd_toStartOf="@+id/radioButton1"
            app:layout_constraintTop_toBottomOf="@+id/earth_photo" />

        <RadioButton
            android:id="@+id/radioButton1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginStart="8dp"
            android:layout_marginLeft="8dp"
            android:layout_weight="1"
            android:text="@string/question6FourthRadioButton"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/earth_photo" />
    </RadioGroup>

    <TextView
        android:id="@+id/question7"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/question7"
        android:textColor="#0D47A1"
        android:textSize="18sp"
        app:layout_constraintBottom_toTopOf="@+id/question7Spinner"
        app:layout_constraintEnd_toEndOf="@+id/question6RadioGroup"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/question6RadioGroup"
        app:layout_constraintTop_toBottomOf="@+id/question6RadioGroup" />

    <Spinner
        android:id="@+id/question7Spinner"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:dropDownWidth="wrap_content"
        android:spinnerMode="dropdown"
        app:layout_constraintBottom_toTopOf="@+id/question8"
        app:layout_constraintEnd_toEndOf="@+id/question7"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/question7"
        app:layout_constraintTop_toBottomOf="@+id/question7" />

    <TextView
        android:id="@+id/question8"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/question8"
        android:textColor="#0D47A1"
        android:textSize="18sp"
        app:layout_constraintBottom_toTopOf="@+id/question8Hint"
        app:layout_constraintEnd_toEndOf="@+id/question7Spinner"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/question7Spinner"
        app:layout_constraintTop_toBottomOf="@+id/question7Spinner" />

    <TextView
        android:id="@+id/question8Hint"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:text="@string/hintForQuestion8"
        android:textColor="#0D47A1"
        app:layout_constraintBottom_toTopOf="@+id/water"
        app:layout_constraintEnd_toEndOf="@+id/question8"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/question8"
        app:layout_constraintTop_toBottomOf="@+id/question8" />

    <CheckBox
        android:id="@+id/oxygen"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/oxygen"
        app:layout_constraintBaseline_toBaselineOf="@+id/fire"
        app:layout_constraintEnd_toStartOf="@+id/fire"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toStartOf="@+id/question8Hint" />

    <CheckBox
        android:id="@+id/fire"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/fire"
        app:layout_constraintBaseline_toBaselineOf="@+id/water"
        app:layout_constraintEnd_toStartOf="@+id/water"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/oxygen" />

    <CheckBox
        android:id="@+id/water"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/water"
        app:layout_constraintBottom_toTopOf="@+id/question9"
        app:layout_constraintEnd_toStartOf="@+id/sunlight"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/fire"
        app:layout_constraintTop_toBottomOf="@+id/question8Hint" />

    <CheckBox
        android:id="@+id/sunlight"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/sunlight"
        app:layout_constraintBaseline_toBaselineOf="@+id/water"
        app:layout_constraintEnd_toEndOf="@+id/question8Hint"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/water" />

    <TextView
        android:id="@+id/question9"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/question9"
        android:textColor="#0D47A1"
        android:textSize="18sp"
        app:layout_constraintBottom_toTopOf="@+id/iron"
        app:layout_constraintStart_toStartOf="@+id/oxygen"
        app:layout_constraintTop_toBottomOf="@+id/oxygen" />

    <CheckBox
        android:id="@+id/francium"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/francium"
        app:layout_constraintBaseline_toBaselineOf="@+id/checkBox5"
        app:layout_constraintEnd_toStartOf="@+id/checkBox5"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintStart_toStartOf="@+id/question9" />

    <CheckBox
        android:id="@+id/checkBox5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/oxygen"
        app:layout_constraintBaseline_toBaselineOf="@+id/iron"
        app:layout_constraintEnd_toStartOf="@+id/iron"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/francium" />

    <CheckBox
        android:id="@+id/iron"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:text="@string/iron"
        app:layout_constraintEnd_toStartOf="@+id/silicon"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/checkBox5"
        app:layout_constraintTop_toBottomOf="@+id/question9" />

    <CheckBox
        android:id="@+id/silicon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/silicon"
        app:layout_constraintBaseline_toBaselineOf="@+id/iron"
        app:layout_constraintEnd_toEndOf="@+id/sunlight"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/iron" />

    <TextView
        android:id="@+id/question10"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:text="@string/question10"
        android:textColor="#0D47A1"
        android:textSize="18sp"
        app:layout_constraintBottom_toTopOf="@+id/editText_Question10"
        app:layout_constraintEnd_toEndOf="@+id/silicon"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="@+id/francium"
        app:layout_constraintTop_toBottomOf="@+id/checkBox5"
        app:layout_constraintVertical_chainStyle="packed" />

    <EditText
        android:id="@+id/editText_Question10"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:layout_marginBottom="64dp"
        android:ems="10"
        android:hint="@string/hintForQuestion10"
        android:inputType="number"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/question10Spinner"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_chainStyle="spread_inside"
        app:layout_constraintHorizontal_weight="1"
        app:layout_constraintStart_toStartOf="@+id/question10"
        app:layout_constraintTop_toBottomOf="@+id/question10" />

    <Spinner
        android:id="@+id/question10Spinner"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:dropDownWidth="wrap_content"
        android:spinnerMode="dropdown"
        app:layout_constraintBottom_toBottomOf="@+id/editText_Question10"
        app:layout_constraintEnd_toEndOf="@+id/question10"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_weight="1.1"
        app:layout_constraintStart_toEndOf="@+id/editText_Question10"
        app:layout_constraintTop_toTopOf="@+id/editText_Question10" />

</android.support.constraint.ConstraintLayout>
</ScrollView>

Answer 1

Оформить заказ SequenceLayout . Это очень легко понять и дает вам больше контроля над макетом, чем ConstraintLayout.

Answer 2

Все представления в вашем XML просто один под другим, поэтому вы можете использовать LinearLayout вместо ConstraintLayout.

заменить эту часть

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
             <!-- views-->
</android.support.constraint.ConstraintLayout>

с

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
             <!-- views-->
</LinearLayout>

затем удалите все атрибуты макета ограничения (app:layout_constraintXXXXXXXXXXXX). и замените каждый android:layout_width="0dp" на android:layout_width="match_parent".