Scrolling a layout when the keyboard appears

Question

My screen resizing to top when keyboard appears and hiding toolbar (FrameLayout), i need just scroll chat items to top and hold my frame layout on the top. I try some examples from Google and SO, but nothing helps to me.

<activity
        android:name=".screen.workshiftscreen.WorkShiftActivity"
        android:launchMode="singleTop"
        android:windowSoftInputMode="adjustPan"
        android:screenOrientation="portrait" />

My fragment layout after some edits:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="?attr/bg_second"
    android:orientation="vertical">

    <FrameLayout
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_marginBottom="@dimen/space_large_s"
        android:background="?attr/bg_main"
        android:padding="@dimen/space_small_m">

        <TextView
            *params* />

        <ImageView
            *params* />
    </FrameLayout>

    <android.support.v4.widget.SwipeRefreshLayout
        android:id="@+id/swipe_refresh_chat"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@id/edit_bar"
        android:layout_below="@+id/title">

            <android.support.v7.widget.RecyclerView
                android:id="@+id/messages"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:paddingLeft="@dimen/space_medium_l"
                android:paddingRight="@dimen/space_medium_l"
                android:scrollbars="vertical" />
    </android.support.v4.widget.SwipeRefreshLayout>

    <LinearLayout
        android:id="@+id/edit_bar"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:layout_alignParentBottom="true"
        android:orientation="vertical"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent">

        <View
            *params* />

        <LinearLayout
            *params*>

            <EditText
                android:id="@+id/message_input"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginLeft="16dp"
                android:layout_marginRight="16dp"
                android:layout_weight="1"
                android:background="@android:color/transparent"
                android:hint="@string/prompt_message"
                android:imeActionId="@+id/send"
                android:imeActionLabel="@string/action_send"
                android:imeOptions="actionSend"
                android:maxLines="6"
                tools:ignore="Autofill,InvalidImeActionId,TextFields" />

            <ImageButton
                android:id="@+id/send_button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginEnd="@dimen/space_small_l"
                android:background="@android:color/transparent"
                android:contentDescription="@string/action_send"
                android:src="@android:drawable/ic_menu_send" />

            <ImageButton
                android:id="@+id/bottom_buttom"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginEnd="@dimen/space_small_l"
                android:background="@android:color/transparent"
                android:contentDescription="@string/action_send"
                android:src="@drawable/down_active" />
        </LinearLayout>
    </LinearLayout>
</RelativeLayout>

Also some detailed pictures Screenshot:

How can i do it like that?

use android:windowSoftInputMode="adjustResize" and put the content you want to scroll in Scrollview/NestedScrollView and make the views(the ones you want to stick at bottom) below scroll as alignedToBottom and specify scroll to be above those views. Posting, sample in answer section. — Vikas Borkar, Jan 29 '19 at 09:21
I had the same problem, very important add to scrollview container : android:layout_gravity="bottom" — Denis Fedak, May 25 '20 at 15:37
@DenisFedak, You are a genius! I have been stuck on this issue for a day, until I read your comment! For others in the same situation: add the gravity = bottom to the layout contained within the scrollview, as gravity instructs the parent on how the child wants to be displayed. — AlexB, Mar 01 '22 at 17:50

score 4 · Answer 1 · answered Jan 29 '19 at 09:38

use android:windowSoftInputMode="adjustResize" in manifest for the activity
and put the content you want to scroll in Scrollview/NestedScrollView
and make the views(the ones you want to stick at the bottom) below scroll as alignedToBottom and specify scroll to be above those views.

Check the sample below, you can create a similar layout according to your requirements.
Try to understand how it is working, you can use any container view instead of RelativeLayout.

Sample: (for Activity/Fragment layout)

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:id="@+id/rlRoot"
   android:layout_width="match_parent"
   android:layout_height="match_parent">

<!--Scrollable view: RecyclerView, NestedScrollView, Webview etc-->
<ScrollView
    android:id="@+id/nsScroll"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/btnNext">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        .
        .
        .
        <AutoCompleteTextView
            android:id="@+id/etDob"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:imeOptions="actionDone"
            android:inputType="date"
            android:maxLines="1" />
        .
        .
        .
    </LinearLayout>
</ScrollView>

<!--Sticks at the bottom-->
<Button
    android:id="@+id/btnNext"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:textColor="@android:color/white" />

This do not scroll bottom, it just make sure your input is on the screen — Leonardo Rick, May 08 '21 at 00:58

score 1 · Answer 2 · answered Jan 29 '19 at 07:04

1

In Manifest instead of adjustPan use adjustResize

<activity
    android:name=".screen.workshiftscreen.WorkShiftActivity"
    android:launchMode="singleTop"
    android:windowSoftInputMode="adjustResize"
    android:screenOrientation="portrait" />

answered Jan 29 '19 at 07:04

Kajol Chaudhary

257
2
9

This is not helps, chat items and framelayout hiding behind the top. – AlexS Jan 29 '19 at 07:09
3

Use relative layout and set the bottom view, which is edittext and send button as alightParentToBotton="true". – Kajol Chaudhary Jan 29 '19 at 07:14
You know how to use RelativeLayout? You should set your header as alightParentTop="true", bottom view alightParentBottom="true" and the swiperefreshlayout to below of header and top of footer. – Kajol Chaudhary Jan 29 '19 at 07:22
oh, sorry, i will try it now. – AlexS Jan 29 '19 at 07:24
sorry, this is not helps to me. – AlexS Jan 29 '19 at 07:40
Did you change the android:windowSoftInputMode to adjustResize? Can you share the new view after realtivelayout – Kajol Chaudhary Jan 30 '19 at 04:54

score 1 · Answer 3 · answered May 20 '22 at 12:10

First, you need to detect keyboard appearance

boolean isKeyboardShowing = false;
void onKeyboardVisibilityChanged(boolean opened) {
    print("keyboard " + opened);
}

// ContentView is the root view of the layout of this activity/fragment    
contentView.getViewTreeObserver().addOnGlobalLayoutListener(
    new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {

    Rect r = new Rect();
    contentView.getWindowVisibleDisplayFrame(r);
    int screenHeight = contentView.getRootView().getHeight();

    // r.bottom is the position above soft keypad or device button.
    // if keypad is shown, the r.bottom is smaller than that before.
    int keypadHeight = screenHeight - r.bottom;

    Log.d(TAG, "keypadHeight = " + keypadHeight);

    if (keypadHeight > screenHeight * 0.15) { // 0.15 ratio is perhaps enough to determine keypad height.
        // keyboard is opened
        if (!isKeyboardShowing) {
            isKeyboardShowing = true
        binding.scrollView.fullScroll(ScrollView.FOCUS_UP)
        }
    }
    else {
        // keyboard is closed
        if (isKeyboardShowing) {
            isKeyboardShowing = false
        binding.scrollView.fullScroll(ScrollView.FOCUS_UP)
        }
    }
}

});

when keyboard appear change scroll to top

score 0 · Answer 4 · answered Jan 29 '19 at 07:12

"adjustResize"

The activity's main window is always resized to make room for the soft keyboard on screen.

"adjustPan"

The activity's main window is not resized to make room for the soft keyboard. Rather, the contents of the window are automatically panned so that the current focus is never obscured by the keyboard and users can always see what they are typing. This is generally less desirable than resizing, because the user may need to close the soft keyboard to get at and interact with obscured parts of the window.

Know more from this link and try different modes for your requirements

Scrolling a layout when the keyboard appears

4 Answers4

Linked