How to adjust background image size to fit the app screen size in android

Question

I am using a s4 galaxy and I downloaded the following wallpaper wallpaper http://www.sswallpaper.com/get/samsung-galaxy-s4-wallpapers/Keep-Running-1080x1920/595-2.jpg I trying to use this wallpaper as the background image but the image does not fit into my screen. How do I adjust the size to fit the screen size of my app?

Here is my Xml code:

      <?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"
    android:background="@drawable/walking" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="WELCOME"
        android:textSize="40dp"
        android:textColor="@color/textColor"
        android:textStyle="bold"
        android:typeface="serif"
        android:id="@+id/textView5"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="45dp" />

    <TextView
        android:layout_width="189dp"
        android:layout_height="50dp"
        android:text="SKIP"
        android:textSize="20dp"
        android:textColor="@color/textColor"
        android:textStyle="bold"
        android:typeface="serif"
        android:gravity="center"
        android:id="@+id/skip"
        android:onClick="click"
        android:clickable="true"
        android:layout_gravity="bottom"
        android:layout_alignParentBottom="true"
        android:layout_toStartOf="@+id/textView5" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="To skip the tutorial press SKIP at the bottom.Slide to the left to continue to tutorial page."
        android:id="@+id/textView3"
        android:textColor="@color/textColor"
        android:layout_below="@+id/textView5"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="90dp" />

</RelativeLayout>

Screenshot of the Image I getting

have you considered using fill_parent instead of match_parent? and try to combine it with src this time. — Ashraf Alshahawy, Jan 24 '16 at 09:20

Ashutosh Verma · Answer 1 · 2016-01-24T09:02:00.773

If you don't want your image to scale.....then you should use..

android:scaleType="centerCrop"

Edit:

you should use FrameLayout for this kind of Layout, like this...

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

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

    <LinearLayout
        android:id="@+id/contentLayout"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">

        .......

    </LinearLayout>

</FrameLayout>

tested this as well. I don't know why it didn't work. :( anyway I just download another image size. — Spotty, Jan 24 '16 at 10:06

score 1 · Answer 2 · answered Jan 24 '16 at 09:19

Option 1:

Create different perfect images for different dpi and place them in related drawable folder. Then set

android:background="@drawable/your_image

Option 2:

Add a single large image. Use FrameLayout. As a first child add an ImageView. Set the following in your ImageView.

android:src="@drawable/your_image"
android:scaleType = "centerCrop"

Ashraf Alshahawy · Answer 3 · 2016-01-24T08:57:12.383

0

Add the following:

android:scaleType="fitXY"
android:src="@drawable/your_wallpaper_file"

edited Jan 24 '16 at 08:57

answered Jan 24 '16 at 08:32

Ashraf Alshahawy

1,139
1
14
38

1

have you tried setting the image view android:src instead of backgroud? – Ashraf Alshahawy Jan 24 '16 at 08:55
Could you please post a screenshot of the result, along with any code where you modify the imageview. – Ashraf Alshahawy Jan 24 '16 at 09:01
BTW, share your xml entire code, because maybe the problem not in the imageview and in its parent (LayoutView for example) – Ashraf Alshahawy Jan 24 '16 at 09:02
Hi I pasted my entire xml and the screenshot. – Spotty Jan 24 '16 at 09:14
I tested as well. It didn't work. :( Anyway I downloaded another image size. – Spotty Jan 24 '16 at 10:09

score 0 · Answer 4 · answered Jan 24 '16 at 08:36

0

   <ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/walking"
    scaleType="fitXY" >

answered Jan 24 '16 at 08:36

Ahsan Kamal

1,085
2
13
34

Which widget you are using? – Ahsan Kamal Jan 24 '16 at 08:56

Hitesh Sahu · Answer 5 · 2016-01-24T11:51:07.630

I tried your xml with little enhancements

<?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"
    android:background="@drawable/walking" >

    <TextView
        android:id="@+id/textView5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="45dp"
        android:shadowColor="#000"
        android:shadowDx="2"
        android:shadowDy="2"
        android:shadowRadius="1.0"
        android:text="WELCOME"
        android:textColor="#fff"
        android:textSize="40dp"
        android:textStyle="bold"
        android:typeface="serif" />

    <TextView
        android:id="@+id/skip"
        android:layout_width="189dp"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true"
        android:layout_gravity="bottom"
        android:layout_toStartOf="@+id/textView5"
        android:clickable="true"
        android:gravity="center"
        android:onClick="click"
        android:text="SKIP"
        android:textSize="20dp"
        android:textStyle="bold"
        android:typeface="serif" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/textView5"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="90dp"
        android:shadowColor="#000"
        android:shadowDx="2"
        android:shadowDy="2"
        android:shadowRadius="1.0"
        android:text="To skip the tutorial press SKIP at the bottom.Slide to the left to continue to tutorial page." />

</RelativeLayout>

It looks fine on my phone

May be you are using wrong drawable in your xml line Line #5

android:background="@drawable/walking"

Tested on S4 emulator GenyMotion :-

See my edit I have tested it on GenyMotion S4 emulator . – Hitesh Sahu Jan 24 '16 at 11:51 — Hitesh Sahu, Jan 24 '16 at 11:51

How to adjust background image size to fit the app screen size in android

5 Answers5

Linked