How can my Android app be optimized for different screen resolutions? - android

i'm building my first app and i wanna make the app to be optimized for all screen resolutions.
So, i'll tell you what i think i should do -in order to make my app work- with what i've found so far, but i don't feel like i've understand that despite some relevant posts that i read.
I've made the background image at 480 x 800 pixels for high resolution (hdp), 320x480 for medium res (mdp), 240x320 for low res (ldp) and 600x1024 for xhdp(??).
Then, if i put each one on the right folder in the "res" directory...for example "drawable-hdpi" for high resolution etc...will it work?
Are these the right dimensions?
Here is my Manifest.xml:
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.etking.winningnumbersgenerator"
android:versionCode="1"
android:versionName="1.0" >
<uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="19" />
<supports-screens
android:smallScreens="true"
android:normalScreens="true"
android:largeScreens="true"
android:anyDensity="true" />
<application
android:allowBackup="true"
android:icon="#drawable/ic_launcher"
android:label="#string/app_name"
android:theme="#style/AppTheme" >
<activity
android:name="com.etking.winningnumbersgenerator.MainActivity"
android:label="#string/app_name"
android:screenOrientation="portrait"
>
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
(Please notice the supports-screens)
And my activity_main.xml:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.etking.winningnumbersgenerator.MainActivity"
tools:ignore="MergeRootFrame" />
Is it correct the way i described above?
What do i need to do? Please help me with my first app!!!
P.S: If you need something else from the code,ask for it
EDIT: (Please read only below)
I have read Android "Supporting Multiple Screens" but maybe was something i didn't get.
I created a background image for each drawable folder: 240x320 in drawable-ldpi folder, 320x480 in drawable-mdpi, 480x800 in drawable-hdpi, 640x960 in drawable-xhdpi and 1200x1920 in drawable-xxhpdi.
The app displays well on the below screens (using emulator):
768x1280 xhdpi - 4.7'', |
480x800 hdpi - 4.0'' , |
240x432 ldpi - 3.4'' , |
1080x1920 xxhdpi - 4.95'' (Nexus 5) and
320x480 mdpi - 3.2''
It does not look well on:
480x800 mdpi - 5.1'' and 1200x1920 xhdpi - 7'' as it has too much space in the middle down to the bottom of the image.
and also on
240x320 ldpi - 2.7'' the button nearest to the bottom is almost cropped as it is appeared down on the bottom of the screen.
Note that the background image displays well.
I've put layout_width="230dp" and layout_height="50dp" for the button.
Plase help me on this!
P.S: I'm not allowed to post images so you could understand better :(

I suggest you read the Developer Guide on developing your app to support multiple Screen Sizes. It will help you very well not just focusing on screen size, but also on screen DPI (Density per Inch)

Related

Icon in Muzei Source Selector appears to not be scaling properly

I'm not sure what goes on under the hood in Muzei.
I have assets for
mdpi (48x48)
hdpi (72x72)
xhdpi (96x96)
xxhdpi (144x144)
xxxhdpi (192x192)
nodpi (512x512)
I've followed the example source's folder/asset structure to the T, but, when Muzei loads my source, it fills the entire selector circle with the icon instead of centring it nicely in the middle with ample padding like the defaults (see below).
My Manifest is basically:
<application android:allowBackup="true" android:label="#string/app_name" >
<service
android:name=".UnsplashForMuzeiRemoteArtSource"
android:description="#string/source_description"
android:icon="#drawable/ic_launcher"
android:label="#string/source_name" >
...
</service>
</application>
It looks like Muzei doesn't do anything to the icon, just displays it without scaling or padding.
What I did to fix it is just added padding to the PNG (to my base SVG and re-converted it).

Android. HDPI icon on desktop, but MDPI icon on activity

When I install and run application I see on the desktop large HDPI icon, but when activity starts, I see small MDPI icon. The icons have some marks to differentiate them, so I am sure what icons I see.
Layout:
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon"
/>
AndroidManifest.xml
<application
android:icon="#drawable/icon"
android:label="#string/app_name" >
...
Icons:
/drawable-mdpi/icon.png -> 48x48 px
/drawable-hdpi/icon.png -> 72x72 px
Display metrics:
DisplayMetrics{density=1.0, width=1280, height=752, scaledDensity=1.0, xdpi=160.15764, ydpi=160.0}
So, why does it take HDPI to display on desktop? And MDPI for my screens?
What is the physical size of your devices screen? I have a feeling your application is simply running in a screen compatibility mode. Otherwise, perhaps your packages resources are screwed up in some way. Normally cleaning the project in Eclipse will resolve that. If its the compatibility mode check this page for more information: http://developer.android.com/guide/practices/screen-compat-mode.html

