Android mdpi drawables for use on both Droid phone and Xoom? - android

I have an app developed for a Droid (phone). In the app, I use:
Bitmap b = BitmapFactory.decodeResource(getResources(), R.drawable.bg);
To set the background bitmap in the application. The bitmap is sized 480x800
which is the WVGA screen size of the Droid (without status or title bar).
Two questions:
When I rotate the phone, the Droid goes into landscape mode and the background no longer fits correctly. How do I tell the App it needs to use landscape mode when I'm not using a layout?
Second, when I run this app on the Xoom, it picks the mdpi drawable which is nowhere near the size of the Xoom screen. How do I define a second mdpi drawable that has a 1280x800 size? I think if I were using layouts, I would create a layout-xlarge directory and place a 1280x800 background in the imageview of that layout, correct?
Thanks!
Update *:
Thanks for the great answers! I upvoted everyone.
I updated the code to use drawable-xlarge-port/drawable-xlarge-land for the Xoom and drawable-port-mdpi/drawable-land-mdpi for the Droid.
I'm not using layouts as I needed to draw directly onto the activity canvas and not sure how to use setContentView() from within the class where I extend View and hook into onDraw() in order to do the animation (would need to be a separate posting).
If I can figure out how to rotate the image myself I could indeed do away with the drawable-*-land and *-port directories.

You can target drawables, not just layouts. You want drawable-hdpi-large-long-land for the first situation (assuming you're letting the system handle rotation events and recreate your activity), and drawable-mdpi-xlarge for the second.
Of course it's futile to try to ship with a separate image for every conceivable phone resolution; partially because there's a lot you'd need, and partially because some targets aren't differentiable (the 854x480 and 800x480 phones out there are all hdpi-large-long, for example, despite the 54px difference). Try to use a scaleable image, a stretchable 9patch, or an image you can just fix at the top-right corner (you can define stretch behaviors using an XML-defined bitmapdrawable).

When I rotate the phone, the Droid
goes into landscape mode and the
background no longer fits correctly.
How do I tell the App it needs to use
landscape mode when I'm not using a
layout?
If you alreay detect the rotation, then the Device class is the way to go.
Second, when I run this app on the
Xoom, it picks the mdpi drawable which
is nowhere near the size of the Xoom
screen. How do I define a second mdpi
drawable that has a 1200x800 size?
You can use various image folders dependending on the resolution of the device: ldpi, mdpi, hdpi or xhdpi. You should take a look at the following page for proper support of various resolutions and screen sizes.

That's just about right. You can mix in portrait, landscape, and other modifiers, too. Don't forget to use them with your drawables as well as your layouts (and any other resource directory, for that matter). If it's the same layout and different drawables, then you only need to apply it to the drawable, for instance.
You'll want to look at the documentation for resource directories and make use of the size and orientation directory modifiers.
For example:
drawable-land-mdpi
drawable-xlarge-land
layout-port-mdpi
and such
For more information, see:
http://developer.android.com/guide/topics/resources/providing-resources.html#AlternativeResources
http://developer.android.com/guide/practices/screens_support.html#qualifiers

Related

How do I set an image as background without blurring?

I am using Android Studio. I am trying to set a screenshot from my device, as a background image for my activity -
android:background="#drawable/active"
I have my image inside the directory- res> drawable-ldpi> active.jpeg , Which Is the lowest density folder available I am aware of. The problem is, The background looks PERFECTLY crisp and sharp in the screenshot, but when I set it as my activity's background, it blurs.
How do I fix this? I have tried moving the image to the highest density folder drawable-XXXhdpi, but it becomes worse. I have even tried the drawable folder.
All depends on your phone density. You should make few version of your image for each pixel density (but remember that even mdpi is growing older). If you properly resize image for each density your phone should take needed size of background.

Use non-fullscreen image for splash screen

I'm using the approach described in Creating a Splash Screen. It uses a resource (layer-list) with a background and an image. That is used as windowBackground in a theme and this theme is set on an activity. Now I created all drawable folders and put images of different sizes in there.
Now I have these issues:
starting app in landscape on smart phone leads to a black splash screen (on tablet it stays in portrait)
images from drawable-land folder are not taken
the size of the image should be bigger on some devices
In which resolution should I provide the images? The image should have one third of the width of the display width. How can I manage that?
I tried to use this table as reference and calculating the width by taking one third of portrait size. E.g for HDPI, one third of 480 is 144, but the tablet has a width of 800 (not 480). As consequence the image is too small.
Furthermore I don't think that 9-patch files could help me here. It only describes the enlargement, but then the lowest common denominator would be an image of size LDPI ... Enlargement doesn't work so good for a text logo (custom font).
What are my options?
Edit:
starting app in landscape on smart phone leads to a black splash screen (on tablet it stays in portrait):
Adding a break point and the splash screen is shown instead of a black screen. Building an apk and installing on the smartphones works. Debug mode not.
images from drawable-land folder are not taken
Added ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation) and now they are.
But I still have no clue how to define an image, which does take a certain amount on the screen with this approach. For now I supplied a bigger image (xhdpi into hdpi) ...
you should put those images in mipmap folder not at drawable. You have to crop image into three size hpdi,ldpi and mdpi. These theree are best for any android devices.(Fits for all). If you want to display image in full screen then you can define android:background="#mipmap/image" instead of android:windowBackground="#mipmap/image" . For preventing splahscreen from being landscape you can define screen orientation inside activity like below:
<activity android:name=".Splash_Screen"
android:screenOrientation="portrait">
If you doesn't know the required resolution for image ldi,hdpi and mdpi then there's question asked on stackoverflow, google it!! Hope it helped and sorry for poor english!!

