Develop Reference

Resize views on Soft Keyboard launch

I am trying to create a chat application. The chat layout currently looks like this
The corresponding layout file is
<?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:fillViewport="true"
android:layout_height="match_parent">
<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"
tools:context="com.example.nirmal.chatadapter.MainActivity">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary">
<de.hdodenhof.circleimageview.CircleImageView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/profile_image"
android:layout_width="40dp"
android:layout_height="wrap_content"
android:src="#drawable/iconuser"
app:civ_border_width="2dp"
app:civ_border_color="#color/White"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="#dimen/marginLeftForToolbar"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/White"
android:text="UserName Here"
android:layout_marginTop="#dimen/marginTopBottomForBubble"
android:id="#+id/user_name"
android:textSize="#dimen/textMedium"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/White"
android:text="User details Here"
android:layout_marginTop="#dimen/marginTopBottomForBubble"
android:id="#+id/user_details"
android:textSize="#dimen/textSmall"/>
</LinearLayout>
</android.support.v7.widget.Toolbar>
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/toolbar"
android:layout_marginTop="#dimen/recyclerViewMargin"
android:isScrollContainer="true"
android:id="#+id/chatRecycler"
android:layout_above="#+id/chatBoxAndSend">
</android.support.v7.widget.RecyclerView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentBottom="true"
android:orientation="horizontal"
android:layout_marginBottom="5dp"
android:id="#+id/chatBoxAndSend">
<EditText
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:minWidth="50dp"
android:maxWidth="50dp"
android:id="#+id/chatBox"
android:paddingStart="#dimen/cardViewPadding"
android:background="#drawable/rounded_chat_box"
android:layout_margin="#dimen/marginForChatBox"
/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.2"
android:background="#drawable/oval_button"
android:minWidth="50dp"
android:maxWidth="50dp"
android:text="Send"
android:imeOptions="flagNoExtractUi"
android:id="#+id/chatSendButton"
android:layout_margin="#dimen/marginForChatBox"
android:textColor="#color/Black"
/>
<!--<ImageView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.1"
android:id="#+id/send_button"
android:src="#drawable/send"
android:background="#drawable/oval_button"
android:layout_marginBottom="#dimen/marginForChatBox"
android:layout_marginTop="#dimen/marginForChatBox"
android:layout_marginEnd="#dimen/marginForChatBox"
/>
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.1"
android:id="#+id/send_button"
android:src="#drawable/send"
app:civ_border_width="2dip"
android:layout_marginEnd="#dimen/marginForChatBox"
app:civ_border_color="#color/greenChatColor"/>-->
</LinearLayout>
</RelativeLayout>
</ScrollView>
When I open my soft keyboard the layout looks likes this
I have added this in my manifest file
android:windowSoftInputMode="adjustPan|stateHidden"
The output is not what I expected it to be. I want the recyclerview to dynamically resize in the center of the screen and the Toolbar and the edittext to stay fully visible.
As you can see the toolbar has been pushed up and is not visible even when scrolled. The edittext is hidden partially by the suggestions given by the keyboard. Some of the posts I saw asked me to add a scrollview which I did and still the same result. How can I solve this problem?

If you want to resize RecyclerView on SoftInput open or close then you can use below single line code
((LinearLayoutManager)myRecyclerView.getLayoutManager()).setStackFromEnd(true);
For more read this post: https://trinitytuts.com/tips/resize-recyclerview-on-android-softinput-keyboard-appear/
Hope this code helps you

The flag adjustPan is wrong. Use the adjustResize instead:
android:windowSoftInputMode="adjustResize|stateHidden"
What adjustPan does is equivalent to enlarging a picture more than the screen and then panning - i.e. moving the picture so you see different parts of it. (like a map in google map for instance).

Android Soft keyboard float only specific layout

I have a layout, code below
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<!--some stuff here-->
<LinearLayout
android:id="#+id/layout1"
android:layout_alignParentBottom="true"
android:layout_above="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="5"
/>
<ImageButton
android:layout_width="50dp"
android:layout_height="50dp"
android:scaleType="fitStart"
android:layout_marginLeft="5dp"
style="#style/Base.Widget.AppCompat.Button.Borderless"
android:src="#drawable/ic_menu_send"/>
</LinearLayout>
<LinearLayout
android:id="#+id/layout2"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<!--some stuff here-->
</LinearLayout>
</RelativeLayout>
In the above code when keyboard is show i want layout2 to stay in the bottom and layout1 to go up with keyboard. if i add android:windowSoftInputMode="adjustPan|adjustResize" both layout stay in bottom. please help

as you can say this is not work
android:windowSoftInputMode="adjustPan|adjustResize"
just change it this
android:windowSoftInputMode="stateHidden"
and one more thing in your below layout
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<!--some stuff here-->
<LinearLayout
android:id="#+id/layout1"
android:layout_alignParentBottom="true"
android:layout_above="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="5"
/>
<ImageButton
android:layout_width="50dp"
android:layout_height="50dp"
android:scaleType="fitStart"
android:layout_marginLeft="5dp"
style="#style/Base.Widget.AppCompat.Button.Borderless"
android:src="#drawable/ic_menu_send"/>
</LinearLayout>
<LinearLayout
android:id="#+id/layout2"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#color/colorPrimary">
<!--some stuff here-->
</LinearLayout>
</RelativeLayout>
Keep in Mind :
When you have applied this property android:layout_above="#+id/layout2" to layout1 of your LinearLayout then remove this property android:layout_alignParentBottom="true" you don't require it.
So Now that look like this
<LinearLayout
android:id="#+id/layout1"
android:layout_above="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
Note : I am giving background color and specific height to
LinearLayout 2 for your Understandment.
Output :
Normal Screen
KeyBoard Open Screen.
ImProve :
see the upper Image I make Red Mark that property create the problem otherwise every thing is work fine.