Android phones using wrong drawable folder

I currently have all the standard drawable folders set up for my app on 2.3.3. (ldpi hdpi mdpi xhdpi) However, whenever I run the app on a 240dpi screen (hdpi) it uses the resources found in drawable-mdpi not drawable-hdpi. When I delete the mdpi folder everything work perfectly. Testing on the other screen densities works great. Just not hdpi screens. Any suggestions?
I was missing some declarations in my manifest file. Adding these fixed my problem.
<uses-sdk android:minSdkVersion="4" />
AND
<supports-screens
android:smallScreens="true"
android:normalScreens="true"
android:largeScreens="true"
android:anyDensity="true" />
240dpi screen take only ldpi drawable folder if there is no ldpi drawable it will autometically
get mdpi drawable....
the hdpi drawable means high density pixel(480dpi)

How to create android's application supporting multiple screen size

I look over some guide and tutorial but my problem still exists.
I develop this application using small image to create button, text and background and i put it in res/drawable-ldpi directory. Then i see on web that i have to make images with this proportion:
3:4:6. So if my images were small, to create them for medium screen size, i have to take dimension of small image and multiple for 4/3, and for large screen multiple for 6/3=2.
I see these here: Providing Resource.
Now when i create just some images for normal screen ( medium ) i launch emulator with screen density 160 or 200, but the image still remain that used in ldpi.
What can i do?
Can you explain me well what is the problem with these multiple screen and how to solve this?
This is a part of my android manifest:
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="spazio.digitale.com" android:versionCode="1"
android:versionName="1.0" android:installLocation="auto"
android:screenOrientation="portrait"
>
<uses-sdk android:minSdkVersion="7" android:maxSdkVersion="11" />
<uses-permission android:name="android.permission.INTERNET" />
<supports-screens android:normalScreens="true"
android:smallScreens="true" android:largeScreens="true"
android:anyDensity="true" />
use to pixels scale to design..
put this in manifest
<supports-screens
android:largeScreens="true"
android:normalScreens="true"
android:smallScreens="true"
android:anyDensity="true"
/>
For button, create images using 9-patch tool.
With bitmaps, the rule of thumb is to start with the highest density first, and then scale it down, because it's always easier to scale down bitmaps than to scale them up.
Also, you seem to be confusing screen density with screen size. Do not worry about the screen size for now (unless you have one background image that takes the entire screen size, which I doubt). And no, the ratio you mentioned has nothing to do with screen sizes, that only applies to screen densities. Fix the density issue first and foremost. Then, once that's fixed, you can focus on making sure the layout fits the size.
And don't even bother with ldpi, that's only 0.2% of the market of handsets. You're just wasting your time optimizing for that density.

What images and resource qualifiers do I need to use to ensure that I have a full-screen splashscreen?

I'm writing an application that needs to display a full-screen splashscreen image on start. Actually, not exactly full-screen, because status bar is still visible.
This application will be run on a wide range of phones (e.g. from Wildfire to Sensation), but not on tablets. Though, if it can be made to look good on tablets without much effort, I will do that of course.
The problem is - how can I make sure that this splashscreen looks good and fills the entire screen on all devices? It has stretchable parts on all sides, so I can make it a 9-patch if necessary, but I'm still at loss on what pixel sizes I should use.
I resolve that I need to provide images for (small|large)-(ldpi|mdpi|hdpi). What pixel sizes of those images should be? How to calculate them?
I have done it in multiple applications that i made an image of 480x800px and then took an image view or linearlayout and gave it fill_parent attributes in widht and height. It worked perfectly on all types of screen
[EDIT] One thing more just add that image in hdpi folder only.
For Splash Screen in your xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="fitXY"
android:src="#drawable/splash"/>
</LinearLayout>
and in your AndroidManifest.xml
<activity android:name=".Splash" android:theme="#android:style/Theme.NoTitleBar">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
The Theme.NoTitleBar will also remove the title bar from the splash screen
And for the image for splash screen use images of sizes:
As i had read somewhere and then used
For Portrait: 600 x 1024 px
For Landscape: 1024 x 600 px
I use these sizes in my app and have tested them on android versions 1.6 to 2.3 in each version the resolution of the images appears excellent
In the end, I found out that if I provide an hdpi image, it will auto-scale down for lesser dpi. So, to avoid complications, I created a 800x800 image with croppable sides and used it.

Categories

Resources