Android: Handling images size for multiple screens

Question

I find it really hard to handle images with Android, I think it\'s the hardest part of Android development...

1) I have an image, I want it to be the background of m

Answer 1

I recently had to do something similar to this. So here are some tricks.

If you want to preserve the aspect ratio of your image, use this in a relative layout. Note:The layout width and height of the relative layout should be match_parent or fill_parent.

<ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"

        android:id="@+id/bgloginpage"

        android:scaleType="centerCrop" />

This will crop the image from its center. There are other options available as well. Use fitXY instead of centerCrop to fit, it to the device with no consideration to the aspect ratio. For Best results with this, use a considerably large image.

Another option would be to sufficiently add a solid background colour to your image and increase its size. Load it into your drawables folder and use this class.

public class ReturnBackGroundImage {



//To avoid java.lang.OutOfMemory exceptions, check the dimensions of a    bitmap before decoding it,
// unless you absolutely trust the source to provide you with predictably sized image data that
// comfortably fits within the available memory.

public static Bitmap decodeSampledBitmapFromResource(Resources resources,    int resId, int reqWidth, int reqHeight, boolean UseDeviceHeight, Activity  activity) {


    if(UseDeviceHeight){
        DisplayMetrics metrics = new DisplayMetrics();

        activity.getWindowManager().getDefaultDisplay().getMetrics(metrics);
        reqHeight = metrics.heightPixels;
        reqWidth = metrics.widthPixels;
    }

    final BitmapFactory.Options options = new BitmapFactory.Options();
    options.inJustDecodeBounds = true;
    BitmapFactory.decodeResource(resources, resId, options);
    return ResizeImage(resources,options,resId,reqWidth,reqHeight);
}

public static Bitmap ResizeImage(Resources resources,BitmapFactory.Options options, int resId, int reqWidth, int reqHeight) {

    double imageHeight = options.outHeight;
    double imageWidth = options.outWidth;
    double ratio = reqHeight / imageHeight;
    int newImageWidth = (int) (imageWidth * ratio);
    Bitmap bMap = BitmapFactory.decodeResource(resources, resId);
    return  getResizedBitmap(bMap, reqHeight, newImageWidth);
   }
}

Use it as follows

ImageView v = (ImageView)findViewById(R.id.bgloginpagew);
  v.setImageBitmap(ReturnBackGroundImage.decodeSampledBitmapFromResource(getResources(),R.drawable.mainbgforapp,0,0,true,walkThroughActivity.this));

This is a modified version of the example from the android website.

If someone needs the ratios for saving different sized images, it is

1. xxxhdpi/xxhdpi = 4/3
2. xxxhdpi/xhdpi = 2/1
3. xxhdpi/hdpi = 2/1
4. xhdpi/mdpi = 2/1

afaik these ratios are only valid for square images. Thought I'd put it out there for some guy who needed them, like I did.

Answer 2

I would suggest you to adjust your layout on each layout folder and your drawable folder.

layout layout-800x480 layout-land etc. refer here http://developer.android.com/guide/practices/screens_support.html

or refer to this link.

Designing UI for different screen resolutions

Answer 3

I think if you want use Bitmap as your background, there are some ways of solution:

1. Design several size of image for different devices.(drawable-hdpi, drawable-xhdpi...)
2. Use different layout and put them into different resource package that using qualifiers.(layout-sw600dp...)

Answer 4

Android categorizes device screens using two general properties: size and density. You should expect that your app will be installed on devices with screens that range in both size and density. As such, you should include some alternative resources that optimize your app’s appearance for different screen sizes and densities. There are four generalized sizes: small, normal, large, xlargeAnd four generalized densities: low (ldpi), medium (mdpi), high (hdpi), extra high (xhdpi)

To declare different layouts and bitmaps you'd like to use for different screens, you must place these alternative resources in separate directories, similar to how you do for different language strings.

Also be aware that the screens orientation (landscape or portrait) is considered a variation of screen size, so many apps should revise the layout to optimize the user experience in each orientation.

See android.com's "Supporting Different Screens" article for more information.

Answer 5

The best Technique to get this task done is to use linear layout and use

 <LinearLayout
 android:layout_width="300dp"
 android:layout_height="350dp"
 android:layout_marginTop="20dp"
 android:weightSum="3"
 android:background="@drawable/fondshare"
 android:orientation="vertical" >

  <View
    android:id="@+id/imageView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    />

  </LinearLayout>

In above case

android:weightSum="number of parts you want to divide layout in"

android:layout_weight="1"

Total portion occupied by your view . Assume that weightsum of linear layout is 3 So the portion covered by view will be

Width of view :

(layout_width / WeightSum) * weight

Height of view :

(layout_height / WeightSum) * weight

in your case your view final height would be= 119dp

and final width would be= 100dp

Answer 6

Try this:

I met the issue lot of time for my layout deigns.Finally i got a solution that's like

I have create the layouts folders for different screen like small and large. Orginal layout folder xml file is working only for normal layout that is HVGA So create the folder with name=layout-small for small layout and put the xml files here. Then you create the folder with folder name=layout-long for large layout amd xml files here for that layouts.