Android layout on high density displays

i just released my app on android and have problems with customers with high density displays.
i added a debug thing to see what's going in, here is one sample output
Device: Nexus 10 Android version: 4.2.2
DisplayMetrics{density=2.0, width=2560, height=1504, scaledDensity=2.0, xdpi=298.275, ydpi=298.823}
MainView w=1900 h=1342
mDrumKitMode=BIG
KitView w=640 h=1266 x=1920.0 y=0.0
the main view is the music notation area on the left of the screen shot, its 1900 wide (MainView w=1900 h=1342) the drum kit is a bitmap that is 640w and 640 high. somehow, the display is scaling it to be full height of the parent, (KitView w=640 h=1266 x=1920.0 y=0.0). this doesn't happen on displays where density=1.0.
i have no way to test this since i can't get the emulator work on big displays for some reason and i don't have a high density tablet.
does anyone have an idea what could be going on? thanks
and here's another customer with a similar problem
Device: A700 Android version: 4.1.1
DisplayMetrics{density=1.5, width=1920, height=1128, scaledDensity=1.5, xdpi=224.73732, ydpi=224.11765}
MainView w=1260 h=1044
mDrumKitMode=BIG
KitView w=640 h=968 x=1280.0 y=0.0
i think its the scaledDensity=1.5 parameter, maybe i need to do something to disable automatic image scaling, i.e. set scaledDensity=1?
i should add that the entire application is based on exact pixel positions, both for the music notation display and the drum kit display which overlays images on top of the base drum kit image (you can see the drum pedals are in the wrong place on this image too). i don't want automatic scaling as i handle scaling inside the app for different display sizes and user preferences.
i should also add that all my drum kit images are in drawable-mdpi and all the other dpis are empty. this is because i scale images programmatically based on screen size and user preference BUT i think maybe the problem is a need to put some images in xhdpi? i guess i can do that but it will be a lot of work.
PS, i guess i found my answer here http://developer.android.com/guide/practices/screens_support.html
Provide different bitmap drawables for different screen densities
By default, Android scales your bitmap drawables (.png, .jpg, and .gif files) and Nine-Patch drawables (.9.png files) so that they render at the appropriate physical size on each device. For example, if your application provides bitmap drawables only for the baseline, medium screen density (mdpi), then the system scales them up when on a high-density screen, and scales them down when on a low-density screen. This scaling can cause artifacts in the bitmaps. To ensure your bitmaps look their best, you should include alternative versions at different resolutions for different screen densities.
i wonder if simply copying all the -mdpi images to -xhdpi will work?
If you intend for this app to be used across devices you have no choice but to put in images for all the various density folders that exist (xhdpi,xxhdpi, hdpi, mdpi). It's also worth considering that you may want to change the actual layouts you include, to offer different ones for different devices.
Consult the documentation for how to handle this.
http://developer.android.com/guide/practices/screens_support.html
If that creates an apk that's too heavy (I have no idea how many images you have) then you can go the other way and specify a no scaling drawable folder which will just use the images in their native density across devices. It's definitely wrong to use ONLY mdpi unless you intend to support only mdpi devices.

Android, my app looks good on vertical screens, but size is all distorted on tablets (wide screen)

When my android app gets drawn on a tablet or a emulator that has a wide screen (wasvga,wxcage800 and my tablet) it draws the graphic images from the drawblw-ldpi folder (low res) instead of the drawl-hdpi folder. I'm curtly using a bitmap button. They are all very small (since the smallest image is being drawn) on the tables, but the correct image gets drawn on all the vertical screens.
Why is this????
Is there a way to fix it????
The default folder is the mdpi folder. If another folder doesn't exist, or doesn't have your image, android gets it from drawable-mdpi. Put your images there, and let us know if it works.

how to get crisp graphics on android device

I'm a visual designer creating a UI for an app for an android tablet. The resolution of the tablet is 1024x600 with a density of 160 - I'm building the UI in photoshop on a 1024x600 72dpi canvas - Is this right? I've seen some previews on the device and the graphics that are super crisp on my monitor are kinda fuzzy on the device. I would have expected them to be even crisper.
The app wont need to support any other devices so its not a question multiple resources -
Can anyone shed some light as to best way to approach? This is my first mobile project so still learning the ins and outs ; )
Guides from Samsung. Bet you also developing for that?
If your UI is in 1024x600 pixels (in photoshop), it should be no problem. I think the problem may come from a few other issue:
density of 160 is called mdpi in Android, make sure you put the pictures to drawable-mdpi folder;
Are you sure your picture/graphics isn't stretched by the Android layouts? For example, you may have a button in 100x100 px, but in the layout, it is defined like "fill_parent" or "120dip", then, it is stretched and not in native density. The native density for 160 dpi, will be exactly the same as pixel size, (1dip = 1px in 160dpi), so, your button should be "100dip" (or simply use absolute size to get rid of this trouble)
I think you may do a simple test, making a 1024x600 px image (PNG), and put this as the background of the activity, and set the activity to be full screen without title bar. It shouldn't have any problem in showing in this way.
One last word, I actually do my final layout in Fireworks, it has better pixel level control in terms of small UI graphics. But photoshop should also able to do the job.

Categories

Resources