Android ScrollView dissapearing the rest of my UI

Issue

I'm new to Android layout design. My problem is that when trying to add a ScrollView to my layout it disappears the rest of my UI. In the following code, when I uncomment the ScrollView, it happens the aforementioned problem.

<?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"
    tools:context=".activity.SettingActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <androidx.appcompat.widget.Toolbar
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?attr/colorPrimary"
            android:minHeight="?attr/actionBarSize"
            android:theme="?attr/actionBarTheme"
            app:title="Toolbar Title" />
    </LinearLayout>

    <!--    <ScrollView-->
    <!--        android:layout_width="match_parent"-->
    <!--        android:layout_height="match_parent">-->

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginStart="10dp"
        android:layout_marginTop="70dp"
        android:layout_marginEnd="10dp"
        android:layout_marginBottom="1dp"
        android:orientation="vertical"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Option 1"
            android:textAlignment="center"
            android:textSize="15sp"
            android:textStyle="bold" />

        <RadioGroup
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <RadioButton
                android:layout_width="193dp"
                android:layout_height="48dp"
                android:text="Radio 1" />

            <RadioButton
                android:layout_width="match_parent"
                android:layout_height="48dp"
                android:text="Radio 2" />
        </RadioGroup>

        <View style="@style/Divider" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Option 2"
            android:textAlignment="center"
            android:textSize="15sp"
            android:textStyle="bold" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Option 2 Description"
            android:textAlignment="center" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="Sub-option 2.1"
                android:textStyle="bold" />

            <EditText
                android:layout_width="135dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:autofillHints="no"
                android:ems="10"
                android:inputType="numberSigned"
                android:minHeight="48dp"
                android:text="2"
                android:textAlignment="center"
                tools:ignore="LabelFor" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="Sub-option 2.2"
                android:textStyle="bold" />

            <EditText
                android:layout_width="135dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:autofillHints="no"
                android:ems="10"
                android:inputType="numberSigned"
                android:minHeight="48dp"
                android:text="3"
                android:textAlignment="center"
                tools:ignore="LabelFor" />

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="Sub-option 2.3"
                android:textStyle="bold" />


            <EditText
                android:layout_width="135dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:autofillHints="no"
                android:ems="10"
                android:inputType="numberSigned"
                android:minHeight="48dp"
                android:text="2"
                android:textAlignment="center"
                tools:ignore="LabelFor" />

        </LinearLayout>

        <View style="@style/Divider" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Option 3"
            android:textAlignment="center"
            android:textSize="15sp"
            android:textStyle="bold" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Option 3.1"
            android:textStyle="bold" />

        <Spinner
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:minHeight="48dp"
            tools:ignore="DuplicateSpeakableTextCheck" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Option 3.2"
            android:textStyle="bold" />

        <Spinner
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:minHeight="48dp" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Option 3.3"
            android:textStyle="bold" />

        <Spinner
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:minHeight="48dp" />

        <View style="@style/Divider" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Option 4"
            android:textAlignment="center"
            android:textSize="15sp"
            android:textStyle="bold" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <androidx.appcompat.widget.SwitchCompat
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:minHeight="48dp"
                android:text="Option 4.1" />


            <androidx.appcompat.widget.SwitchCompat
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:minHeight="48dp"
                android:text="txt_option_4_2" />

            <androidx.appcompat.widget.SwitchCompat
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:minHeight="48dp"
                android:text="txt_option_4_3" />
        </LinearLayout>

    </LinearLayout>

    <!--    </ScrollView>-->

</androidx.constraintlayout.widget.ConstraintLayout>

How can I add properly a ScrollView to my UI? I also feel like I could make my code much better, so I'm open to any suggestion related to it.

Note: I have omitted ids and hardcoded strings rather than using @string resource here.

Solution

Instead of giving margins and constraints to the LinearLayout, move them to ScrollView like this:

<ScrollView
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_marginStart="10dp"
    android:layout_marginTop="70dp"
    android:layout_marginEnd="10dp"
    android:layout_marginBottom="1dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

    <!-- Rest of the code -->

    </LinearLayout>

</ScrollView>

and change LinearLayout width and height to match_parent and wrap_content respectively. ScrollView can only have one child. Although, that's not a problem in your case but just wanna mention it out.

Answered By - UndefinedBug1.0