Android – softkeyboard hide the buttons under multiline EditText?
I have a relativelayout with a button under EditText. Ideally, when the user clicks EditText and fills multiple lines of text, the relativelayout will also expand with the increase of lines. However, my current behavior is that after the first line of EditText is filled, the key pad starts to overwrite the button under it. After 3-4 lines of text in EditText, The button is moved below the keyboard. Is there any way to increase the size of the entire layout so that the button remains above the keyboard when I type text? This is my code:
In androidmanifest.xml:
<activity
android:name="<Name of project>.activity.Comments"
android:configChanges="orientation|keyboardHidden"
android:label="Comments"
android:screenOrientation="portrait"
android:theme="@style/AppTheme.NoActionBar"
android:windowSoftInputMode="stateHidden|adjustResize" />
Comments.xml:
<RelativeLayout
android:id="@+id/send_message"
android:layout_width="match_parent"
android:layout_height="90dp"
android:layout_margin="4dp"
android:layout_alignParentBottom="true">
<EditText
android:fontFamily="sans-serif"
android:id="@+id/write_comment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="12dp"
android:gravity="left"
android:textSize="16sp"
android:textColor="@color/black"
android:cursorVisible="false"
android:textColorHint="@color/material_color_grey_300"
android:hint="@string/commentBack"
android:background="@drawable/edittext_bg"
android:inputType="textMultiLine"
android:isScrollContainer="true"
android:maxLength="200"
android:scrollHorizontally="false" />
<Button
android:fontFamily="sans-serif-medium"
android:id="@+id/send_comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:textColor="@color/colorPrimary"
android:layout_marginTop="8dp"
android:text="@string/send"
android:background="@null"
android:layout_below="@id/write_comment"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:textAllCaps="false" />
</RelativeLayout>
I tried to add Android: isscrollcontainer = "true" and thought it would create a scrolling container for EditText, which would help expand the layout, but it seemed useless. Any help would be appreciated. Thank you!
Edit: add the entire layout based on the following answer:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent" android:fitsSystemWindows="true"
android:id="@+id/comments_layout">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/comments_appbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="@style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_alignParentTop="true"
android:layout_marginTop="?attr/actionBarSize"
android:layout_width="match_parent"
android:id="@+id/comments_listview"
android:layout_height="match_parent">
<ListView
android:scrollbars="vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/rv_view_comments">
</ListView>
<TextView
android:layout_below="@id/rv_view_comments"
android:gravity="center_horizontal"
android:padding="16dp"
android:textSize="16sp"
android:id="@+id/empty_list_item"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone"
android:text="@string/noComments" >
</TextView>
<include layout="@layout/include_progress_overlay"/>
</RelativeLayout>
<RelativeLayout
android:id="@+id/send_message"
android:layout_width="match_parent"
android:layout_height="90dp"
android:layout_margin="4dp"
android:layout_alignParentBottom="true">
<EditText
android:fontFamily="sans-serif"
android:id="@+id/write_comment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="12dp"
android:gravity="left"
android:textSize="16sp"
android:textColor="@color/black"
android:cursorVisible="false"
android:textColorHint="@color/material_color_grey_300"
android:hint="@string/commentBack"
android:background="@drawable/edittext_bg"
android:inputType="textMultiLine"
android:isScrollContainer="true"
android:maxLength="200"
android:scrollHorizontally="false" />
<Button
android:fontFamily="sans-serif-medium"
android:id="@+id/send_comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="16sp"
android:textColor="@color/colorPrimary"
android:layout_marginTop="8dp"
android:text="@string/send"
android:background="@null"
android:layout_below="@id/write_comment"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:textAllCaps="false" />
</RelativeLayout>
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
Edit: according to jayder's request, I attached a photo to show my question. If I can make GIF or other things, if I add more text in the EditText field, the send button will disappear under the keyboard. Unless I delete the text from EditText, I can't push and send:
Editor: I also showed how to scroll to the bottom of the listview when I click edit text, if that helps
public void setupComment(final EditText comment) {
//Once we send the post, we want to scroll to bottom of listview
comment.setOnEditorActionListener(new TextView.OnEditorActionListener() {
@Override
public boolean onEditorAction(TextView v, int actionId,
KeyEvent event) {
if (event != null && (event.getKeyCode() == KeyEvent.KEYCODE_ENTER)) {
comment.setImeOptions(EditorInfo.IME_ACTION_DONE);
resetKeyboardSettings();
}
return false;
}
});
//Hide the cursor until view is clicked on
View.OnTouchListener onTouchListener = new View.OnTouchListener(){
@Override
public boolean onTouch(View v, MotionEvent event) {
System.out.println("Touched");
if (v.getId() == comment.getId()) {
comment.setCursorVisible(true);
}
commentsView.postDelayed(new Runnable() {
@Override
public void run() {
commentsView.smoothScrollToPosition(commentsView.getAdapter().getCount());
}
}, 750);
return false;
}
};
comment.setOnTouchListener(onTouchListener);
}
resolvent:
I've tried your layout. Everything is perfect. It's not a problem
<activity
android:name="<Name of project>.activity.Comments"
android:configChanges="keyboard|keyboardHidden|screenLayout|screenSize|orientation"
android:label="Comments"
android:screenOrientation="portrait"
android:theme="@style/AppTheme.NoActionBar"
android:windowSoftInputMode="stateHidden|adjustResize"/>
This is the XML I use
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/comments_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.PopupOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/comments_appbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="@style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="@+id/comments_listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/send_message"
android:layout_alignParentTop="true"
android:layout_marginTop="?attr/actionBarSize">
<ListView
android:id="@+id/rv_view_comments"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toEndOf="@+id/empty_list_item"
android:scrollbars="vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
<TextView
android:id="@+id/empty_list_item"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/rv_view_comments"
android:gravity="center_horizontal"
android:padding="16dp"
android:text="No Comments"
android:textSize="16sp"
android:visibility="gone" />
</RelativeLayout>
<RelativeLayout
android:id="@+id/send_message"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_margin="4dp">
<EditText
android:id="@+id/write_comment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFFFF"
android:cursorVisible="false"
android:fontFamily="sans-serif"
android:gravity="left"
android:hint="Comment Back"
android:inputType="textMultiLine"
android:isScrollContainer="true"
android:maxLength="200"
android:padding="12dp"
android:scrollHorizontally="false"
android:textColor="#000000"
android:textColorHint="@android:color/holo_red_dark"
android:textSize="16sp" />
<Button
android:id="@+id/send_comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="@id/write_comment"
android:layout_marginTop="8dp"
android:background="@null"
android:fontFamily="sans-serif-medium"
android:gravity="center|center_vertical"
android:text="Send"
android:textAllCaps="false"
android:textColor="@color/colorPrimary"
android:textSize="16sp" />
</RelativeLayout>
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
I've tested the above changes, it just works, you can see below
I hope this will help you solve the problem