Scale Images in Different Resolutions XML

Question

I have created 4 resolution folders and put the appropriate image sizes into each as seen in the picture below:

enter image description here

I have also created 8 different layout folders for various screen sizes as seen in the picture below:

enter image description here

As you can see in the picture below, I need to re-size the images in each according XML file so they fill the screen:

enter image description here

I use this code to scale down images which works fine:

android:adjustViewBounds="true"  
    android:maxWidth="150dp" 
    android:scaleType="fitCenter"

But I cannot figure out how to scale up images. I have been trying to use this code:

android:adjustViewBounds="true"  
    android:minWidth="150dp" 
    android:scaleType="fitCenter"

Any ideas on how to scale up the images? Thank you!!

XML:

    <ImageButton
    android:id="@+id/btnPlay"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_below="@+id/imageView1"
    android:layout_marginTop="15dp"
    android:background="@null"
    android:src="@drawable/btn_play"
    android:adjustViewBounds="true"  
    android:scaleX="1.5"
    android:scaleY="1.5"
    android:scaleType="fitXY"  />

score 10 · Accepted Answer · answered Jul 25 '13 at 04:47

10

Have you tried?:

android:scaleX="1.5" // 1 is 100% size
android:scaleY="1.5"

answered Jul 25 '13 at 04:47

Cԃաԃ

1,259
1
15
29

1

This works in re-sizing the actual image but the imageView does not scale with it so the pictures overlap. Any idea on how to make the imageView scale with the image? – Shane Jul 25 '13 at 04:54
Yes, I have a android:layout_width="wrap_content" and android:layout_width="wrap_content" on the imageView – Shane Jul 25 '13 at 05:05
1

wrap all your image views with a layout, set w&h of the layout to match_parent, and set gravity to center/center_horizontal. – Cԃաԃ Jul 25 '13 at 05:25
let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/34121/discussion-between-c-and-shane) – Cԃաԃ Jul 25 '13 at 05:27

Tarsem Singh · Answer 2 · 2013-07-25T05:39:31.853

1

try android:scaleType="fitXY" instead of android:scaleType="fitCenter"

Edit

use LinearLayout with layout_weight and weightSum

like adjust WeighSum and layout_weight according to your UI !

 <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:weightSum="8" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="3" >

        <!-- your Match m Image -->
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="2"
        android:background="#fff" >

        <!-- your play image -->
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" >

        <!-- your Multiplayer image -->
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" >

        <!-- your High score Image -->
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" >

        <!-- your how to play Image -->
    </LinearLayout>
</LinearLayout>

edited Jul 25 '13 at 05:39

answered Jul 25 '13 at 04:48

Tarsem Singh

14,139
7
51
71

Tested, but the images still won't scale up. – Shane Jul 25 '13 at 04:57
@Shane use android:layout_width="match_parent" and android:layout_width="match_parent" – Tarsem Singh Jul 25 '13 at 05:12
"match_parent" fills the entire screen with the imageView. I have updated my question with the xml – Shane Jul 25 '13 at 05:16
@Shane than use linear layouts with layout_weight and weightSum – Tarsem Singh Jul 25 '13 at 05:33
It seems like a lot of code to change just to scale up images for a different size screen. I am considering just making xhdpi images for all resolutions and scaling them down for the other layouts. – Shane Jul 25 '13 at 05:35
My entire application is designed using RelativeLayout. It would be a huge pain to change all of my layouts to Linear. I am suprised the solution to my problem is not easier because I have followed Android's instructions exactly for supporting multiple screens. – Shane Jul 25 '13 at 14:33

score 0 · Answer 3 · answered Jul 25 '13 at 09:58

0

You shall use the new size qualifiers for this. That's the best way. What you are doing is not wrong, but with so many different breed of devices it have become obsolete. Refer this

answered Jul 25 '13 at 09:58

gandharva

691
5
16

Size qualifiers were introduced in Android 3.2. My application need to support at least API 8. – Shane Jul 25 '13 at 14:35

Scale Images in Different Resolutions XML

3 Answers3