Android different screen support - android

I want some help of different screen support. Also want to know the advantage of 9 Patch image over .png image use in the drawable folder.

I recommend you to use this directory structure:
drawable-mdpi // 320 x 480 - Galaxy Ace
drawable-hdpi // 480 x 800 - Desire, Nexus One
drawable-xhdpi // 720 x 1280 - Sony Xperia S, Galaxy S
drawable-large-nodpi // 800 x 1280 - Nexus 7
drawable-xlarge-nodpi // Galaxy Tab, Xoom
Note: nodpi is necessary to prevent resources scaling.

In general it is not guaranteed that tablet will come with hdpi density screens (especially cheap 7"). Resolution and density are two separated beasts, even they look like come together. Please read this article Supporting Multiple Screens. I strongly recommend the whole one, however section "Using configuration qualifiers" shall help you addressing your issue, as instead of relying on density, you could consider putting your resources in resolution qualified resource folder instead (depending on target API, as these appeared in HC)

Related

Properly defining dimens.xml to support both Android mobile and tablet devices

I have an app in the play store which runs on all mobiles and now I want to release it on tablets as well.
1) The images have been designed for xhdpi screens. So I think that will be sufficient to support tablets as well or should I redesign the images seperately for tablets?
2) I want to split dimens.xml into 3 categories -
dimens.xml for all mobile phones
dimens.xml for all 7 inch tablets
dimens.xml for all 10 inch tablets
The solution I came up with is divide the values folder like below -
values/dimens.xml
values-sw620dp/dimens.xml
values-sw720dp/dimens.xml
but since few mobile phones might fall into values-sw620dp/dimens.xml or values-sw720dp/dimens.xml, What is the appropriate way to divide dimens.xml into 3 categories??
Please do not post the below picture as I want to divide into 3 categories
Following is Struture Answered by Many
1) There is no tablet device in the market with higher density than xhdpi. Therefore, xhdpi images are sufficient to support tablets
2) Dividing the values folder as below will be helpful
- values\dimens.xml
- values-land\dimens.xml
- values-sw600dp\dimens.xml
- values-sw600dp-land\dimens.xml
- values-sw720dp\dimens.xml
- values-sw720dp-land\dimens.xml
The suffix -land is used for lanscape orientation.
Mobile phones do not fall into the sw600dp or sw720dp category. I think you are confused between dp and px.
Example:
Take Samsung Galaxy S7 Edge.
Resolution : 1440 x 2560px
Density : xxxhdpi
Converting 1440px to dp at xxxhdpi density, you get 320dp (Convert px to dp)
Therfore the width of Samsung Galaxy S7 edge in dp is 320dp and will fall in values\dimens.xml file
If you take a Tab and find dp similarly, you will notice that the dp will be greater than or equal to 600dp.

Why the icons / images looks blur (not clear) on tablet , but looks fine on phone in android?

