Sorry but i cant understand how i can draw a right picture for the right android phone size.
I readed the android documentation, and they say for i just think in screen size and density and not in resolution, so what size should have my picture?
For example,if i have a phone with size 1000x400(stupid example),and want a button(40x40) that will be in middle,what size should i do?? 40x40?? But in documention they say for dont look for resolution :\
Im confuse...
ps: The documention link Android multiple screens
Basically you'll have to realize that although resolution, screen size and screen density are separate attributes, they are still somewhat related. If your button is 40x40 as you mentioned, and that's the size you find looks good in the center on a hdpi(high density) device, you will have to scale it so that it fits accordingly on mdpi(medium density) and xhdpi(extra high density) devices. What I like to do is use PhotoShop or another graphical editor and resize my assets so that they fit on whatever density devices I'm trying to target. I make sure to always use *WRAP_CONTENT* for my height and width attributes and never fixed values.
Also, if you do not include these scaled alternatives in your res/drawable folders..you're basically saying that you're relying on the system to scale them for you, which can be a gamble. So I always go with resizing my assets so that I include a version for all densities. The link you posed explains everything pretty well
Related
I have read Android guidelines regarding different screen sizes, but still I have some considerations.
Client has given me an image from PSD file which has certain resolution that fits
1080 X 1920. I just use wrap_content, and it perfectly fits the part
of screen.
I am not using DP to define its width-height, If i was using DP it would have
adjusted image according to screen sizes.
My questions are,
Does wrap_content works the same way as Density Pixels?
Is it also responsive, and changes the image width-height according
to different screens?
If not, then Is it necessary to use DP to support different screen
sizes ?
Thanks
The setting wrap_content tells your view to size itself to the dimensions required by its content. In the case of your test, your image is 1080x1920 and your device's screen resolution is likely 1080x1920 as well, hence the perfect fit. Since you set the width and height to wrap_content, Android is simply trying to use as much screen space as it needs to correctly display the amount of content it was supplied. In this case, since the available screen space matches the size of the content, it just fits perfectly.
But what if the device screen isn't 1080x1920? In that case, Android will only use as much space as it can, but still attempt to fit the image inside the bounds of the available screen space. In other words, the system will appropriately scale the image down to get it in the container you have provided for it. But this can lead to awkward fits if the aspect ratio isn't the same as the image. For instance, see this screenshot below:
This image is 1920x1080, but notice that it doesn't quite fit. That's because this nexus 7 screen is 1824x1200 when viewed in landscape. Additionally, the toolbar at the top of the screen is eating up available screenspace, making my viewable area even smaller and more awkwardly shaped. So while the system would love this image to extend all the way to the left and right borders, it can't, because then that would mean the height would be bigger than the viewable space. Since I used wrap_content to display this image, the system is using as much vertical space as it can, and the result is that the image doesn't quite fit the horizontal space.
So to more directly address your questions, yes wrap_content is a relative size setting that will make it easier to get a consistent look across multiple screen sizes, similar to using dp. But realize that there are hundreds, if not thousands of available Android devices on the market, and they all have varying screen sizes and densities. So your drawables may not always appear the way you want them on every device.
The way to overcome this is to supply multiple versions of your assets and provide alternate layout files for different screen sizes and densities. Once you do that, all you can do is test, test, and test some more. Use emulators for weird screen densities or devices you don't own, just to make sure you're getting the look you want. In the case of your 1920x1080 image, it looks great on that one device, but how will it fit a large tablet or a tiny handset that is smaller than the resolution of the image? These are situations you must account for in your design.
I suggest you read these resources, as they are hugely helpful in learning how to deal with issues resulting from varying screen sizes and densities:
http://developer.android.com/guide/practices/screens_support.html
http://developer.android.com/training/multiscreen/screensizes.html
What is the applications screen size without the status bar and softkeys(in some phones)?
Like for Example i know:
320X480 trimmed down to 320X455 which is the basesize.
but what about others , i have done many calculations and a lot of searches online to figure out a defined size for other screen but i seems can't, Also While applying the formula *.75 ldpi, *1.5 hdpi, *2.25 xhdpi to get other screen, it doesn't add up.
Like 320X480 is mdpi to get the hdpi do *1.5 and you will get 480X720 which is not the situation for devices out their ! and using this method my application images where stretched, this method is according to the Google documentation, i'm confused as hell.
I have tried to et sizes using the emulator also it was very different! for height.
So if the problem is with height only, i'm thinking creating background as patterns and then work only on the width of the screen size and re-size every other elements to screen width only like 240px, 320px, 480px, 720px and also consider the size of them to fit minimum height.
I believe it's not possible to define a height for android which will go like generic because of the variety of android devices.
So what do you think about this approach to use background as pattern and forget about every device on earth height ?
you can use tile pattern, create a small texture and then make it tileable drawable in xml, so it will be tiled across screen, or the second might be using 9-patch images, in that way you can select which area of the image scale and which area to not scale, so they will be scaled according to that way.
Currently i'm trying to develop a mobile app for the Android devices (using Appcelerator).
There are alot of Android devices out there with different screen resolutions. So i basically want the app to look the same on every Android device.
So suppose i have a background image in the center of the screen. Which is (in pixels) 550x300.
I just tried to set the width and height of the imageviews to dips (density independent pixels). So in my case to: 332dp x 226dp.
I tested this first on an HTC One X. In there the image in nicely centered and i have a small space left on the left and right side to the edge of the screen.
Then i tested it on a slightly older device, the HTC Desire Z. In there the image width is a little bit more than the actual width of the screen. (example screen. The blue square represents the image)
So that means setting the width and height as dp isn't a good choice either for images.
What would be a good way to set the image width and height so that it looks the same on both phones. i.e., so that they both have a small white spaces on the other edges of the image left (like i have now in the HTC One X)??
Any advice on this matter?
edit
Thanks for the info so far. Some of you posted links to resources etc and made some suggestions. I'll try to work them out in the next few days, so i might take a couple of days before i accept an answer. In the mean time, any ideas suggestions are welcome.
Use the various drawable folders, i.e. drawable, drawable-large, drawable-xlarge to store your image assets for your background in various sizes. Review http://developer.android.com/guide/topics/resources/providing-resources.html for more information.
Also refer to Android: Scale a Drawable or background image? for helpful information.
I would recommend using a size to fit.
in objective c it looks kinda like this... not much of a android programmer but this may help.
CGRect frame = _textView.frame;
frame.size.height = _textView.contentSize.height;
_textView.frame = frame;
so if you could figure a way to get the frame size then you could set your image to that size any way the view is positioned.
and if you dont want it to take up the whole screen and just the sides then there might be a autoresizing function for android this way your image will be flexible with your frame which will vary based on the phone size.
I think the is problem is not that the image is wider, but the screen width of the phone is smaller on the HTC Desire Z.
I think the best way fot the image to look the same on all devices would be to set width/height programmatically.
But I think this doesn't really matter, as you will encounter much more complicated problems further wil developing for multiple devices. Both look good IMO.
What I would is set your android:layout_width to fill_parent and then add a android:layout_marginLeft and android:layout_marginRight in dip. You can also set a margin for the top and bottom, but based on your screenshots that doesn't seem to be an issue.
As a general rule, try to avoid setting fixed heights and widths for your widgets. Here is a great reference for dealing with different screen sizes:
http://developer.android.com/guide/practices/screens_support.html
So i basically want the app to look the same on every Android device.
No you don't. You think you do, but you really don't. That's like trying to fit a photograph in a 4x6, 5x7, and 8x10 frame -- something's gotta give. You have small phones, medium phones, large phones, 7" tablets, 10" tablets -- these are not the same experience and you simply have to allow some leniency to the design to make it work. If you just want a specific amount of space outside of the image, just give your ImageView a specific margin in DP units, e.g.:
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dip"
//...
/>
You should be striving to make the experience the same (although different layouts for tablets are highly recommended) but you can't expect it to look identical across all screen sizes and densities.
I'm writing a game for Android and can now test it on a second device, the Nexus 1. The game uses fix pixel-values, just using bigger cutouts of the background for high-res devices. So I thought there would be no problems. Somehow, however, the nexus 1 is making a specific image bigger than it should be (261*66 instead of 174*44). The picture itself as a resource is 174*44, so it's being stretched. Why? What can I do against it?
Edit:
Spritesheet = BitmapFactory.decodeResource(res,
R.drawable.bird_spritesheet);
Is the used code.
Edit 2:
Is there no way to tell the software to just use the size the picture is? I don't want to bloat my software by adding multiple pictures (/drawable-hdpi/ answer).
The pictures are supposed to be smaller on bigger screens.
what drawables folder to you have the picture in? If you put a copy of it in drawables-hdpi I think it will show up real size. It is really better to set things up in such as way that the final size in pixels it ends up is unimportant. Using pixels values is going to ensure that your app looks wrong on at least some of the screen sizes out there.
Because Android runs on multiple screen sizes and you use device independent pixels (DIPs), images get scaled to ensure they look the same on all devices. To avoid this, you can provide alternative resources for high density screens (in your case) and for low density screens.
More info about screens here
I do not really understand all those things about pixel density and device independant pixels and I want to know if I should worry about this.
More specifically, here is how my application work right now:
For the “layout screens”, I’m using RelativeLayout or LinearLayout and I never use pixels or dp, so I guess that this will look good on every device
For the main game screen, there is only a SurfaceView on the screen. With the values given by onSurfaceCreated() (pixels or dp? I don’t know), I compute the size and position of every element of the game, then I load the Bitmaps (with BitmapFactory.decodeResource() and then Bitmap.createScaledBitmap()) and put them on the screen with drawBitmap()
I tested on my phone (480 × 800 hdpi) and on the emulator (240 × 320 mdpi), and both looks good.
My questions are:
Is this the right thing to do? I do not understand how (and why) I could use the fact that some devices are hdpi and others are mdpi.
Should I provide different bitmaps for different screen densities, and why? (right now I have everything in res/drawable-hdpi)
What size should my .png have? Can I create them much bigger (2 ×) than their expected size, in order to be sure that this will not look blur or aliased?
My knowledge about this is limited, as i never developed games.. as i supposed you are doing.
Is this the right thing to do? I do
not understand how (and why) I could
use the fact that some devices are
hdpi and others are mdpi.
With this information you can load different images automatically. You can you the directories:
drawable-hdpi
drawables-mdpi
...
Should I provide different bitmaps for
different screen densities, and why?
(right now I have everything in
res/drawable-hdpi)
If you have all in hdpi then the images will be shrinked i think, to be smaller due to the lack of specific images o that scale. Providing the images will give you more control over the final product and it will spend less processing.
What size should my .png have? Can I
create them much bigger (2 ×) than
their expected size, in order to be
sure that this will not look blur or
aliased?
I think they can be exactly the size needed. But as i said above.. not much experience.