I'm having trouble getting my application to be scalable to different screen sizes on release.
I read through the support documentation at developer.android.com, Supporting Multiple Screens.
At first the app was just using one size version of images that looked fine on my sony xperia (note. with all height & width set to 'wrap_content'). however when I started trying out the emulated devices (ldpi, hdpi & xhdpi) the sizing was not relating to the display.
Below Are Two examples, the first being the correct view. the size & positioning is as expected
The latter is viewed at xhdpi, or the highest resolution that SDK emulator offers.
the positioning is correct, however the sizing is wrong. (sorry about the screenshot size)
I took to my editor & created the images again, one for each display type (mdpi, hdpi, xhdpi) & inserted into the relating resource folders.
I ran the test again, but still had the same sizing issue.
I'm not 100% with this part of android & would appreciate any help or pointers to resolving this issue
p.s please excuse the blanked out sections, they are in place to protect identity.
I don't see anything wrong with the screenshots, a screen with extra high density probably has a very big size (in pixels) so images take a smaller part of the screen. The solution to your problem is to make bigger images for screens with bigger size. From google's Supporting Multiple Screens that you've read you can create a folder like drawable-normal-mdpi for screens with normal size, or drawable-xlarge-mdpi etc etc
It's not an uncommon problem, just make bigger images for bigger screens, I had this issue when dealing with tablets, there was so much empty space because the screen is so much bigger.
Related
I have got an enhancement of one application. It is developed for 10.1 inch tablet. However it is working nice for tabs with size 10.1’ and for other screen sizes UI is poorly aligned. I need to do the changes in application so that it will be as good as 10.1 inch app for all other screen sizes(>4 inches).
I have few doubts here on my approaches.
1) I have found “size qualifiers” in android developer’s site. How many type of layouts need to use for each screen to make good for all sizes in android world.
Note: All screens in this application are always on land scape orientation. Is size qualifiers still works here?
2) Somewhere I found in “stack overflow “, It is already developed for 10.1 inches so that use percentages and change to every screen size.
100% -> 10.1’
? -> 7’
Which one is good and proper solution for maintenance also? Is there any other best solutions?
There is no hard and fast answer.
It is up to you to determine how many screen sizes you want to optimize for.
I'd suggest optimising for small, mid and large with layout qualifiers:
1) size qualifiers do work in landscape as they assess based on smallest screen width.
layout
layout-sw600dp
layout-sw800dp
2) I dont understand your question... i've never seen percentages used in Android layouts
There are so many different screen sizes that you can adapt your layout to..
In Eclipse's graphical layout you can also choose the screen size and resolution for which you want to develop (you can define the screen sizes and resolution and you will see how the layout looks on each of them).
You can also have several images that will be chosen automatically for each screen size via the drawable folder. You got drawable-hdpi for high density screens, drawable-xhdpi for extra high density screens and so on.. you can change an image to adapt to many of the screen size using Google's Android Asset Studio : http://romannurik.github.io/AndroidAssetStudio/index.html
You should also read the Android developers guide:
http://developer.android.com/training/multiscreen/screensizes.html
http://developer.android.com/guide/practices/screens_support.html
I'm writing an Android app and have read up everything I can find on fragmentation and handling multiple screens, particularly from the official Android documentation.
I understand different screen densities utilize the various folders (mdpi, hdpi etc.) for images of varying sizes, and different screen sizes can utilize different layouts by defining them in res/layout-sw600dp layout-sw720dp etc. which all makes sense.
However, when developing my app my primary test device was a HTC Desire X phone 400x800 with 240dpi density and all looks well. I then tested it on a Prestigio Multipad 8.0 tablet and this is where I'm getting confused. The tablet has a screen size of 786x1232 BUT the screen density is only 160dpi. Owing to the fact that the screen density on the tablet is smaller, Android therefore uses the images in the mdpi folder for the tablet, and the slightly bigger ones in the hdpi folder for the phone! This therefore results in images way too small on the tablet.
I don't need to edit the layout for the tablet so the sw720dpi folders aren't a help.
What am I missing or not understanding properly here? How can I make my images scale up for the bigger, lower density tablet screen?
OK, I figured this out eventually. My mistake was I didn't realize drawables work exactly the same as layouts in that I could have a drawable-sw720dp folder which Android fetches the images from in the case of a screen with at least 720pixels of width. For completeness in the scenario I described I could have a drawable-sw720dp-mdpi folder in which to store my images.
I had an additional issue then whereby I had 2 copies of the same image in different drawable folders but I discovered you can reference images using an alias just like layouts. Details of how to do that can be found here.
I developed and application and uploaded all the images in the respective drawable folders (different pixels for different desnities).
Now I am confused when it comes to layout. If I used the layout editor with 4.1 inc (thats considered Med screen I guess?) everything looks great.
Now when I use the editor with 10.1 inch which is the tablet, then I see icons very small and the text is small. I have not run the emulator yet.
So I am wondering:
1- why would the text be small although I didn't specify text size? Shouldnt scalle appropriately? or should I give it a specific size for bigger layouts?
2- Why the icons are small given that I provided the different drawables? I thought it would scale up accordingly.
Please don't give me the supporting multiple screens link in android as an answer, as I already went through it and still no luck with above. I need your personal advice as I think I am missing something here
Thank you so much in advance
Android support for different screens is a little tricky. That's because you can have large, small, medium and xlarge screens, plus high, medium and low density ones. There are a dozen possibilities (xlarge low density, small high density) and not a single resolution is defined. So you must know the principles which the API is designed upon and must define your layout thinking about the role the widget has inside your UI. You also must bear in mind that your layout won't be pixel perfect on 100% of devices, so your aim should be being usable on all possible devices.
In your specific case it seems that either you don't manage to specify the correct resources, or the system doesn't pick up the right ones for you, but I must remark that it doesn't make sense on Android to talk about big, small and scale: you should design your layout with a (good) webdeveloper mindset, who daily deals with tons of different displays, resolutions, physical sizes and even devices.
I also suggest not using the graphical builder if you are new to Android, because you really need to know how Android lays out components, otherwise you will come back to SO very often :)
If you do not specify the text size in your layout file Android will take the default value, which is most likely in DIP (density independent pixel) therefore it will be the same physical size on any devices. That should explain why the text looks so small on your 10 inch tablet.
What I would do in this case is have 3 layouts for each activities and specify the text size for larger devices (given you already like the look on phones) and put them in this folder scheme :
res/layout/layout.xml // phones
res/layout-sw600dp/layout.xml // 7” tablets
res/layout-sw720dp/layout.xml // 10” tablets
Information above was taken in this article. I have this applied in my current personal project and so far it works like a charm.
Secondly, as far as icons go, I'm no drawable expert but if you provided the same file in each folder (like I think you did from what I understand in your question), it will not make it scale. You'll have to create 4 difference icons, one for each possible pixel density.
Information about icon sizes can be found on this page.
Hope this is of some help to you.
My experience with the Android device zoo drew me to the sad conclusion that the built-in screen size/layout facility is useless. Cases in point, straight from support:
a 10 inch tablet with Android 2.2. Screen size xlarge is not supported by Android 2.2
Kindle Fire, which is 7 inch and claims it's xlarge.
I ended up putting all three layouts (med/large/xlarge) into layout, loading one based on run-time density and resolution, and providing an option for user to force a specific layout.
Just sayin'.
Are there any tools out there that can convert my dpi units for a baseline densitity into another?
When I define my layout-files I design for a screen with 320x480 dpi units. But then it doesn't fit right on small and large devices.
But since we know the baseline dpi's of ldpi, mdpi, hdpi and xhdpi, why isn't there a tool to just take my width/height definitions in the files and scale them to these different densities, given a default baseline. It should then return the missing layout files, where they would scale right on to these other densities.
It seems straight forward and would save developers tons of time, does anyone know of an existing program to do this?
I created a tool that allows you to scale/adjust your layouts for tablets and small screen devices and made a blog post about it here: http://onemanmobile.blogspot.com/2012/04/how-to-scale-your-android-layouts-to.html
Basically, defining your layouts in dp units is not enough if you want your app to fit on all devices and tablets, since there's four different "density-buckets". This tool will allow your layouts to be converted into fitting these density buckets.
I hope the blog, tool and answer will help others, I know it felt good to have my app work perfectly on a tablet with the press of a button.
Your question doesn't make any sense. what you're asking for is exactly what Android does.
If you put an image into a folder (like xhdpi) it is automatically scaled for all different device densities.
If you create a layout for a particular class of device, then the correct layout is used for the correct device.
I would advise against designing for specific resolutions of screen - there are too many. Group screens into buckets - e.g. "Phones" and "Tablets", or "Small Phones", "Phones", "Large Screen Devices" - specify criteria, and build layouts for each category. It's a fool's game to build layouts for every screen resolution, there are hundreds of Android devices.
The designer of our company wants me to give him the resolutions of Android tablets so he will start designing a new app.
I know there are a lot of different resolutions (listed here: Android Tablets computers).
I also know about the division of Android to the different dpi's (ldpi, mdpi, ...).
My questions :
What should I tell the designer? He obviously not supposed to make a version for each resolution. Besides, some of the resolutions listed in the link above are in the same dpi, so which one should I choose?
Considering the fact the app is going to run only on tablets, what are the dpi classes I should use? Only hdpi and xhdpi? Or should I still use all 4 classes and limit the <supports-screens> tag in the manifest?
Is there a resolution that represent each of the dpi classes that I
should stick to?
I've done some reading about 9-patch. What's the point of using it if I still need to deliver a version for each dpi??
Thanks in advance!
The questions contain so much information.
1 Try to read the article and the references in it.
http://www.androiduipatterns.com/2011/11/design-patterns-for-responsive-android.html
You could also have a look at the web site for android design.
http://developer.android.com/design/index.html
In one word, designing for android tablets is more like designing websites. You cannot just design for one resolution.
2 Considering you are developing for tablets, it's necessary to support mdpi and hdpi. If the apps could be installed on phones, maybe xhdpi is also needed. It's not very strict.
3 dpi(dots per inch) = pixels per inch. So dpi is like density, it do not have strict relationship with resolution. But there is still a sheet could help you, try to find it in the following page
http://developer.android.com/guide/practices/screens_support.html
4 9-patch resource is very useful. With which a small png could stretch to any size without distortion. And it could also help to reduce the size of your resources.
In most situation, you do not have to make 9-patch for each dpi, since it could stretch to any size you want. But if the 9-patch png contain some information itself, like min height and padding, it's necessary to make different versions.
Here is what I would do:
See what combinations you have. There are mostly 3 resolutions for tablets (1280x800, 1024x600, 800x480) and mostly 2 densities (hdpi and mdpi). That is at most 6 versions. Select a few matching your most logical targets (I would choose xlarge mdpi (9" 1280x800), large mdpi (7" 1024x600) and normal-hdpi (4-5" 800x480) and design on these.
Some graphical elements don't need to be designed for each combinations, like backgrounds, may be buttons… Here comes the 9-patch. To be put in drawable-nodpi folder. One resource fits all.
Do one version first on you major target, then see how it fits on the other targets, and consider adjustments from there.
Use ScrollViews if you don't want to position every item pixel-perfectly on each device.