简体   繁体   中英

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

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 屏幕截图

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>

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"

Add the following:

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

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 :-

在此处输入图片说明

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM