Constraint layout scroll to bottom with keypad open

android, android-constraintlayout, android-layout

Solution

You have to set the `windowSoftInputMode` on your `Activity` on your `Manifest` file.

`android:windowSoftInputMode="stateVisible|adjustResize"`

(or `android:windowSoftInputMode="stateHidden|adjustResize"` if you don't want the keyboard to show when you open the activity)

and make your design of the activity to be like that

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <android.support.v4.widget.NestedScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fillViewport="true">

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

                /* your elements here */

            </android.support.constraint.ConstraintLayout>
        </android.support.v4.widget.NestedScrollView>
    </FrameLayout>

Problem

I am using `ConstraintLayout` to design a sign-up screen. I have put the `ConstraintLayout` inside a scroll view. The user should be able to scroll and view the whole content even when the keypad is open. This feature works when I am using `RelativeLayout` but doesn't work when I am using `ConstraintLayout`. The views which are at the bottom of the screen are being hidden behind the keypad. Following is the layout I am using. ``` <?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:layout_width="match_parent" android:layout_height="match_parent" android:background="#FFFFFF" android:paddingTop="23dp" android:fillViewport="true" tools:context="com.givhero.activities.LoginActivity"> <android.support.constraint.ConstraintLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="bottom" tools:context="com.givhero.activities.LoginActivity"> <ImageView android:id="@+id/back" android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="15dp" android:src="@drawable/back" android:tint="@color/colorPrimary" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" tools:layout_editor_absoluteX="0dp"/> <TextView android:id="@+id/regEmail" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="20dp" android:paddingLeft="10dp" android:text="@string/sign_up_email" android:textColor="@color/colorPrimary" android:textSize="@dimen/titles_lists" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/back" tools:layout_editor_absoluteX="0dp"/> <TextView android:id="@+id/nameEditText" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginEnd="15dp" android:layout_marginLeft="15dp" android:layout_marginRight="15dp" android:layout_marginStart="15dp" android:layout_marginTop="30dp" android:background="@android:color/transparent" android:gravity="left" android:hint="Name" android:textColor="@color/dark" android:textColorHint="@color/dark" android:textSize="@dimen/base" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toBottomOf="@+id/regEmail" /> <View android:id="@+id/nameDivider" android:layout_width="0dp" android:layout_height="1dp" android:layout_marginTop="15dp" android:background="@color/divider" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toBottomOf="@+id/nameEditText" /> <EditText android:id="@+id/emailEditText" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginEnd="15dp" android:layout_marginLeft="15dp" android:layout_marginRight="15dp" android:layout_marginStart="15dp" android:layout_marginTop="30dp" android:background="@android:color/transparent" android:gravity="left" android:hint="Email" android:inputType="textEmailAddress" android:textColor="@color/dark" android:textColorHint="@color/dark" android:textSize="@dimen/base" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toBottomOf="@+id/nameDivider" /> <View android:id="@+id/emailDivider" android:layout_width="0dp" android:layout_height="1dp" android:layout_marginTop="15dp" android:background="@color/divider" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toBottomOf="@+id/emailEditText"/> <Button android:id="@+id/submitButton" android:layout_width="0dp" android:layout_height="62dp" android:layout_marginEnd="15dp" android:layout_marginLeft="15dp" android:layout_marginRight="15dp" android:layout_marginStart="15dp" android:layout_marginTop="30dp" android:background="@drawable/button_theme" android:enabled="false" android:text="@string/sign_up" android:textColor="#FFFFFF" android:textSize="@dimen/base" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toBottomOf="@+id/emailDivider" /> <TextView android:id="@+id/signUpMessage" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_margin="30dp" android:padding="15dp" android:text="@string/sign_up_message" android:textColor="@color/dark80Opacity" android:textSize="@dimen/medium12" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/submitButton" /> </android.support.constraint.ConstraintLayout> </ScrollView> ``` I have added the following in Manifest. ``` <activity android:name=".activities.EmailSignupActivity" android:screenOrientation="portrait" android:windowSoftInputMode="adjustResize"> </activity> ``` Though it doesn't scroll as expected. Following are the screen shots for better understanding As you can see I have some text below the `EditText` fields and signup button. What I am expecting is that the user should be able to scroll to the bottom of the page to see that text even if the keyboard is open. Please check the following screenshot when the keypad is open I am unable to scroll the view when the keyboard is open. EDIT Hey, If anyone is stuck with this issue and landed here for the answer. I could finally find the solution for it. I couldn't figure out the exact reason for this issue but could figure out what is causing the layout not to scroll. Initially, I have been trying to occupy the whole screen including the status bar for design and used the following in oncreate ``` getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN); ``` The above line has caused the issue and once I have removed it, I was able to scroll the layout. I would be happy to find the reason why is the layout not scrolling if we occupy the full screen including the status bar for design.

Original source