Please use this, and tell me if you find any difficulties
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!--some stuff here-->
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/layout2"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="5" />
<ImageButton
style="#style/Base.Widget.AppCompat.Button.Borderless"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="5dp"
android:scaleType="fitStart"
android:src="#drawable/ic_menu_send" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/layout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
<!--some stuff here-->
</LinearLayout>
</RelativeLayout>

Use different themes for both the layouts.
such as:
One theme refers to adjustPan for windowSoftInputMode attribute.
and another theme refers to adjustResize for windowSoftInputMode attribute.

The fastest way is hide the layouts when soft keyboard is enable and show them again when the soft keyboard is disabled (layout2 on the xml)
Remove this Line as well
android:windowSoftInputMode="adjustPan|adjustResize"
it will work , this is just a simple way , I'm still searching for you

put this line in your manifest file.
android:windowSoftInputMode="stateHidden"

Remove the android:windowSoftInputMode="adjustPan|adjustResize"
And then Hide the layout2 programmatically when soft keyboard open. When soft keyboard close, again make the layout2 visible.
This will give user an experience exactly you want.I'm not shure there is any other way. But Keep searching. good Luck

Android - How to adjust a popup when the soft keyboard shows up

I want to replicate this effect in my layout. But in my layout when the keyboard show up, my pop-up is not adjusted.
The device adjust me the main activity below and not the popup.
this is my popup layout.xml :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/sfondo_semi_trasparente_scuro">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="#color/white"
android:orientation="vertical">
<EditText
android:id="#+id/textNomeGiocatoreNewTeam"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPersonName"
android:hint="Nome giocatore"/>
<EditText
android:id="#+id/textNumeroMagliaGiocatoreNewTeam"
android:inputType="number"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Numero Maglia"/>
<Button
android:id="#+id/buttonConfirmAddNewPlayer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Aggiungi giocatore"
android:layout_gravity="center"/>
</LinearLayout>
Can someone help me?

Try instead this:popupWindow.setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE);

You can also add this to your AndroidManifest.xml
<activity
...
android:windowSoftInputMode="adjustResize"
</activity>

Make keyboard not push up view

Since picture is worth a thousands words:
So I want my first LinearLayout to act something like a action bar, not being pushed up by keyboard. I tried android:isScrollContainer="false" and adding in manifest "adjustPan" or "adjustResize", but i don't get what i want.
Here is my XML:
<!-- layout 1 -->
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/caller_info"
android:layout_alignParentTop="true"
android:isScrollContainer="false"
android:layout_marginTop="#dimen/last_message_margin">
<TextView android:text="#string/hello_world" android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/txt_caller_name"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_marginLeft="#dimen/side_margins"
android:layout_marginStart="#dimen/side_margins"/>
</LinearLayout>
<!-- layout 2 -->
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/dialog"
android:layout_below="#+id/caller_info"
android:layout_above="#+id/write_msg_layout">
</LinearLayout>
<!-- layout 3 with edit text -->
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:id="#+id/write_msg_layout">
<EditText
android:layout_marginBottom="30dp"
android:layout_marginTop="10dp"
android:layout_marginLeft="#dimen/side_margins"
android:layout_marginStart="#dimen/side_margins"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/edit_text"
android:hint="Write Msg"
android:textColorHint="#color/grey_as_clouds"
android:background="#color/white_as_stone"
android:imeOptions="actionSend"
android:singleLine="true" />
</LinearLayout>

Finally got it. You must surround your view with ScrollView and use adjustResize.
And delete android:isScrollContainer="false".

Adapting component when virtual keyboard appears

I'm designing a simple login activity. I've used the following xml layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical"
android:layout_gravity="center_vertical|center_horizontal"
android:gravity="center_vertical|center_horizontal"
android:layout_margin="15dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="My application title"
android:textSize="30sp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:orientation="vertical"
android:layout_gravity="center_vertical|center_horizontal"
android:gravity="center_vertical"
android:layout_margin="15dp">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Username"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password"
android:layout_marginTop="15dp"/>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:text="Login"/>
</LinearLayout>
</LinearLayout>
And I've obtained this result:
But If the focus is on the first EditText I obtain this:
and If the focus is on the second EdiText the result is the follwoing:
Considering I've used the following line in the Manifest, for my activity:
android:windowSoftInputMode="adjustPan|adjustResize"
I want that when the virtual keyboard appears, the two edittext, the button and the textview are visible and correctly centered in the available screen.
What I have to change in my code?
NOTE: I've the same result If I remove the line in the manifest:
android:windowSoftInputMode="adjustPan|adjustResize"

You can replace the parent LinearLayout to a ScrollView :
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout ...>
....
....
</LinearLayout>
</ScrollView>
try this, it works for some of my apk !
Edit : sorry didn't see about center the text automaticaly, so with this you can adjust manually your editext to center with swipe your finger.. hope that will help