Software keyboard resizes background image on Android

Question

Whenever the software keyboard appears, it resizes the background image. Refer to the screenshot below:

As you can see, the background is sort of squeezed. Anyone can shed a light on why the background resizes?

My Layout is as follows:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/page_bg"
    android:isScrollContainer="false"
>
    <LinearLayout android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_width="fill_parent"
    >
        <EditText android:id="@+id/CatName"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:inputType="textCapSentences"
            android:lines="1"
        />
        <Button android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/save"
            android:onClick="saveCat"
        />
    </LinearLayout>
    <ImageButton
        android:id="@+id/add_totalk"
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:background="@null"
        android:src="@drawable/add_small"
        android:scaleType="center"
        android:onClick="createToTalk"
        android:layout_marginTop="5dp"
    />
</LinearLayout>

Solution 1

Ok I fixed it by using

android:windowSoftInputMode="stateVisible|adjustPan"

entry inside <Activity > tag in manifest file. I think it was caused by having ScrollView inside the Activity.

Solution 2

I faced the same problem while developing a chat app, chat screen with a background image. android:windowSoftInputMode="adjustResize" squeezed my background image to fit the available space after the soft keyboard was displayed and "adjustPan" shifted the whole layout up to adjust the soft keyboard. The solution to this problem was setting the window background instead of a layout background inside an activity XML. Use getWindow().setBackgroundDrawable() in your activity.

Solution 3

Here is the best solution to avoid such kind of problem.

Step 1: Create a style

<style name="ChatBackground" parent="AppBaseTheme">
    <item name="android:windowBackground">@drawable/bg_chat</item>
</style>

Step 2: Set your activity style in the AndroidManifest file

<activity
    android:name=".Chat"
    android:screenOrientation="portrait"
    android:theme="@style/ChatBackground" >

Solution 4

Through android:windowSoftInputMode="adjustPan" giving bad user experience because through that entire screen goes on top (shift to top ) So, following is one of the best answeres.

I have same Problem but after that , i Found Awesome answeres from the @Gem

In Manifest

android:windowSoftInputMode="adjustResize|stateAlwaysHidden"

In xml

Dont Set any background here and keep your view under ScrollView

In Java

You need to set the background to window:

    getWindow().setBackgroundDrawableResource(R.drawable.bg_wood) ;

Thanks to @Gem.

Solution 5

just for addition...

if u have a listview on your activity u need to add this android:isScrollContainer="false" in your listview properties...

and don't forget to add android:windowSoftInputMode="adjustPan" in your manifest xml at your activity...

if you guys using android:windowSoftInputMode="adjustUnspecified" with scrollable view on your layout, then your background will still resized by the soft keyboard...

it would be better if you use "adjustPan" value to prevent your background from resizing...

View more solutions

Comments

[Andreas Wong]

It's still happening even after I did this. This is getting frustrating :(

[Ted]

The problem is that scrolling is, when using adjustPan, not working... (if you have a ScrollView), and thats annoying...

[Mr.G]

But the scrollview is not working now. is thr any way to avoid it

[CelinHC]

Very good! Best answer! adjustPan causes collateral effects like: The keyboard overrides components but no scrollbar are displayed.

[Gem]

android:windowSoftInputMode="adjustPan" make the whole view shift with keyboard. Generally we have a title of the screen on the top. Using this flag it will also go out of the visible area, which make bad user experience.

[zgc7009]

@parulb or anyone else that happens to read this, this works great (and thank you for it) as long as the background image doesn't contain relevant information. The problem I encounter from time to time is that my background will contain something like a logo, and setting the window background to the image hides the logo behind the ActionBar. For certain screens this isn't an issue, but sometimes I am required to keep the ActionBar (no hiding). Any ideas on how to handle some sort of padding while setting the window background to take the ActionBar into account?

[Rana Ranvijay Singh]

I need scroll view. Do you have a way to keep the scroll view and keep the background un compressed.

[user2056563]

What if i am having a fragment how to deal with it ? its not working for fragments

[Admin]

@Gem : so what's the solution ?

[Gem]

@Copernic I faced this problem long time back when i was working on a chat application. Eventually i fixed that please refer my answer here: stackoverflow.com/questions/5307264/…

[CoolMind]

That's not enough. At least, if you don't use a ScrollView. Much better is a solution here stackoverflow.com/a/29750860/2914140 or stackoverflow.com/a/18191266/2914140.

[Dominic D'Souza]

This is a good solution in case u have other Views in the background other than an image....Thanks

[Andrei Aulaska]

To user2056563: For fragments just use getActivity().getWindow().setBackgroundDrawable() or getActivity().getWindow().setBackgroundDrawableResource()

[Lucas Eduardo]

Thank you, it worked even with scrollview. I did like this on new AppCompat: getWindow().setBackgroundDrawable(ContextCompat.getDrawable(‌​this, R.drawable.background));

[Adam Johns]

stateVisisble made my keyboard automatically pop up, so I just used adjustPan and still worked for me.

[Anton Kizema]

This shoud be the right answeir! Adjust pan narrows your abilities to code (you can not use ither options - like adjust resize, ets). We showd only set background to activities window, in all chat apps

[satvinder singh]

if you don't want to display keyboard automatically then use : android:windowSoftInputMode="adjustPan"

[CrandellWS]

This solution worked kinda but caused other issues...using the solution at stackoverflow.com/a/16917160/1815624 which worked better for me.

[Matias Elorriaga]

nice! simplest solution

[B.shruti]

But My problem here is , I am not using the image as background of window or view, I am using it in ImageView , and I want the view to resize, along with the original Imageview's src unchanged.

[B.shruti]

Any one suggest how to do that?

[Tejas Pandya]

Best Answer Ever

[Gem]

Thanks for the recognition.

[behelit]

I used both stateVisible|adjustPan but the background still moves after the keyboard appears/hides. My main layout is a scrollview though

[Nil]

What to do if I want to use scale type in this? Because for notch screen image is stretching.

[Nil]

What to do if I want to use scale type in this? Because for notch screen image is stretching.

[Harpreet]

It don't stretch anymore with above code but it still scrolls a little up/down w.r.t. soft keyboard.

[bensadiku]

Excellent solution,esp because it doesn't use the windowSoftInputMode which only brings more issues!

[hvar90]

you are a genius !

[DIRTY DAVE]

Needs to be in activity tag, won't work if it's in application tag.

[DIRTY DAVE]

Also stateVisible causes the keyboard to show onCreate. I removed that tag and just used adjustPan

[Priyanka]

Thanks for the easy answer :) you save my time