I am currently working on an android app that is causing me some trouble. My app is heavily dependent on images that are fitted correctly to the screen they are being displayed on. Unfortunately things like the FWVGA/WVGA resolution difference 854 vs 800 is causing me some real problems, and that's aside from the other sizes/densieites and resolutions.
I don't know if I'm just missing the point here but how do I go about having my app display correctly on both the resolutions without either "squashing" my images or cutting bits off of giving me black bars etc?
There doesn't seem an immediately present solution where I can just have it display a different image automatically from the drawable folder for the right screen.
I have tried using displaymetrics but unless i have my manifest claim that it supports all screen sizes, the android OS will in fact "lie" to my app about hte current resolution.
Someone please tell me there is an easy solution.
how do I go about having my app display correctly on both the resolutions without either "squashing" my images or cutting bits off of giving me black bars etc?
IMHO, you start by revisiting your GUI design:
My app is heavily dependent on images that are fitted correctly to the screen they are being displayed on.
That does not work particularly well anywhere, IMHO. Windows (including browsers) can be sized to any desired size by the user, for example.
There doesn't seem an immediately present solution where I can just have it display a different image automatically from the drawable folder for the right screen.
Because Android devices can have any number of screen dimensions, just like windows and Web browsers can have any number of screen dimensions. Android does let you choose images based on density (e.g., -hdpi) or screen size (e.g., -large), but these do not map to resolutions, nor should they.
As CommonsWare pointed out, your best bet for this situation really is to rethink your layout structure. It's probably possible to accomplish similar, if not identical results to what you currently have, using RelativeLayouts and widgets. If you're willing to post a sample, we could advise you on ways to do so.
That said, an answer to your question would be to query the device at runtime for its screen resolution (keeping in mind space taken up by the notification bar, as well as the title bar - unless you theme it without a title bar). You would need a different image for every possible screen resolution, and as more devices (notably tablets) begin to release, you're going to have to continue to provide more images and customized code for each different image as they release. You can see why this is not an ideal situation.
DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
int screenWidth = metrics.widthPixels();
int screenHeight = metrics.heightPixels();
Then you can place that into an if-then-else block, and determine the resolution, and set the image accordingly. I don't recommend this.
When it comes to displays and resolutions, it is not possible to have your images resized to any aspect ratio without either squishing / stretching them, or using letterboxes. I know this doesn't really answer you question, but if you can't get reliable screen size information from the OS, then try picking images for the largest resolution and cropping them for the smaller resolutions. Just make sure there is nothing interesting around the borders.
Related
What if I wanted to use a set bitmap size and with every device's size it gets it stretches to that appropriate screen size. Would this work in a practical environment like the google market for all if not most phones?
Can someone please clarify how this screen compability works.
My question is if it would work. Would all phones allow this bitmap/image to be stretched on all devices with no problems?
Thanks!
It could be stretched, yes. Without problem depends on the image. Some possible problems you'd see are pixelation (if magnified too much) or skew if the aspect ratio changes. A 9 patch may fix that for a large range of sizes, but may or may not work well for your image. The best thing to do is to try a single image, then move to a 9 patch if needed. If that still doesn't work then you can include multiple images for different screen sizes. Android has a built in system for changing resource files based on a variety of factors, including screen size.
I designed my app for phone. If all I want for it on Tablet is just to scale up everything (i.e. bigger images, more distances), Is there a way to ensure this happen when doing my XML (or in the code)? Or should I create a different xml for xlarge screens?
I always come across the question and don't know the answer. Please don't refer me to the documentation of supporting multiple screens because I read it many time and it shows how you can customize for diff screen sized. In my case, I just simply everything scaled up keeping the same ration as the phone
Thank you
As we know it there are several screen layout out there on various android devices. Now, my question is, what's the best solution for displaying image on screen (full sized image) on that various device?
Should I (this is several strategy I have in mind right now):
resize every images for that target device? (with the cost of resizing it and lost of quality on larger device)
create several images for all or several common screen size? (with larger download size)
create core application and let them download images appropriate to that screen size (that means, I have to prepare hosting of those images)
something I don't know yet...
So, if you guys have experience in this kind of situation, your recommendation is greatly appreciated.
Update: My application will have several (20-30) images.
This is documented ( http://developer.android.com/guide/practices/screens_support.html ) and answered quite a few times already I believe.
Create different images for the different screen resolution (store in drawable, drawable-hdpi... accordingly).
You can also define different layouts for different screen sizes (although to display full screen images, it does not sound like you need that).
I have a client that gave me a .psd file that contains the entire screen of an Activity with all the graphics. The resolution is 480x800. The client wants the application to look identical to the one in the .psd file. The problem is that different devices have different resolutions and sizes. I know that the density is what really matters but how can I scale the graphics to look the same on all the devices? For example, I exported all the layers and recreated the screen in Android but, for some reason, the screen looks more crowded on a Nexus One (480x800).
One idea would be to create 9 patch images from the graphics and use for ImageViews android:background instead of android:src right?
Isn't it better to have a 320x480 resolution for the graphics? Or do I need for both resolutions? Also, I have to consider the height of the status bar which I understood it is 25dip but I am not certain about this.
So, to summarize, I am interested to find out what is the best way for a client to give you the mockups and graphics so that it is easy for the developer to implement according to the specifications.
That's something that's not easy to solve. Think of a webdesigner, one can't know all the possible resolutions and settings of every browser so he has to scale things accordingly.
In my opinion there are only three approaches here.
First: Let him state what devices he wants to support and only support those devices. Extract the layers with the size of the device with the highest resolution and scale them down on other devices.
E.g. If you have to support two devices with 480x800(2) and 240x300(1), export all images to be 480x800 and scale them down accordingly. Don't write a single application for every device.
Second: Export the graphics with the highest resolution possible and scale them down on all devices relative to the device being used. Imagine, again, a webdesigner. All he does is define margins, paddings, etc. and it will look nice in almost any browser. You should do the same and resize your elements on demand.
Third: Make the application fixed, e.g. define a size of 200x200 for your whole application and just fill everything larger than the screen with a certain color, e.g. black. This happens a lot with java ME applications, they look great on the hardware they were made for and are still playable on hardware that is beyond their time though they look pretty ugly.
Hope this helps,
Robin.
I've determined an estimate of the size of my Android emulator's screen in pixels, although I think its resolution can be changed to other numbers. Quite frankly though that doesn't eliminate the general problem of not knowing how many pixels on each axis I have to work with on my Android applications in general.
The main problem I'm trying to solve is this: How do I make sure I don't use a faulty resolution on Android applications if I want to keep things' sizes constant (so that if the application screen shrinks, for instances, objects will still show up just as big - there just won't be as many of them being shown) if I wish to do this with a single universal resolution for each program? Failing that, how do I make sure everything's alright if I try to do everything the same way with maybe a few different pre-set resolutions?
Mainly it seems like a relevant question that must be answered before I can come across a complete answer for the general problem is how big can I always make my application in pixels, NOT regarding if and when a user resizes the application's screen to something smaller than the maximum size permitted by the phone and its operating system.
I really want to try to keep this simple. If I were doing this for a modern desktop, for instance, I know that if I design the application with a 800x600 canvas, the user can still shrink the application to the point they're not doing themselves any favors, but at least I can basically count on it working right and not being too big for the monitor or something. Is there such a magic resolution for Android, assuming that I'm designing for API levels 3+ (Android 1.5+)?
Thanks
Hmm, I suggest you read this: Supporting Multiple Screens. That gives a wealth of information on how to handle different screen sizes. In particular, read about its concept of density independent pixels versus absolute pixels. Density independent pixels are essentially pixel sizes that the system automatically scales for you depending on the screen size you're working on. It considers the 'standard' screen as that of the G1, Hero or similar devices, i.e. 480x320 pixels with a density of 160dpi. If the screen you're working with is bigger than that, i.e. the Droid or Nexus One, it adjusts all density independent pixel sizes by 50%.
Alternatively, if you're really talking about canvases, as in, Canvas for animations etc, you can just call canvas.getWidth() and canvas.getHeight().