Image Sizes for the Android Application

Question

Sorry I know earlier some people have same kind of questions but I am suffering from the same issue and don't get a clear view from the earlier questions.

I found Android very complex for the developer to deal with Multiple dimensions. Like there are devices from ldpi to xxhdpi and tablets.

What I have observed is there are different folder structure for the Images like ldpi, mdpi, hdpi and xhdpi and for tablets sw-600dp(7inch) and sw720dp(10inch).

Now the problem is there are many handsets have size 5 inch but there resolution is different and for tablets also the case is same. So I am confused and what size of images I asked to make to Designer for different handsets and mobile because resolution is very from device to device.

I also check the links http://developer.android.com/training/basics/supporting-devices/screens.html But didn't clear idea.

I am new to android . Please guide me how to solve this issue.

Narcotize

I also need this clarification. After 2 years experience in android i m still not clear about these things. :( – Campo

@AndroidKiller So how you are dealing with this till now. – Narcotize

I am also have no clear idea how to deal with the different resolutions. Hope get some idea through your query. – Tolmach

@Narcotize i am just creating back ground images with different sizes and put into different folders. As mostly background images, so sometimes i took help of 9-patch images. – Campo

what is the size of different images according to the folder and How to can we create a .9png. Any good tutorial for that. – Narcotize

if you can use 9patch image then you will solve your all problems.9patch is better solution for this. – Vector

Have a look at this detail discussion Application Skeleton to support multiple screen – Harday

Answer 1

Pick your device targets up front and stick to it. Check what's the biggest resolution popular device on the market today (samsung galaxy s4(1080p), nexus 7(1080p), nexus 10 (2560×1600), etc).

Do your designs/graphics in the biggest resolution available on a physical device.

There are 3 kinds of images:

1. can be made into a 9patch (Ask yourself..could this be done in xml? If it is only made of simple shapes, just redo it in xml)
2. can be redone in xml drawables (gradients, shapes whatever)
3. can only be scaled or cropped (like a photo)

Working with 9patches is a pain in the ass, and IMHO should be avoided at all costs. Even if you make a very nice 9patch, you still have to scale it to every possible resolution that you want to support, which will increase the apk size. With xml files, you don't have to care about that, and you will be forward compatible, when somebody introduces a bigger resolution device in the future (they will).

Example:

Simple gradient dialog background(100x400 resolution in xhdpi) in all resolutions that I support in the app that I'm working on (l,m,h,xhdpi) is 20Kb. In xml it would be <1Kb.

But yeah, if you still want to use 9patches, just do it once in the biggest resolution that you care about(xhdpi), and use a resizer tool to get all the other resolutions. It will create the proper drawable folder structure for you!

About number 3:

So you have some images that can not be remade in xml, nor can be 9patched. Even if you have just a few (2-3) full screen images(backgrounds), you will run out of memory. There are some tools that could help with that, like universal image loader. Of course, if you have only small images, you are probably safe.

In eclipse, the layout editor has a nice preview feature, set it up properly so you can always see all the resolutions and aspect ratios that you care about.

To sum it up, tell your designer to do different designs for phones, 7" tablets, 10" tablets only in the biggest available resolution that a device (in that category) on the market today has. Also, do learn how to use xml drawables.

Gigolo

Answer 2

Generally to make desgn perfect, tell your designer to use .9.png, means 9 patch images. 9 patch images could stretched as per your requirements.

Another way is, your designer need to calculate Absolute value of screen sizes. That means we have 4 standard sizes as per Android given us, that are, 320X426, 320X470, 480X720, 720X960. So if you need to create image designer need to calculate the screensize with the needed image.

i.e. if screen width is ldpi-320, then how much space will be allocated to particular Image size, so he will find 4 different size image after this calculations.

Affront

what's the size for the .9png images means for ldpi and mdpi and hdpi etc. We will create all these images in .9png and place in different folders. Also one more thing about layout how to manage them according to different sizes – Narcotize

.9.png will be very small size, means 10X10 or 5X5. it will be stretched as per your requirements. For layout if you were used 9 patch images then layout will be fine itself. And there is some guidelines from android you have to read it. – Affront

i dont think 9-patch image is suitable for every purpose. 9-patch is more effective as long as the image is of one color. But for colourful images 9-patch will not effect, the image will stretch as like a simple image. – Campo

Ya you are right, for not all the case 9 patch will work, when 9 patch will not work, at that time your designer need to calculate absolute value for device screen to your image size. – Affront

Answer 3

It's essential to validate on real devices that your layouts and screen-/density-specific resources behave as you intend. It's also important to validate your app's behavior on devices with screens you don't support with size-/density-specific resources, and verify that your app looks and behaves acceptably under Android defaults. Images looks better if you set your image sizes should be following order.

ldpi = 120px
mdpi = 160px
hdpi = 240px
xhdpi = 320px
xxhdpi = 440px
xxxhdpi = 560px

Rhiamon

I believe xxhdpi is 3x and xxxhdpi is 4x, so those sizes should be 480px and 640px respectively. – Romeoromeon