Android : adjustResize overlaps the views below the editText

Question

I have a constraint layout as below:

<?xml version="1.0" encoding="utf-8"?>
<layout 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">

    <androidx.constraintlayout.widget.ConstraintLayout
        style="@style/LoginScreenBg"
        android:fitsSystemWindows="true"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ScrollView
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:fillViewport="true"
            android:scrollbars="none"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintTop_toTopOf="parent">

            <androidx.constraintlayout.widget.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">


           <androidx.appcompat.widget.AppCompatImageView
            android:id="@+id/imageIcon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="-100dp"
            android:contentDescription="@null"
            android:src="@drawable/ic_icon"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintBottom_toTopOf="@id/dm_title"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/dm_title"
            style="@style/titlesp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="60dp"
            app:layout_constraintBottom_toTopOf="@id/username_input_layout"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent" />

            <EditText
                android:id="@+id/username_input_layout"
                style="@style/CreateAccountEditTextHint"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="@string/EMAIL_HINT_TEXT"
                android:inputType="textEmailAddress"
        app:layout_constraintBottom_toTopOf="@id/password_input_layout"
                app:layout_constraintLeft_toLeftOf="parent"/>


            <EditText
                android:id="@+id/password_input_layout"
                style="@style/CreateAccountEditTextHint"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="@string/PASSWORD_HINT_TEXT"
                android:inputType="textPassword"
                android:maxLength="20"
        app:layout_constraintBottom_toTopOf="@id/btn_login"
                app:layout_constraintLeft_toLeftOf="parent" />

        <androidx.appcompat.widget.AppCompatButton
            android:id="@+id/btn_login"
            style="@style/LoginButton"
            android:layout_width="match_parent"
            android:layout_height="@dimen/generic_button_height"
            android:layout_marginStart="@dimen/dp_16"
            android:layout_marginEnd="@dimen/dp_16"
            android:layout_marginBottom="@dimen/dp_24"
            android:background="@color/login_button_color"
            app:layout_constraintBottom_toTopOf="@+id/btn_forgot_username_password" />

        <Button
            android:id="@+id/btn_forgot_username_password"
            style="@style/ForgotButton"
            android:layout_width="wrap_content"
            android:layout_height="@dimen/generic_button_height"
            android:layout_marginBottom="@dimen/dp_24"
            android:text="@string/FORGOT_USERNAME_PASSWORD_BUTTON"
            app:layout_constraintBottom_toTopOf="@+id/btn_create_account"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent" />

        <Button
            android:id="@+id/btn_create_account"
            style="@style/CreateAccountButton"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginStart="@dimen/dp_16"
            android:layout_marginEnd="@dimen/dp_16"
            android:layout_marginBottom="@dimen/dp_24"
            android:text="@string/SCREEN_LOGIN_CREATE_ACCOUNT"
            app:layout_constraintBottom_toBottomOf="parent"
            app:uidComponentType="Secondary" />
        <ProgressBar
            android:id="@+id/progress_circular"
            android:visibility="gone"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
            </androidx.constraintlayout.widget.ConstraintLayout>
        </ScrollView>
    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

Below code is added in the manifest

<activity
            android:name=".ui.Activity"
            android:configChanges="screenSize|orientation|keyboard"
            android:windowSoftInputMode="adjustResize"
            android:exported="true">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

When we use the adjustResize, UI components gets overlapped with each other. If I do not add the adjust resize there are few layouts which over the notification bar on my device. If I add the adjust resize it is distorts the UI. I am using single activity model. So the change in manifest will affect all the screens Could you please let me know how to resolve this

Answer 1

This was happening because the views at the top of the screen are chained to each other but the button at the end is independent and is constrained to the bottom of the screen. When the screen is resized, the elements are not chained to each other and the views are distorted