androidscrollviewandroid-softkeyboard
Scrollable screen on soft keyboard open, using Constraint layout
How do we make the screen scrollable when the soft keyboard opens up, while using Constraint layout. It can be achieved with flag 'adjustResize' in manifest, while using Linear layout inside Scrollview. But the behaviour is different while using Constraint layout inside Scrollview. How do we achieve the required behaviour while using Constraint layout?
The following images show my screen when the soft Keyboard is not open, and when the keyboard is open.
This is my screen when the soft keyboard is NOT open
This is my screen when the soft keyboard is open
I have been looking for a solution to this since days, but I'm not able to find. Please help!
EDIT:
I have currently modelled my XML as:
<Constraint layout>
<NestedScrollView>
<Constraint layout>
</Constraint layout>
</NestedScrollView>
<Constraint layout>
</Constraint layout>
</Constraint layout>
It's not working.
EDIT 2:
My actual XML is:
<?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:background="@color/dark_blue"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:isScrollContainer="true"
android:fillViewport="true"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toTopOf="@id/clProgressSignUp">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".SignupActivity">
<ImageView
android:id="@+id/ivLogo"
android:layout_width="@dimen/_148sdp"
android:layout_height="@dimen/_60sdp"
android:src="@drawable/logo_voodlee"
app:layout_constraintVertical_bias="0.08"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
/>
<TextView
android:id="@+id/tvName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Name as on Pan Card"
android:visibility="visible"
app:fontFamily="@font/poppins_regular"
android:textColor="@color/fade_green"
android:textSize="@dimen/_11ssp"
app:layout_constraintVertical_bias="0.285"
app:layout_constraintHorizontal_bias="0.135"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"/>
<EditText
android:id="@+id/etName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Name as on Pan Card"
android:gravity="left"
android:inputType="textVisiblePassword"
android:background="@drawable/bg_edittext_thin_line_bright_green"
android:layout_marginLeft="@dimen/_20sdp"
android:layout_marginRight="@dimen/_20sdp"
android:lineSpacingExtra="@dimen/_3sdp"
app:fontFamily="@font/poppins_regular"
android:textColor="@color/bright_green"
android:textColorHint="@color/fade_green"
android:textSize="@dimen/dimen_20dp"
android:importantForAutofill="no"
app:layout_constraintVertical_bias="0.31"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"/>
<TextView
android:id="@+id/tvEmail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Email"
android:visibility="visible"
app:fontFamily="@font/poppins_regular"
android:textColor="@color/fade_green"
android:textSize="@dimen/_11ssp"
app:layout_constraintVertical_bias="0.4"
app:layout_constraintHorizontal_bias="0.091"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"/>
<EditText
android:id="@+id/etEmail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textVisiblePassword"
android:hint="Email"
android:gravity="left"
android:background="@drawable/bg_edittext_thin_line_bright_green"
android:lineSpacingExtra="@dimen/_3sdp"
app:fontFamily="@font/poppins_regular"
android:layout_marginLeft="@dimen/_20sdp"
android:layout_marginRight="@dimen/_20sdp"
android:textColor="@color/bright_green"
android:textColorHint="@color/fade_green"
android:textSize="@dimen/dimen_20dp"
android:importantForAutofill="no"
app:layout_constraintVertical_bias="0.43"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"/>
<TextView
android:id="@+id/tvErrorMsgEmail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="invisible"
android:text="* Please enter valid email address"
android:textSize="@dimen/_10ssp"
android:textColor="@color/voodlee_red"
app:fontFamily="@font/poppins_regular"
android:layout_marginTop="@dimen/_4sdp"
app:layout_constraintHorizontal_bias=".1375"
app:layout_constraintVertical_bias="0.47"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
/>
<TextView
android:id="@+id/tvMob"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Mobile Number"
android:gravity="center_vertical"
android:visibility="visible"
app:fontFamily="@font/poppins_regular"
android:textColor="@color/fade_green"
android:textSize="@dimen/_11ssp"
app:layout_constraintVertical_bias="0.515"
app:layout_constraintHorizontal_bias="0.115"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"/>
<EditText
android:id="@+id/etMob"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="phone"
android:hint="Mobile Number"
android:gravity="left"
android:lineSpacingExtra="@dimen/_3sdp"
android:layout_marginLeft="@dimen/_20sdp"
android:layout_marginRight="@dimen/_20sdp"
android:textColor="@color/bright_green"
android:textColorHint="@color/fade_green"
android:textSize="@dimen/dimen_20dp"
app:fontFamily="@font/poppins_regular"
android:background="@drawable/bg_edittext_thin_line_bright_green"
android:importantForAutofill="no"
app:layout_constraintVertical_bias="0.55"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
/>
<TextView
android:id="@+id/tvErrorMsgMobile"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="invisible"
android:text="* Please enter valid mobile number"
android:textSize="@dimen/_10ssp"
android:textColor="@color/voodlee_red"
app:fontFamily="@font/poppins_regular"
android:layout_marginTop="@dimen/_4sdp"
app:layout_constraintHorizontal_bias=".135"
app:layout_constraintVertical_bias="0.5875"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
/>
<CheckBox
android:id="@+id/cbTnc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:buttonTint="@color/bright_green"
app:layout_constraintHorizontal_bias="0.08"
app:layout_constraintVertical_bias="0.65"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"/>
<TextView
android:id="@+id/tvAgree"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="I agree to the"
android:textSize="@dimen/dimen_14dp"
android:textColor="@color/bright_green"
app:fontFamily="@font/poppins_regular"
app:layout_constraintHorizontal_bias="0.21"
app:layout_constraintVertical_bias="0.65"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
/>
<TextView
android:id="@+id/tvTnc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="terms and conditions"
android:textColor="@color/text_highlight"
android:textSize="@dimen/dimen_14dp"
app:fontFamily="@font/poppins_regular"
app:layout_constraintHorizontal_bias="0.1"
app:layout_constraintVertical_bias="0.65"
app:layout_constraintLeft_toRightOf="@id/tvAgree"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
/>
<Button
android:id="@+id/btnNextSignUp"
android:layout_width="match_parent"
android:layout_height="@dimen/_36sdp"
android:background="@drawable/bg_btn_proceed_enabled"
android:layout_margin="@dimen/_25sdp"
android:text="Proceed"
android:textColor="@color/dark_blue"
android:textAllCaps="false"
android:textSize="@dimen/dimen_20dp"
android:onClick="onClickNext"
android:fontFamily="@font/poppins_semi_bold"
android:foreground="?attr/selectableItemBackground"
app:layout_constraintVertical_bias="0.825"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"/>
<TextView
android:id="@+id/tvAlreadyHave"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/text_highlight"
android:text="Already have an account?"
app:fontFamily="@font/poppins_regular"
android:textSize="@dimen/dimen_15dp"
android:textStyle="bold"
app:layout_constraintVertical_bias="0.87"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.core.widget.NestedScrollView>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/clProgressSignUp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="visible"
app:layout_constraintVertical_bias="0.96"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="parent">
.
.
.
.
.
.
.
.
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Solution
Solved it by removing android: fillViewPort = "true" attribute from NestedScrollview, and adding an empty view at the end of layout like this:
<View
android:id="@+id/view1"
android:layout_width="match_parent"
android:layout_height="@dimen/_20sdp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintTop_toBottomOf="@id/clProgressSignUp"
/>
This made the screen scrollable, and fulfilled the requirement after using the layout as above and using the flag android:windowSoftInputMode="adjustResize" in manifest for the Activity.