How to set android layout to support all screen sizes?

Question

I am developing a program on android version2.2. I have read many documentation on supporting multiple screen sizes but still confused. I designed a layout file, that supports for large and normal screens, when am trying it with small screen it is not adjusting the layout to fit the screen. I used this code in the manifest also.

<supports-screens 
        android:resizeable="true"
        android:smallScreens="true"
        android:normalScreens="true"
        android:largeScreens="true"
        android:anyDensity="true"
        />

The image for the small screen is here. How can I set the screen that compatible with small screen? Somewhere I found by using the folder "layout-small" but if I use this, the project size is increasing, I don't want that, so can any one suggest me the best way to do this?

Answer 1

Solution for all screen and support all layout.

Icons:

                                 mdpi        hdpi       xhdpi       xxhdpi       xxxhdpi   Launcher Icons (App Icons)      48 x 48     72 x 72    96 x 96     144 x 144    192 x 192 Action Bar,Toolbar,Tab Icons    24 x 24     36 x 36    48 x 48      72 x 72      96 x 96  Notification Icons              24 x 24     36 x 36    48 x 48      72 x 72      96 x 96  

Background Image Resolution:

ldpi:    Portrait: 240 X 320px.      Landscape: 320 X 240px. mdpi:    Portrait: 320 X 480px.      Landscape: 480 X 320px. hdpi:    Portrait: 480 X 800px.      Landscape: 800 X 480px. xhdpi:   Portrait: 640 X 960px.      Landscape: 960 X 640px. xxhdpi:  Portrait: 960 X 1600px.     Landscape: 1600 X 960px. xxxhdpi: Portrait: 1280 X 1920px.    Landscape: 1920 X 1280px.   

Drawable Folder:

res/drawable        (default) res/drawable-ldpi/  (240x320 and nearer resolution) res/drawable-mdpi/  (320x480 and nearer resolution) res/drawable-hdpi/  (480x800, 540x960 and nearer resolution) res/drawable-xhdpi/  (720x1280 - Samsung S3, Micromax Canvas HD etc) res/drawable-xxhdpi/ (1080x1920 - Samsung S4, HTC one, Nexus 5, etc) res/drawable-xxxhdpi/ (1440X2560 - Nexus 6,Samsung S6edge).   ldpi (low) ~120dpi mdpi (medium) ~160dpi hdpi (high) ~240dpi xhdpi (extra-high) ~320dpi xxhdpi (extra-extra-high) ~480dpi xxxhdpi (extra-extra-extra-high) ~640dpi 

Layout:

Portrait:  res/layout/main_activity.xml           # For handsets (smaller than 600dp available width) res/layout-large/main_activity.xml     # For small tablets (640dp x 480dp and bigger) res/layout-xlarge/main_activity.xml    # For large tablets (960dp x 720dp and bigger) res/layout-w600dp/main_activity.xml    # For 7” tablets or any screen with 600dp                                        # available width (possibly landscape handsets)  Landscape: res/layout-land/main_activity.xml           # For handsets in landscape res/layout-sw600dp-land/main_activity.xml   # For 7” tablets in landscape 

Refer links:

Different resolution support android

https://developer.android.com/guide/practices/screens_support.html

https://design.google.com/devices/

Is there a list of screen resolutions for all Android based phones and tablets?

http://www.emirweb.com/ScreenDeviceStatistics.php

Most popular screen sizes/resolutions on Android phones

Answer 2

Please go through the following links. These might help you:

Supporting Different Screen Sizes

Supporting Multiple Screens

Supporting Different Densities

Supporting Tablets and Handsets

AFAIK, the only way to support all screens is by doing that folder bifurcation. Every XML file goes up to a few kilo bytes. So, size shouldn't be too much of an issue as such.

Answer 3

Yes i have got the cure to your problem, you are right i personally think that making layouts for every screen resolution is time taking and making your project size go big.

To make a layout that fits across all screen resolution i have implemented my own technique i.e setting width and height in terms of percentage

The Problem occurs when we set Views/Layouts with some constant width or height value lets say 100dp.

Solution is quite simple try to use match_parent so that the view fill up empty space or use weight and define every View relative to other Views this will help your layout to look good in almost every screen resolutions and at run time set LayoutParams of only those Views/Layouts that has some constant width or height in terms of Percentage.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <LinearLayout
        android:id="@+id/mLayout"
        android:layout_width="280px"
        android:layout_height="300px" />


</RelativeLayout>

Notice: I have used px for fixed sized layout's width/height because in LayoutParams layoutParams = new LayoutParams(int width, int height); the width and height take value as pixels

Here is an example code

final ViewTreeObserver mLayoutObserver = mLayout.getViewTreeObserver();

    mLayoutObserver.addOnGlobalLayoutListener(new OnGlobalLayoutListener() 
    {

        @Override
        public void onGlobalLayout() 
        {
            DisplayMetrics metrics = getResources().getDisplayMetrics();

            int deviceWidth = metrics.widthPixels;

            int deviceHeight = metrics.heightPixels;

            float widthInPercentage =  ( (float) 280 / 320 )  * 100; // 280 is the width of my LinearLayout and 320 is device screen width as i know my current device resolution are 320 x 480 so i'm calculating how much space (in percentage my layout is covering so that it should cover same area (in percentage) on any other device having different resolution

            float heightInPercentage =  ( (float) 300 / 480 ) * 100; // same procedure 300 is the height of the LinearLayout and i'm converting it into percentage

            int mLayoutWidth = (int) ( (widthInPercentage * deviceWidth) / 100 );

            int mLayoutHeight = (int) ( (heightInPercentage * deviceHeight) / 100 );

            LayoutParams layoutParams = new LayoutParams(mLayoutWidth, mLayoutHeight);

            mLayout.setLayoutParams(layoutParams);
        }
    });

I guess the code is pretty much self explanatory if any one still need help you can ask right away

Conclusion: If you need to set some constant width/height for your Views/Layouts always set value in px in layout file (i.e xml) and then programmatically set LayoutParams.

Suggestion: I think Google Android Guys should seriously think of replacing the dp/dip units to percentage.