I was working on android app based on phone. However, recently the app need to support the tablet.
The design was based on 1920 * 1080, I put all images/ icons into the xxhdpi folder and for lower resolution I just let android to help me rescale it.
The problem is , it works well on phone(1280 * 800 5"), but when I use tablet to check it (say , galaxy tab 2 which resolution is only 1280 * 800 10.1" and 1024 * 600) but it looks like very blur . How to fix it ? Thanks for helping.
Added
<supports-screens
android:resizeable="true"
android:smallScreens="true"
android:largeScreens="true"
android:xlargeScreens="true"
android:normalScreens="true"
android:anyDensity="true"/>
already but still the same
Update: I also find that the dp is too small for the tablet
<style name="AppBaseTheme" parent="#style/Theme.AppCompat.Light">
<!-- API 11 theme customizations can go here. -->
<item name="android:actionBarSize">60dp</item>
</style>
I was using a custom actionBarSize , it works nice on phone, but the 60dp is too small for tablet, how can I fix it as well? Thanks
Well, I don't think you following the guidelines when you're using images. The android documentation doesn't say anything about screen resolutions when dealing with images, it rather focuses on pixel density when referring image resources (usually drawables) which is explained here. Remember that you can have two types of images (as far as I know):
Image resources (usually drawables)
Image assets
When using drawables you have to focus on pixel density rather than screen resolution because as you have just found out a small (or regular) screen device can have exactly the same resolution as a large screen device, to top it off, sometimes a normal screen device (handset) can have a higher resolution than a large screen device (tablet) where obviously in this case the handset has a much higher pixel density. So, you need to follow their guidelines take a medium pixel density (mdpi) device as the baseline to design your image resources as follows...taking a 96px image as an example...
for a medium density device (mdpi) provide an image with 96px in the drawable folder...this is your baseline
then, target a high pixel density(hdpi) device by multiplying your baseline image by 1.5...that is, 96x1.5 = 144px...place this image inside the drawable-hdpi folder with exactly the same name
a x-large pixel density device image would be the baseline image multiplied by 2 (96x2=192px). This goes inside the drawable-xhdpi folder
for an xx-large picel density (xxhdpi) device multiply the baseline image by 3 (96x3=288) and place it inside the drawable-xxhdpi folder
Notice in the link provided that you don't need to provide an image for a device with a low pixel density since Android scales it down from mdpi without any problems...
Note: Android also supports low-density (LDPI) screens, but you normally don't need to create custom assets at this size because Android effectively down-scales your HDPI assets by 1/2 to match the expected size.
In your case, whats happening is that your Galaxy tablet has a lower pixel density and Android down-scales the image from a xxhdpi to whatever density the tablet has (hdpi or xhdpi)....so, it your image is a 512px image Android would down-scale it to 341px for xhdpi or 256px for an hdpi device.
If you follow these guidelines and focus on pixel density, you should be fine. However, for images in the assets folder there's no much you can do apart from using the ScaleType enum or using stretchable 9-patch images
Hope this helps
Update
Actually, according to this link, the Galaxy Tab 2 has mdpi screen, which means your image will be scale down three times from xxhdpi. You should provide the same images with different sizes inside the appropriate drawable-x folders
I know its a way too late but recently I faced the same issue about the way app launcher icons looks on a tablet and they are blurry. I'm sure that AOS honestly chooses mdpi drawables for tablets with mdpi display density and thats the problem. So I solved this by placing smartphones icons to a tablet resources dirs as following (left column - usual smartphone drawables-density and the right - tablet dirs):
drawable-xhdpi -> drawable-large-mdpi (these are 96x96px)
drawable-xxhdpi -> drawable-large-hdpi (these are 144x144px)
drawable-xxxhdpi -> drawable-large-xhdpi (these are 192x192px)
drawable-xxxhdpi -> drawable-xlarge (these are 192x192px)
I'm not sure if last two has to be 288x288 px but since I don't have such icons in the project I guess 192x192 should be enough.

Force load desired dpi drawables according to screen size

I have 4 sets of images
Resolutions DPI Directory
240 x 320 120dpi - drawable-ldpi
320 x 480 160dpi - drawable-mdpi
480 x 800 240dpi - drawable-hdpi
1280x 800 320dpi - drawable-xhdpi
But when I tested it at ASUS transformer with resolution 1280x800 and DPI 224.
It loaded graphics from drawable-hdpi.
If I will add another folder with name drawable-xlarge, It will load desired images but it will increase the size of application as well.
My questions are as follows
1 - What is the best practice to support all screen sizes and DPI?
2 - Is there any way to force load drawable of particular DPI w.r.t screen size?
3 - What is the solution recommended for my problem without replicating the graphics?
But when I tested it at ASUS transformer with resolution 1280x800 and dpi 224. It loaded graphics from drawable-hdpi.
That is because the ASUS Transformer is an -hdpi device. Hence, it is working properly.
What is the best practice to support all screen sizes and dpi?
Usually, images only vary based on density, and so your current structure is fine.
If you elect to have images that vary both on screen size and density, you will need to make more directories (e.g., res/drawable-xlarge-hdpi/) and images for the
Is there any way to force load drawable of perticular dpi w.r.t screen size?
Density and screen size have nothing to do with one another.
What is the solution recommended for my problem without replicating the graphics?
According to your "question", you do not have a problem. Hence, there is no recommendation for your non-problem.

Android, mdpi density but different screens

