Android: Background image resize on keyboard pop up

Question

I am developing an application in which the background image get shrink on keyboard pop-up. My .xml is as follows :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:facebook="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/background" >

    <ScrollView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >

        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" >

            /**
              Other stuff 
            */

        </RelativeLayout>
    </ScrollView>
</RelativeLayout>

I searched on Google and found that, to add

android:windowSoftInputMode="stateVisible|adjustPan"

in my manifest file. But its of no use.

Edit :

My Layout before key board pop up looks like :

And after pop up like:

Please check the difference in background image. In image 1 image is in size and in image 2 background image shrink-ed. I need the footer and background get shift upward on keyboard popup.

What I am missing or doing wrong please suggest me.

Answer 1

Just use in your onCreate() this code:

protected void onCreate(Bundle savedInstanceState) {
...   
 getWindow().setBackgroundDrawableResource(R.drawable.your_image_resource);
...
}

and eliminate this line in your xml:

android:background="@drawable/background"

Read more at:

http://developer.android.com/reference/android/view/Window.html

Answer 2

I had faced the similar issue once, mine was solved by using the below properties in manifest use it where your activity is declared.

 android:windowSoftInputMode="stateHidden|adjustResize|adjustPan"

Answer 3

Ok if I got your question right, you want a layout with a background and a scrollview. And when the softkeyboard pops up, you want to resize the scrollview, but keep the background at full size right? if that's what you want than I may have found a workaround for this issue:

What you can do is make 2 activities.

Activity 1:

public class StartActivity extends Activity {

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    Intent StartApp = new Intent(this, DialogActivity.class);
    startActivity(StartApp);         // Launch your official (dialog) Activity

    setContentView(R.layout.start);  // your layout with only the background 
    }
}

Activity2:

public class DialogActivity extends Activity {

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    this.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);  // get rid of dimming
    this.requestWindowFeature(Window.FEATURE_NO_TITLE);  //get rid of title bar (if you want)

    setContentView(R.layout.dialog);  //Dialog Layout with scrollview and stuff

    Drawable d = new ColorDrawable(Color.BLACK);  //make dialog transparent
    d.setAlpha(0);
    getWindow().setBackgroundDrawable(d);
    }
}

start layout:

<LinearLayout 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/test">  //your background
</LinearLayout>

dialog layout:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent">

    <ScrollView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">

            <LinearLayout
                android:orientation="vertical"     
                android:layout_width="match_parent"
                android:layout_height="match_parent">

                <!-- All your Scrollview Items -->

            </LinearLayout>
     </ScrollView>
</RelativeLayout>

AndroidManifest.xml

start Activity:

android:theme="@android:style/Theme.NoTitleBar.Fullscreen">

dialog Activity

android:theme="@android:style/Theme.Dialog"
android:windowSoftInputMode="adjustResize"
android:excludeFromRecents="true"

Edit: To finish Activities at once use the following somewhere inside your DialogActivity (example: override the backbutton):

@Override
public void onBackPressed() {
    Intent intent = new Intent(getApplicationContext(), StartActivity.class);
    intent.setFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
    intent.putExtra("EXIT", true);
    startActivity(intent);
}

and in onCreate() of StartActivity:

if (getIntent().getBooleanExtra("EXIT", false)) {
    finish();
}
else {
    Intent StartApp = new Intent(this, TestActivity.class);
    startActivity(StartApp);
}

Screenshots!

Normal

Clicked the EditText box

After Scrolled down (ps: i put textbox inside scrollview thats why its gone ;) )

I hope this will help your out ;)

Answer 4

Hey can you please try adding this

android:isScrollContainer="false" 

in your ScrollView. It has solved my problem once. Might help u too.

Also, add this to your activity in manifest.xml

android:windowSoftInputMode="adjustPan"

Hope it helps..!! :)

Answer 5

I had the same issue.

Add your outer layout background inside onCreate method as show below

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

and add your outer layout as

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
>
<ScrollView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#4d000000"
    ><other code></ScrollView></RelativeLayout>

Add android:layout_weight="1" for the outer layout and don't set background in xml file I think this helps someone

Answer 6

You should move the android:background="@drawable/background" in an ImageView above ScrollView. When the keyboard pops up it effectivly makes the screen smaller, and having an image as background you have no control on how it is resized/cropped. So, assuming you want to have the image full width but keep the ascpect ratio try this:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:facebook="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:src="@drawable/background"
        android:scaleType="centerCrop" />

    <ScrollView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
        <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" >           
            /**
            Other stuff
            */
        </RelativeLayout>
    </ScrollView>
</RelativeLayout>

You can try different android:scaleType values to achive your desired effect. If you want the image to be cropped from the top instead of the default middle crop, see here on how to achieve this, or try using this library

Answer 7

Check this answer, the basic trick is you don't set the background to the layout but to the window. This can be done from the activity with getWindow().setBackgroundDrawable(), or you can set it in a theme to your activity.

Answer 8

Instead of android:windowSoftInputMode="stateVisible|adjustPan", you should change to android:windowSoftInputMode="stateVisible|adjustResize". It worked for me.

Answer 9

Use ScrollView as Top parent. It will be scrolled up and down automatically when you open and close keyboard.

Answer 10

Why don't you do like this

    <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"

        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:fillViewport="true"
        android:focusable="true"
        android:background="@drawable/background"
        android:focusableInTouchMode="true">

        <RelativeLayout
            android:id="@+id/relative"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:focusable="true"
            android:focusableInTouchMode="true"
    /**
              Other stuff 
            */
    >
  </RelativeLayout>
  </ScrollView>

Answer 11

You should use the adjustResize option for the windowSoftInputMode setting on the Activity in your AndroidManifest.xml file.

Answer 12

i am using below view heirarchy and its working fine for me:

<?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" >

    <ScrollView
        android:id="@+id/rfqItemsParentScrollView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical" >