Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Supporting resources for tablets and mobiles

I need to support an application for bith mdpi, hdpi and xhdpi mobiles and 7' and 10' tablets I have to admit that I'm a bit lost.

So far I only did the tablet version and what I did is :

  • one single folder called "layout"
  • 3 different folders called "drawable-sw600dp", "drawable-sw800dp" and "drawable-sw1200" containing images of 600px large, 800px large and 1200px large.

I have the impression that I messed it up and that I should have the created standard "drawable-mdpi", "drawable-hdpi" and "drawable-xhdpi" folders.

But if I do so :

  • in which folder do I have to put the images for the tablets? xhdpi only?
  • how large (in px) should be the images for the tablets?
  • how large should be the images for the mobiles?
  • and last but not the least : how to have to name the "layout" folders to have a different version for mobiles and tablets?

I already read the Android recommendation like a 1000 times and I am still confused...

EDIT 1

This paragraph from Android website answered my question "how to have to name the "layout" folders to have a different version for mobiles and tablets?"

EDIT 2

Regarding the drawable folders, for mobile phones, it seems quite clear that I have to create 3 folders this way :

  • drawable-mdpi containing 320px-width images
  • drawable-hdpi containing 480px-width images
  • drawable-xhdpi containing 720px-width images

Still remains the question of how to name the different drawable folders for supporting tablets.

like image 423
thomaus Avatar asked Mar 01 '13 12:03

thomaus


2 Answers

so this would be my answer.

Layouts -> 2 folders :

  • "layout" (or "layout-sw320dp") for mobiles
  • "layout-sw600dp" for tablets

Drawables -> 5 folders :

  • "drawable-mdpi" for mobiles, containing 320px-width images
  • "drawable-hdpi" for mobiles, containing 480px-width images
  • "drawable-xhdpi" for mobiles, containing 720px-width images
  • "drawable-sw600dp" for 7'' tablets, containing 600px-width images
  • "drawable-sw720dp" for 10'' tablets, containing 720px-width images

Any better response than this one is welcome!

like image 77
thomaus Avatar answered Sep 19 '22 01:09

thomaus


Because LDPI is barely used you should make 3 different sizes of images for mobiles.

Lets say you have an image which is 50x50 DP.

MDPI = 50x50PX

HDPI = 75x75PX (x1.5)

XHDPI = 100x100PX (x2.0)

You can create even more folders like: drawable-xlarge-xhdpi and drawable-xlarge-hdpiand put images you need for the tablets in there. I believe xlarge was for 10-inch? So you might end up with about 9 different sizes. 3 for mobile, 3 for 7' and 3 for 10'. Tablets also have pixel densities!

Right click your project in Eclipse -> New -> Other -> Android XML File

And then you choose Drawable as a recourse type to make drawable folders for example.

Below is a screenshot of how this looks. It's really useful!

Also see list of displays by pixel density

enter image description here

Using this you make folders that will look like this. large is 7', xlarge was 10' (I think).

/res/drawable-large-mdpi

/res/drawable-large-hdpi

/res/drawable-large-xhdpi

/res/drawable-xlarge-mdpi

/res/drawable-xlarge-hdpi

/res/drawable-xlarge-xhdpi

7 inch Android tablets are HDPI and large.

Check the table here and read about large/xlarge/small etc.

like image 25
Edward van Raak Avatar answered Sep 20 '22 01:09

Edward van Raak