Android layouts and automatic image resizing

Question

My android app currently has two layouts for its splash screen, portrait and landscape. Both use the same simple format - an image that's the same size as the screen, held in a simple linear layout:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:orientation="vertical"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   >
<ImageView
       android:layout_width="fill_parent"
       android:layout_height="fill_parent"
       android:scaleType="fitCenter"
        android:src="@drawable/splash_p"
       />
</LinearLayout>

The image used is 320w x 480h and Android automatically resizes it to fit the screen, irrespective of the screen size of the device. Obviously, the image isn't as sharp when resized for a tablet for example.

I should point out here that my goal is to reduce the installed size of the final application as much as possible, and I'm aware that I could include different layouts and sizes of the same images for each differing screen size.

My splash screen is made up of the app's name in the top third of the screen, and then an image in the bottom two thirds of the screen. In order to save memory, I want to crop the app name and the image into two seperate images, and then display them in a linear vertical layout for devices held in portrait mode. I'll then use a linear horizontal layout of image and then app name for landscape mode.

For the portrait layout I've got this:

     <?xml version="1.0" encoding="utf-8"?>
        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical">
        <LinearLayout android:id="@+id/linearLayout1" android:layout_width="fill_parent"            android:layout_height="wrap_content" android:orientation="vertical">
        <View android:layout_height="45dp" android:layout_width="45dp" />   
        <ImageView android:layout_height="fill_parent" 
        android:src="@drawable/splashtext" 
        android:scaleType="fitCenter" 
        android:layout_gravity="center" 
        android:layout_width="fill_parent"></ImageView>

        <View
        android:layout_height="35dp"
        android:layout_width="35dp" />      

       <ImageView
       android:scaleType="fitCenter"
        android:src="@drawable/splashpic"
       android:layout_height="fill_parent" android:scaleType="fitCenter" android:layout_width="fill_parent" android:layout_gravity="center"/>
</LinearLayout>
</LinearLayout>

When I display the above in eclipse, it looks ok for smart phones, but the images are not scaled up when displayed on a tablet, although I'm using the android:scaleType="fitCenter" argument. I've tried using dips instead of fill_parent in the imageview layout_width and layout_height but that doesn't work either.

What am I doing wrong? Is there another way to do this?

Thanks

I've edited the question to include this revised XML based on @KaHa6u 's help below. So now I have:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent" 
   android:orientation="vertical">
    <LinearLayout android:id="@+id/linearLayout1" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:orientation="vertical">
<View
        android:layout_height="15dp"
        android:layout_width="15dp"
 /> 
<ImageView android:layout_height="wrap_content" 
        android:src="@drawable/splashtext" 
        android:adjustViewBounds="true"
        android:scaleType="fitXY" 
        android:layout_gravity="center" 
        android:layout_width="wrap_content" 
        android:layout_weight="1">
        </ImageView>


<View
        android:layout_height="15dp"
        android:layout_width="15dp"
 /> 
<ImageView
       android:scaleType="fitXY"
       android:src="@drawable/splashpic" 
       android:adjustViewBounds="false"
       android:layout_height="wrap_content" 
       android:layout_width="wrap_content" 
       android:layout_weight="4" 
       android:layout_gravity="center"/>
</LinearLayout>
</LinearLayout>

Which scales up vertically, but not horizontally, so I end up with tall thin images when the screen size increases.

KaHa6uc KaHa6uc · Accepted Answer · 2011-08-24T11:13:13

@basinbasin

I just encountered a situation very similar to the one you explained. I needed to have an ImageView on top of the layout, which had to be stretched ONLY HORIZONTALLY and retain its height when the phone gets into landscape orientation. I succeeded with just this:

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

and, of course, with activity's attribute:

<activity android:configChanges="keyboardHidden|orientation">

Hope this helps. Thank you.

Android layouts and automatic image resizing

3 Answers