How to set android layout to support all screen sizes?
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
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.
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.
Now to support different screen size is more easy! Use new size unit SDP.
SDP - a scalable size unit
An android SDK that provides a new size unit - sdp (scalable dp). This size unit scales with the screen size. It can help Android developers with supporting multiple screens.
for text views please refer to ssp which is based on the sp size unit for texts.
https://github.com/intuit/sdp
Scalable DP (sdp) is the best solution to use. It will resize the widgets depends on the screen size. We can also apply this for text for different text sizes.
To add sdp to your project (Using Android Studio and Gradle):
add implementation 'com.intuit.sdp:sdp-android:1.0.5' to your build.gradle dependencies block.
for example:
dependencies {'com.intuit.sdp:sdp-android:1.0.5' }