app's UI is not proper in a 220 dpi screen

Viewed 147

hi I'm new in android developing and it's my first app.

I have made these folders in address : app\src\main\res for supporting multiple phone and tablet screens and put proper dimens.xml files in them.

  • values-ldpi
  • values-mdpi
  • values-hdpi
  • values-xhdpi
  • values-xxhdpi
  • values-xxxhdpi
  • values-sw600dp
  • values-sw768dp
  • values-sw800dp

    1. first of all, are they complete or am I missing some screen sizes?

    2. second, I've tested the app on several devices and it's working fine and has proper user interface in all phones but on the Galaxy Grand Prime which has a 5 inch 540 x 960 pixels display that means 220 dpi. this phone using hdpi dimens but UI is a bit messy.

The following pictures may make my point better :

proper UI , as it is shown in other devices

Proper UI , as it is shown in other devices

VS

UI in galaxy grand prime 220 dpi display

UI in galaxy grand prime 220 dpi display

as UI is completely OK in other devices, I thought I should make a specific dimens.xml file for that kind of dpi, so I made values-sw220dp. but after that other phones used this dimens instead of hdpi dimens and problem got worse because UI was fine in the galaxy phone and was not proper in other hdpi displays. and now I don't know what should I do.

can anyone help me in this issue?

at last sorry because of flaws in my english , as you can guess I'm not a native.

1 Answers

are they complete or i'm missing some screen sizes?

If you read the guides which I mentioned at the end of my answer you will find that there are very many possibilities of defining resources folders. I think nobody will want to implement all of them.

Usually you look at your app and then decide on maybe three or four screen sizes you want to support. I think "sw220dp" is important, if only to show a message that your app needs more space :-).

So there could well be three to five layout folders (sw220dp, sw320dp, maybe sw480dp, sw600dp, maybe sw820dp). If you need orientation-dependent layouts, then the number will be twice that much. (Why ? That's explained very well in the guides linked below)

You already know that there are different types of resources. Some of them do not depend on the screen resolution (e.g. layout files), some do (drawable resources).

So first of all you decide which screen sizes you want to support. Let's say they are "phone", "tablet" and "220dp". You create three layout files by the same name "my_activity.xml" and put them in three folders

  • for the really small window: res/layout-sw220dp
  • for the mobile phone: res/layout-sw320dp
  • for the tablet: res/layout-sw600dp

By the way, "sw" stands for smallest width which is the minimum length of the screen, no matter what the orientation is currently.

Now let's assume you have created three different layout files and all of them contain an ImageView like this:

<ImageView
    android:layout_width="24dp" 
    android:layout_height="24dp" 
    android:src="@drawable/my_picture" />

This is where the screen resolution comes into play: 24dp is a size value in "density-independent pixels". It will be resolved depending on the screen resolution of the device. So you need different versions of my_picture.png, and for this you need different folders for drawables. They are named after the different categories for screen resolution so the runtime knows which png file to pick:

  • res/drawable/ldpi (although I read somewhere you can skip that because the pictures will be scaled down from hdpi nicely)
  • res/drawable (here go the resources for res/drawable-mdpi as well as every drawable resource for which resolution does not matter, e.g. drawables defined via xml files)
  • res/drawable-hdpi
  • res/drawable-xhdpi
  • res/drawable-xxhdpi
  • res/drawable-xxxhdpi

Helpful links:

Providing Resources

Supporting Multiple Screens

Related