I'm finishing off an Android app, all that remains is to adapt the UI layouts and graphics for multiple devices. I need particular elements placed in particular positions on the screen.
The Android docs explain how the multiple screen resolutions and sizes are classified, and explain the resource tagging system.
For example, both WVGA800 (480x800) and WVGA854 (480x854) are classified as normal high density screens. To cater for these you're asked to create a folder called "layout" (already present for "normal") and "drawable-hdpi".
The problem is this does nothing to differentiate two devices of the same classification, even if you use "dp" units. How can you provide layouts/drawables for WGA800 and for WGA854 separately?
The ratios are sufficiently different that the user easily notices bad scaling, and this is exacerbated by my need for things like a score and timer to appear in a particular place against a background image.
The same problem applies to the pairs {WQVGA400 (240x400), WQVGA432 (240x432)} and {WVGA800 (480x800), WVGA854 (480x854)}. How can you provide layout/drawables for WQVA400 and for WQGA432?
I think you're on the road to hell.
Android runs on an enormous variety of devices, more every week, and many formats don't exist yet but will introduce new variables. So even if you succeed, one new device with a slightly different screen size, and your app will fail.
It's a mistake to design for Android using specific screen resolutions, and is similar to the issues you'd find if you forced all pages to be the exact same size on the web, it rarely works well (e.g. even a tidy fixed-width site will fail miserably on mobile devices).
Android has been designed to support all this variation, but if you try to get pixel-perfect absolute-positioned rendering on every screen size you are swimming against the tide. It is likely to be very painful, very time consuming and expensive, and likely to ultimately fail. Even if you succeed, how on earth will you test it on all these screen variants? It sounds like testing hell too.
I STRONGLY recommend you accept you cannot do everything as exactly as you need to, and instead look at how to use ways of rendering objects fluidly, relative to each other, so the app looks good in all the different variations, using the different layouts for each group of resolutions to improve the experience on different size screens.
YES, that's possible:
First you have to create a instance of the display-class.
After that you get the display's width and heigth.
Then you can check each resolution in a loop, by using the if operator and set the image you want.
Example:
ImageView iview=(ImageView)findViewById(R.id.imageView1);
//here are the Bitmaps optimized for each screen resolution
Bitmap[] bitmaps={BitmapFactory.decodeResource(getResources(), R.drawable.icwvga800),BitmapFactory.decodeResource(getResources(), R.drawable.icwvga854),(...)};
// In this list all supported screensizes are defined
int[][] possibleScreenSolutions={{480,800},{480,854},{240,400},{240,432},{480,800},{480,854}};
Display display = ((WindowManager) getSystemService(WINDOW_SERVICE)).getDefaultDisplay();
int[] ScreenSolution={display.getWidth(),display.getHeight()};
// Compare the real screen solution with the all supported ones
for(int i=0;i<possibleScreenSolutions.length;i++){
if((ScreenSolution[0]==possibleScreenSolutions[i][0])&&(ScreenSolution[1]==possibleScreenSolutions[i][1])){
iview.setImageBitmap(bitmaps[i]);// set the image
}
}
I agree with Ollie C: It's too confusing to check all resolutions, but It's at least possible.
I've tested it allready: It works.
Further to the answer/comments elsewhere on this page, I'd like to post another answer to my own question drawing attention to the type of screen resources that can be introduced. I'm not convinced this is made clear in the Android docs, but so far as drawables are concerned you can add screen size tags to drawable files on top of the dpi tag.
For example, adding a folder called drawable-large-mdpi is valid and devices with large screens and medium resolution will pull resources from here if they can. Warning though, switching the order of the tags matters: declaring drawable-mdpi-large is an error.
Related
I am getting very confused on how to support all different Android screen sizes. I have already checked this answer, this site, the official documentations and many other answers but still I am confused so please don't mark this as Duplicate.
I already created layout-sw120dp, layout-sw160dp, layout-sw240dp, layout-sw320dp, layout-sw480dp (I only need to support up to 6 inches so I don't create layout-sw600dp).
What do I have to do is just have one layout and just copy it in each different folder so Android will do the selection on its own or I also need to change values in each layout?
What do I have to do is just have one layout and just copy it in each different folder or I also need to change values in each layout?
You start by deleting the layout-sw120dp, layout-sw160dp, layout-sw240dp, layout-sw320dp, and layout-sw480dp directories that you created. Or, at least, ignore them for now.
You then start implementing your UI, putting layout resources in res/layout/.
Then, for those layouts that need to be different in certain scenarios, you then create a directory representing the size when you want a different layout. Copy the layout from res/layout/ into the new directory, and then modify that copy to reflect whatever changes you want.
In other words, one copy of every layout is in res/layout/, and you override where needed with additional, modified copies in specific directories where you need the UI to change.
If you want to use the same layout for each and every screen density, you don't need to create different folders. Use just one simply called "layout" and the system will interpret it for every density. However, this could lead to strange layouts on certain physical devices depending on their screen size and density...
Another point you have to be aware of, if your application supports orientation changes, is that you have to design layouts for portrait and lanscape orientations. This is done by duplicating a folder used for a density and add "-port" or "-land" to inform the systen which one must be used according to the actual orientation of the device your app is currently running on.
If you want to precisely define your app look and feel, you have to customize your layout for each density. And if you use bitmaps, you will have to customize them either (for example, your app icon should be defined with different sizes to keep a good looking for each screen density). Just as for the layout, you have to create "drawable-..." folders to contain the corresponding versions of your bitmaps.
This is an answer that's been an issue from old ages and for which you'll see lot many answers but which is not a one fit all type still. What I did come up with though when faced with the same issue was to use PercentRelativeLayout. This is a relatively new feature that was started from Android support version 23.0 (android sdk manager), and one of the big game changers according to me, since it allowed
developers to specify their blocks relative to the layout size Percentage-wise. And since it is in terms of percent, this fits all screen sizes with varying dimensions, but while maintaining the ratio.
Ofcourse this method involves some trial and error and a lot of experimenting, but I found this method to be the easiest to implement and which took out the headache of maintaining the dimensions for various screen sizes.
Few tutorials to get you started :
https://www.tutorialspoint.com/android/android_relative_layout.htm
https://guides.codepath.com/android/Constructing-View-Layouts
I am trying to get my game to look/scale well across different devices. I am attempting to introduce the dp and sp metrics into my apps as much as possible, but in this case I am refactoring a game to use these metrics for layout and widget sizing.
Where before, my layouts were sized using size_hint in order to have everything get it's size relative to it's parent(the app itself is not given a size, nor is the window, but the root widget/layout has size_hint=(1, 1)), I am now faced with replacing this system with dp values, and can't figure out what they should be.
I am thinking, that if I just size the root widget, App itself, or Window with dp, then I could continue to use size_hinting, as this would have a trickle down effect and scale everything correctly from the top on down, so to speak. And for this, It seemed like getting the resolution or density of a devices screen would be a great help(so I could use it to size my root widget/App/Window, per device). Is that possible with Kivy? Will this work? Is there a better way? What would you do? Thanks
Using size_hint alone already guarantees a degree of scale independence, as (as you note) all the sizes will be relative.
Kivy internally checks some resolution related values of the device, and this is basically the point of dp; something like dp(10) for instance should be the same actual size on any device, in terms of real size on the screen in e.g. centimetres. This won't actually be quite right, if nothing else I think devices don't report precisely right results, but unless this is very important it will already take care of making things mostly look the same anywhere.
I'm not sure what you mean about setting the App size - in Android's window manager an App just fills the screen (at least in most cases).
I have a client who wants me to build an Android version for their existing iPhone app. The design of the iPhone doesn't use any native iPhone elements. It's basically some sort of grid with containing images, buttons, text, etc. Of course it was easy to make the iPhone app because of the fixed pixels widths/heights. The basic grid that defines a screen is loaded via a XIB file, and I load the custom buttons in the right containers in the grid by specifying the exact coordinates.
Then comes Android...
Our client wants to target 3 specific tablets (1024x600). They have given us designs for a ~600x980 portrait version of the app. It is not recommended to use AbsoluteLayout in Android. What is the easiest way to make sure that I can scale it on different devices but that it will look like the given design on the 3 target tablets.
One idea I had (which I'm not sure about whether I can implement it) was:
Get screen width in pixels and height
Based on width/height ratio of the design, pad with bars on top/bottom or left/right
Still do an AbsoluteLayout based on this information
I'd rather not do it this way because it sounds involved and counter to the Android way of doing things. Another issue that is created by scaling is the following. There is a bar of buttons that have a lines separating them. These lines are 4 pixels wide. Obviously, when you start scaling, this is going to mess this up completely. I can't seem to find much information about this s
You probably want to start here:
http://developer.android.com/guide/practices/screens_support.html
But quick points are probably
Do not use an absolute layout. Your life will become terrible
Handle sizes in density independent pixels so they will scale properly on different devices
Use ninepatch images so that when images stretch they will stretch in the proper regions maintaining your 2px borders ect.
Take advantage of the different resource folders for images at different densities (drawable-mdpi vs drawable-hdpi) and layouts at different sizes (layout-small vs layout-large). The latter will allow you to have separate layouts for your tablet devices.
Best of luck :-)
I am creating an application which on one view has an image of an elephant. this elephant needs to animate various parts of his body such as eyes, trunk, spraying water, and also the background/horizon movements. I have briefly tried positioning each element(eye, trunk, etc) in a RelativeLayout using margins and relative positions so that the picture looks correct.
When i change the screen size via eclipse layout editor everything gets out of place. I read that using RelativeLayout with margins and relative positions will be the best alternative to AbsoluteLayout, but i can't seem to get each piece in the right spot while keeping some compatibility of devices.
What is the best way of positioning pieces of the image to complete a full image which will also allow me to animate/translate/rotate/etc each piece and support a large variety of devices?
I thought that maybe using OpenGL or Canvas might be the way this is done properly, but i don't see how these would resolve the problems i've mentioned.
I have created the iOS version of this application and it was extremely easy to set this up. I don't quite understand how applications line up sprites to make a scene which is compatible among a large variety of screen sizes/densities.
You will have to scale the elements of your big picture to fit the High , medium and low screen densities .
To do this you will have to resize each set of elements and copy them into separate drawable folders :
/res
drawable-hdpi
drawable-ldpi
drawable-mdpi
also you can create a dedicated layout for each screen category if needed but first try just to scale the images and copy them into the folders and launch your application.
A good link to see also : http://developer.android.com/guide/practices/screens_support.html
P.S: make sure to use dp not pix as measurement unit on your layouts , also the use of absolutelayout is not a good choice it's deprecated.
I have just finished designing my android app and when I tried changing the resolutions, to check if my app looks the same for all devices, I could not notice that the app's design is twisted in all of the resolutions with the exception of the resolution I design for.
Long story short: What can I do so my app will look the same for all resolutions and devices?
Well, there are a couple of issues you could be having but without examples of what's happening it's hard to tell where you are making the mistake.
Number one could be that you are using standard pixels instead of dip or are using absolute layouts or one of the many things mentioned in
http://developer.android.com/guide/practices/screens_support.html as referenced by both hardsky and bos.
Another alternative could be that you are simply thinking about your layouts incorrectly. For instance defining a views padding from the left in order to center it in the screen will totally fail when put on any screen with doesn't end up having dimensions which pan out to 320x480dip. Try to ensure that you are always defining your view placements by their intentions directly rather than a secondary attribute which pans out to be the same on standard resolutions.
May be different layouts for different resolutions?
http://developer.android.com/guide/practices/screens_support.html