According to this SO thread, on "normal" phone screens I should use a 320x480 background image for mdpi, 480x800 for hdpi and 640x960 for xhdpi.
However I am having some troubles to get the scale of my images right on the Galaxy S3, Galaxy Note and Galaxy Nexus, all of which have a resolution of 800x1280 (720x1280 in the S3 and Nexus cases). Most of the time my 640px wide background will get stretched to 720 or 800, but other images won't (as I explained in this other SO thread).
One solution seemed to work: instead of using 640x960 images on the xhdpi folder use 800x1280, as that is the exact resolution of those devices, so pretty much no re-sizing is needed.
However this breaks the 4:6:8 ratio recommended by the Android Developer Guide to be maintained between the mdpi, hdpi, xhdpi.
My question: would it be OK to use my solution? Has anyone else tried this?
Related
Sorry. I have no idea about Android screen size HDPI, LDPI, MDPI. How can I check my flutter app in these screen size?
Create new android emulators with different pixel densities, and run the app on them. I wouldn't worry about ldpi (.1% of devices). The cutoffs are 160 dpi (mdpi), 240 dpi (hdpi), 320 dpi (xhdpi) and 480 (xxhdpi).
Generally this shouldn't be a problem as long as you specified all your sizes in dp rather than pixels. The most likely thing to want to change is images, make sure that any non-vector image looks good at multiple resolutions.
HDPI, LDPI, MDPI all refer to the pixel density of your display and not resolution of the device.
Generally when developing for multiple screen sizes you should focus more on viewport (say 360dp and 600dp as your breakpoints), then find or create new android virtual devices that match your viewport and then run your app on those devices.
Here are a few good links:
Material IO Pixel Density
Android Documentation
Android Device List
I know this question have been asked several times, but, I am facing a unique problem, solution of which I have not been able to find.
I have images in drawable, drawable-ldpi, drawable-mdpi, drawable-hdpi, drawable-xhdpi and drawable-xxhdpi in ratio of .75:1:1.5:2:3 respectively.
For most of the emulators, images are appearing perfectly well, but, for some of them, images are not appearing in proper proportion.
Like images appears well in 3.2" HVGA slider(ADPI) emulator- 320x480 mdpi, but, images do not appear well in 5.1" WVGA emulator- 480x800 mdpi. This is despite the fact that both are mdpi.
Why is it that despite both of them being mdpi, images appears well in one and do not appear in proper proportion in the other? How can I overcome this.
Edit:
Image where it shows mdpi:
3.2" HVGA slider(ADPI) emulator- 320x480 mdpi and 5.1" WVGA emulator- 480x800 mdpi.
EDIT2:
I think I had a similar issue where the dp wasn't being scaled well for monitor resolution. In the device settings under 'startup size and orientation', switch the scale to something like 4dp on device = 1px on screen.
In Android Virtual Device Manager:
Should we use XHDPI images for retina display in Android? If not, where should I place images/assets for the Samsung Galaxy S3.
Update:
I found a useful artical:
List of Android Devices with pixel density buckets
The Samsung Galaxy S3 got a density of around 309 pixels per inch. From the Android documentation on supporting multiple screen densities:
xhdpi: Resources for extra high-density (xhdpi) screens (~320dpi)
I think we can conclude that assets for the S3 should be placed in the xhdpi folder.
Extract from Android Developer Guide link above:
320dp: a typical phone screen (240x320 ldpi, 320x480 mdpi, 480x800 hdpi, etc).
480dp: a tweener tablet like the Streak (480x800 mdpi).
600dp: a 7” tablet (600x1024 mdpi).
720dp: a 10” tablet (720x1280 mdpi, 800x1280 mdpi, etc)
So i got graphics(images) at resolution 320 pixels per inch from designer in these dimension only
480x800 hdpi
720x1280 mdpi
800x1280 mdpi
I am confused which size of images should be placed in mdpi folder, hdpi folder and xhdpi folder. I want to make one application which can work on most android phones and tablets ?
You can create different graphic objects for use at different pixel densities. Android treats mdpi (160 pixels/inch) as the base density. So for mdpi devices, 1 dp = 1 pixel. At higher densities, there are more pixels per inch (240 for hdpi, 320 for xhdpi). Android attempts to make graphic images occupy the same physical dimensions on the screen regardless of the device pixel density. So if all it finds is an mdpi resource, and the device is hdpi, it will scale the graphic by 240/160 = 150%, and it will double the size of the graphic for xhdpi.
If you don't want this automatic scaling (which can make graphics look poor), you can simply supply your own version of graphic resources for use at higher densities. These graphics should be of the same size that Android would scale an mdpi resource.
Note that the pixels/inch that was stored in the image file has nothing to do with this. It's all based on where you put the graphics files in the resources directory for your project. Any graphics placed in res/drawable are assumed to be properly sized for mdpi displays, as are graphics placed in res/drawable-mdpi. Image files that it finds in res/drawable-hdpi are assumed to be properly sized for hdpi displays, etc. When your program runs on a particular device, Android will first look for a graphic that matches the display density of that device. If it does not find one but instead finds one for a different density, it will use that and automatically scale the image based on the above rules.
When you request a resource for which you provide alternatives, Android selects which alternative resource to use at runtime, depending on the current device configuration. To demonstrate how Android selects an alternative resource, assume the following drawable directories each contain different versions of the same images:
drawable/
drawable-en/
drawable-fr-rCA/
drawable-en-port/
drawable-en-notouch-12key/
drawable-port-ldpi/
drawable-port-notouch-12key/
And assume the following is the device configuration:
Locale = en-GB
Screen orientation = port
Screen pixel density = hdpi
Touchscreen type = notouch
Primary text input method = 12key
By comparing the device configuration to the available alternative resources, Android selects drawables from drawable-en-port.
The system arrives at its decision for which resources to use with the following logic:
Ref : How Android Finds the Best-matching Resource
Other References : Density independence , Providing Alternative Resources and Best Practices
And I will say that you should read complete page Supporting Multiple Screens, I don't think nothing will be better documentation than it...
I'm confused myself with all the screen size fragmentation but the basics are:
1. You need to create various folders under layouts to work with your images
2. Images will exist in the drawables folders also under various folders.
3. You should have a basic /layout and /drawable folder to accompany non-specific folders
4. Work from xhdpi then scale images down!
Examples for specific screen folders:
/layout-hdpi
/layout-xhdpi
/drawable-hdpi
/drawable-xhdpi
From what I know:
480 x 800 is hdpi (older phones eg S2, HTC Desire etc)
720 x 1280 is xhdpi (new phones eg S3, Galaxy Nexus etc)
Basically, Depending on the phone, android will grab resources from the necessary folder and if there is none then it will grab from the main '\layout' or '\drawable' folder. For example, the app running on a Galaxy Nexus will grab resources from '\layout-xhdpi' if the folder exists.
yes, you can make one app, but was need creating folders: /res/drawable, /res/drawable-mdpi, /res/drawable-hdpi and add content for all screen sizes
I can't figure out how to produce drawables for the new "high-res" handhelds like the Galaxy Nexus, One X, Galaxy S3 etc that have a resolution of 1280x720 or higher.
I always try to make as few layout-versions as possible. Preferably just one but at times a layout-long and notlong is necessary. And make the xml smart enough to handle all devices. But that's only possible if the drawable resources are there to supply all the different resolutions and sizes.
All has been nice and smooth until the new big phones arrived and I find that the drawables are to small for them. No xxhdpi-folder yet from Google so I must be doing something wrong.
I know it's forbidden to mention pixels here but still you have to use photoshop or some other pixel based application to make the drawables. Therefore you need to know how big to make these drawables.
This is what i've done so far:
xhdpi: 640x960
hdpi: 480x640
mdpi: 320x480
ldpi: 240x320
The problem is that when a 1280x720 device gets the drawables from the xhdpi folder things starts looking bad, the images are too small and there's too much space between them.
What do you base your drawable source files on? xhdpi in 1028x720? That messes up the lower res versions for me.
I have an ad agency breathing down my neck wondering why it doesn't look as perfect as on the iPhone...
Well, as I said above I can't find any handhelds with Android on it that's got a resolution of 640x960. So I based all my images on 720x1280 instead and put the 640x960 resolution stuff in a large-hdpi folder.
Now my app looks great on the latest Nexus, the Galaxy S3, HTC One-X and all of the other newer hires models. I think the tablets when looking for resources will go for large first, then hdpi where they will find the 2x scaled images.
This is what I ended up with:
xhdpi: 720x1280
large-hdpi: 640x960
hdpi: 480x640
mdpi: 320x480
ldpi: 240x320
I have a Galaxy Nexus, and I use the xhdpi resource folder (at a 2.0 scaling factor) and the images look great. Do you have an example (screenshot preferably) of what issue you're having? If you're hardcoding spacing and sizes in pixels, then yeah, it'll probably look weird at higher densities. Are you trying to hardcode a background image 1:1 at a specific pixel size? If so, that's never a good idea on Android.