I want to set a background image to my Activity. I am just using an imageView in a relative Layout and position the other elements as I want them. Now we have a million, or at least quite a few, different screen sizes and densities. I wonder how I can achieve having the right image for all these devices.
I don't want to scale/stretch my image.
The image is in a way that it is lets say 2000 x 2000 pixels (or whatever you like) it doesn't matter what part of this image is displayed. In other words I could crop any needed image size out of this extra large image and display only that portion.
How can I achieve this?
Thanks,
A.
Just set your image view android:scaleType="center" and it won't scale or stretch.
Have a look at the scaleType options at the following link. This gives you a decent amount of control over how an image is rendered.
http://developer.android.com/reference/android/widget/ImageView.ScaleType.html
Also have a look at the following link. You can provide resources with the same file names in different folders, and the system will choose the most appropriate. This way, you can know more or less what size screen you are targeting with each image and you can create your images at a size that will perform the least cropping (or possibly no cropping at all).
http://developer.android.com/guide/topics/resources/providing-resources.html#AlternativeResources
Related
I created an image to use for an android splash screen and it displays properly on my phone however when I open the app on a phone with a larger screen it pixelates. So I was wonder if I should create more than one image and if so what sizes should I set for other images because I know I can't use the same sizes as I used for the app icon?
If the images are pixelated
then you need to add larger images for each screen size under your
res folder. sizes depends on your target
or
scale the images. to be safe, make it bigger
it might help you: am I supposed to make images larger for tablets, or same size as handset?
you could probably use draw-9-patch to state which area of the picture can be extended.
Google draw-9-patch
I worked with two approaches so far:
Screen composition
One approach can be using a composition of brackground and a logo. You can have the logo as big as you need (for high resolution screens) and the background as a repeatable texture (it all depends on your design approach) or a gradient or other composition (less prone to pixelation errors).
As big as possible approach
If one image is your approach, you should do a research to know the currently most used and biggest android screen used (https://developer.android.com/about/dashboards/index.html). Knowing that one, you can design your image for that [high] resolution and set the scaleType as CENTER_CROP. With that, you will ensure that the image will be centered, inside the screen, keeping aspect ratio, and at its highest resolution [keep an eye about logos/graphics positions if you want to be sure that they remain visible even in thin screens).
For icons, the best way is Draw 9-patch
Otherwise, you need to scale the images into drawable-xx (res directory), here the explanation
i'm working on an Android application and i'dd like to put a background image. my problem when i set the android:background is that the image is show on all the screen.
i'dd like to have my background on only 50 % height and wide.
thank you
This depends on screen size of devices. I recommend that You read about supporting multiple screen sizes:
http://developer.android.com/guide/practices/screens_support.html
You can also do this programmatically, but is a bad practise. To get the result You want, You have to set a layout.xml for every screen size. It is also recommended that You better put that image inside an imageView, because of a good scaling on different devices.
I hired a designer to help me redesign the UI for my Android app. For each Activity he gave me an image for the background, which includes any static content like fancy frames for text content; plus images for the buttons, which must fit in to the background image in exact places, to fit into the frames in the background image.
However, since Android devices have different screen sizes and aspect ratios, it's easy to fit the background image by itself with android:scaleType="centerInside", but how can I get all the other images to fit in with background exactly, to the pixel? If they didn't have to fit in with the background, I would just set the exact width and height for each ImageButton, but depending on how the background scales (based on the screen size and ratio) they might end up not aligned correctly.
Thank you very much in advance.
Update:
Is there some way I can have an entire view (e.g. a RelativeLayout) scale inside the screen, like the way the image scales inside the ImageView with scaleType="centerInside"? If so, I would be able to set the RelativeLayout's size to the same as the background image, and put all of the other buttons / images in their places relative to the background image, and then just have the whole thing (the RelativeLayout containing all the other views) center inside the phone's screen.
Your approach is wrong (or at least bad), because android devices offer screens not only with different sizes but also with different densities. What you shall read now is Designing for Multiple Screens first. Then understand that non scallable bitmaped UI will rather not work as you imagine. You need to support screen sizes which means your UI elements (like i.e. buttons, lists, headers etc) shall scale. There's lot of possibilities to deal with this, one is using 9-patch bitmaps (randomly chosen tutorial on the 9-patch).
Also, please read this article: Supporting Multiple Screens
When desining UI it suffices to assume you design for mdpi density. Once your layout is done you create drawables for i.e. mdpi and hdpi (and put under the same names into res/drawable-mdpi and res/drawable-hdpi respecitvely). Layout files remains unchaged but framework would automatically pick right asset so your UI will look sharp as long as you provided drawables for that density. Please see Providing Resources article as well.
I'm trying to figure out the best way to display 1 of 54 bitmaps in a ImageView . I figured I could load in a bitmap from the assets. But I can't figure out how to size it. When it loads it from the XML file, it chooses 1 of 3 different bitmaps, each a different size.
I can't figure out how to determine what size bitmap to use. I know how to get the width and height of a View, but not the whole screen. Is there a way to get the screen resolution?
All so I know how to set the bitmap property of a ImageView, but I could not find anything for scaling. Is there a way to scale it, or will I need a separate bitmap for different screen sizes?
This seems like it should be simple, but turning into something very complicated,
Is there a way to get the screen resolution?
Can I scale the bitmap a ImageView displays?
Is there a more easy way to do this?
You have a bunch of questions here and I'm not clear on what you're actually trying to do, but the answers to the questions you ask last are:
"Is there a way to get the screen resolution? "
Sure...
getWindowManager().getDefaultDisplay().getWidth()
getWindowManager().getDefaultDisplay().getHeight()
"Can I scale the bitmap a ImageView displays?"
An ImageView is just a container, so if you set its width and height and then load Bitmaps into it, they will scale to that Width and Height.
If you set its layout_width and layout_height to to wrap_content instead of a specific dimension then it will conform to whatever the dimensions of the image are (and grow and shrink as the different bitmaps are loaded). If you're worried about different screens you need to put your images into different folders (with the same names), for different resolution devices, as per the documentation here: http://developer.android.com/guide/practices/screens_support.html
Bitmaps can be scaled any way you like manually as well using a Matrix. This is a little bit more complicated, so, I'll not venture to give examples until you clarify your answer and express an actual need for this.
what about nine-patch images.
Can they be used instead of the ?
/res/drawable-hdpi/icon.png ….. 72×72
/res/drawable-mdpi/icon.png …. 48×48
/res/drawable-ldpi/icon.png …… 36×36
What are the benefits/drawbacks?
Technically you don't ever have to provide an image for all three resolutions- if one is missing, the system will replace it with one of the others. Though it's usually better to have all three for maintaining appearance across all screen densities.
9-patch can be used instead, but should be only under specific circumstances. If you have an image for a button that expands but preserves the corners, keep in mind these corners are going to look much smaller on a high resolution screen if you don't provide an hdpi version. But the size of the image itself will still expand according to the specified stretch areas.
So in a nutshell: 9-patch does allow an image to expand as needed independent of resolution, but the non-stretchable parts of the image will not be magically converted to higher/lower resolutions.