I am working on an application that will run on multiple devices. I have three devices for testing.
HTC Desire S -- 480 x 800 pixels, 3.7 inches (~252 ppi pixel density)
Samsung P6200 Galaxy Tab 7.0 Plus -- 600 x 1024 pixels, 7.0 inches
(~170 ppi pixel density)
Samsung Galaxy Tab 2 10.1 P5100 -- 800 x 1280 pixels, 10.1 inches
(~149 ppi pixel density)
As per my understanding if i correctly develop my application for above three, most of the other devices will be handled. may be?
My question is from where should i start designing my images? As the both tablets are of mdpi density but different screen sizes, i designed the images for TAB2 and placed the images in drawable-mdpi directory, those images were shown perfectly on TAB2 but on TAB7, things are messed up, images are overlapping on each other.
So, both the tablets are mdpi and for mdpi, images should be placed in drawable-mdpi but for which tablet size should i design images?
Application UI usually is not fully bitmapped. You got some elements like icons which are fixed size, but from other hand your buttons should scale without problems. So assuming you want to target all devices, you should design your UI the way it fit on smallest supported screen (in this case 600 x 1024 pixels is your max) - this means that if you preview on said screen all UI elements are fully fit on screen. On higher screens you UI have to scale, but this usually do not need any special approach (unless you work on bitmapped game for example) as elements like lists, buttons, layouts will stretch automatically. And if your design assume any bitmaps involved in said scalable elements, use 9-patch PNG files to make it scale correctly.
For more on that subject, please read "Supporting Multiple Screens".
I recommend you designing for xhdpi, you can allways resize for lower dpis.
Take into account dpi is not related to screen size, on the other side, larger screen tablets have lower dpi than most "modern" phones.
Make the layout for target screen sizes, i.e. 10" and 7" tablets, the system will take the best bitmap for your device dpis (or restcale the nearest one!).
With the latest (beta) Android SDK and Eclipse plugin you'll take a better view of the differents devices screens: dpi + pixel resolutions + screen size., they now show, for exaple, like
7" WSXVG (Tablet) (1024x600: mdpi)
in the layout editor.

Android resolutions and emulator not choosing correct image

I have a quick question regarding Android resolutions and how it is represented on the emulator. I have set up a test project to test many different resolutions and how they look on each orientation. So I have created drawable-land-ldpi,mdpi,hdpi-xhpdi and done the same thing for drawable-port. I also have all the layout folders, i.e. small med large x large, small-land,med-land,large-land, x-land
I have created 8 test images, that just say small port, land, medium port, land etc and so on just to check Android is choosing the correct image. I have also created a layout file for each layout folder, in the layout files I have a text field which just specifies the folder name so I know which layout folder is being used.
I have two questions, first is am I creating the correct image size for each folder. The image sizes I have created as are follows
drawable-land-ldpi - 320 * 240
drawable-port-ldpi - 240 * 320
drawable-land-mdpi - 480 * 320
drawable-port-mdpi - 320 * 480
drawable-land-hdpi - 800 * 480
drawable-port-hdpi - 480 * 800
drawable-land-xhdpi - 1080 * 720
drawable-port-xhdpi - 720 * 1080
And my second question is why do these not seem to represent properly on the emulator? Example, I have created an Android app with one screen and the images in the appropriate folders. I have created two emulators, one is 2.3.3, and one is a 3.0 tablet.
If I run the device on my device which, it uses the image from the medium resolution folder and uses the medium layout folder. So if it is port it will use the layout from the default layout folder and the image from the drawable-port-mdpi and if its landscape it will use the layout from the default land folder and the image from the drawable-land-mdpi.
However if I run this on the emulator, on the 2.3.3 device, it uses the layout folder from the medium layout folder, but the image from the drawable-hdpi-port and if its landscape uses the medium landscape layout folder, but the image from the drawable-hdpi-land. If I run it on the 3.0 tablet emulator, it uses the correct layout from the xLarge port and xLarge land, but it uses the image from the drawable-mdpi folders.
I have set up in the manifest to support all resolutions and layouts. Is there any reason why the emulator is doing this? I don't have an Android tablet on me at present to test this as friend forgot to bring it, so I can't test if this works fine on the tablet yet.
I would like to be able to use the emulator to try out a range of devices to test, but if it is not choosing the correct image then I cannot rely on it. Anyone else have issues like this? Or am I doing something wrong?
Any information would be much appreciated!!
Pixel density matters. For instance, your hdpi images may be the right size, but with an incorrect pixel density, they will still get scaled in those folders. For instance, your hdpi images should have a pixel density of ~240dpi. Check the developer guide for supporting multiple screen sizes:
http://developer.android.com/guide/practices/screens_support.html
Another issue is that the screens may be a variety of sizes, along with different pixel densities, e.g., a tablet could be 10 inches (X-Large), but still have a medium pixel density (1280x800). At the same time, you could have another tablet that's also 10" with xhdpi, if the resolution was something like 2560x1600.
It might be better for you to specify your actual layout folders based on pixel density. i.e., you can make folders:
res/layout-sw600dp/main_activity.xml # For 7” tablets (600dp wide and bigger)
res/layout-sw720dp/main_activity.xml # For 10” tablets (720dp wide and bigger)
And you can still apply port and land to them. Read up on the page about supporting multiple screen sizes, it will probably really help to answer a lot of your questions.

Categories

Resources