Android: how to scale an image to fill the background of a LinearLayout without preserving aspect ratio?

Question

I have got a RelativeLayout like this:

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

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linearLayout1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/background1"
        >
    ....
    </LinearLayout>

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linearLayout2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/background2"
            android:layout_below="@+id/linearLayout1"
        >
    ....
    </LinearLayout>

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/linearLayout3"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/background3"
            android:layout_below="@+id/linearLayout2"
        >
    ....
    </LinearLayout>

</RelativeLayout> 

I want to have a different background image in each of the three LinearLayouts and this image should be scaled to fill its LinearLayout without preserving the aspect ratio of the image. And I don't want each LinearLayout to be scaled to fit the size of the image (if the image is higher than the LinearLayout, I want the image height to be reduced).

Hereafter what it should look like:

Anyone knows how to do this ?

Thanks !!

Answer 1

You can use an imageView and set its scaleType to fitXY. Here's an example:

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

    <ImageView 
      android:layout_width="fill_parent" android:layout_height="fill_parent"
      android:src="@drawable/blue_dark_background" android:scaleType="fitXY" />

    <LinearLayout>....</LinearLayout>
</FrameLayout>

Please let me know if this helps you. Regards!

EDIT

This a more clear example

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" 
    android:weightSum="3"
    android:orientation="vertical">

<FrameLayout
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1" >

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:scaleType="fitXY"
        android:src="@drawable/ic_menu_share" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

    </LinearLayout>
</FrameLayout>
<FrameLayout
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1" >

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:scaleType="fitXY"
        android:src="@drawable/ic_menu_share" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

    </LinearLayout>
</FrameLayout>
<FrameLayout
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="1" >

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:scaleType="fitXY"
        android:src="@drawable/ic_menu_share" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

    </LinearLayout>
</FrameLayout>

</LinearLayout>