Full screen background image in an activity

Question

I see many applications that use a full-screen image as background. This is an example:

I want to use this in a project, the best way I've found so far to do this is to use an image with a large size, put it in a ImageView and use android: adjustViewBounds="true" to adjust the margins

The problem is that if a screen with a very high resolution, the image falls short.

Another option I thought of is to use the image in a FrameLayout, with match_parent in width and height as background... this stretches the image, but I think the result is not very good.

How would you do it?

Answer 1

There are several ways you can do it.

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"

Answer 2

Another option is to add a single image (not necessarily big) in the drawables (let's name it backgroung.jpg), create an ImageView iv_background at the root of your xml without a "src" attribute. Then in the onCreate method of the corresponding activity:

    /* create a full screen window */
    requestWindowFeature(Window.FEATURE_NO_TITLE);
    getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
            WindowManager.LayoutParams.FLAG_FULLSCREEN);
    setContentView(R.layout.your_activity);

    /* adapt the image to the size of the display */
    Display display = getWindowManager().getDefaultDisplay();
    Point size = new Point();
    display.getSize(size);
    Bitmap bmp = Bitmap.createScaledBitmap(BitmapFactory.decodeResource(
      getResources(),R.drawable.background),size.x,size.y,true);

    /* fill the background ImageView with the resized image */
    ImageView iv_background = (ImageView) findViewById(R.id.iv_background);
    iv_background.setImageBitmap(bmp);

No cropping, no many different sized images. Hope it helps!

Answer 3

You should put the various size images into the followings folder

for more detail visit this link

• ldpi

• mdpi

• hdpi

• xhdpi

• xxhdpi

and use RelativeLayout or LinearLayout background instead of using ImageView as follwoing example

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:orientation="vertical"
 android:background="@drawable/your_image">

</RelativeLayout>

Answer 4

It's been a while since this was posted, but this helped me.

You can use nested layouts. Start with a RelativeLayout, and place your ImageView in that.

Set height and width to match_parent to fill the screen.

Set scaleType="centreCrop" so the image fits the screen and doesn't stretch.

Then you can put in any other layouts as you normally would, like the LinearLayout below.

You can use android:alpha to set the transparency of the image.

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

  <ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scaleType="centerCrop"
    android:src="@drawable/image"
    android:alpha="0.6"/>

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

      <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello"/>

      <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="There"/>

   </LinearLayout>
</RelativeLayout>

Answer 5

What about

android:background="@drawable/your_image"

on the main layout of your activity?

This way you can also have different images for different screen densities by placing them in the appropriate res/drawable-**dpi folders.

Answer 6

If you want your image to show BEHIND a transparent Action Bar, put the following into your Theme's style definition:

<item name="android:windowActionBarOverlay">true</item>

Enjoy!

Answer 7

use this

android:background="@drawable/your_image"

in your activity very first linear or relative layout.

Answer 8

In lines with the answer of NoToast, you would need to have multiple versions of "your_image" in your res/drawable-ldpi,mdpi, hdpi, x-hdpi (for xtra large screens), remove match_parent and keep android: adjustViewBounds="true"

Answer 9

Add android:background="@drawable/your_image" inside your Relativelayout/Linearlayout Worked.

Answer 10

If you have bg.png as your background image then simply:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/bg"
    tools:context=".MainActivity" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="@string/hello_world"/>
</RelativeLayout>

Answer 11

Working. you should tryout this:

android:src="@drawable/img"

Answer 12

three step for put background

1)you should choose your like picture. for example :enter image description here

2)Then you copy this picture in drawable. warning: you should choose types short for name picture.

enter image description here

3)you go to page xml Intended and write :

android:background="id picture" for example my picture id is @drawable/download.

enter image description here

finish.

Answer 13

The easiest way:

Step 1: Open AndroidManifest.xml file

You can see the file here!

Step 2: Locate android:theme="@style/AppTheme" >

Step 3: Change to android:theme="@style/Theme.AppCompat.NoActionBar" >

Step 4: Then Add ImageView & Image

Step 4: That's it!