How to create a layout in android which should support all the devices?

Question

This question might be asked more than 1000 times,I am still here confused,which will be the proper approach?As I Googled I found some related links link1 ,link2,link3 etc.Solution what i found is use Relative layouts in xml design.All layouts will be in layout-folder(if you are creating a phone app) and dimensions should be given in dimens.xml(which is in values-mdpi,hdpi,xhdpi,xxhdpi,xxxhdpi folders) to support all screen.

how can i give marginTop for an image view.I am doing calculation like this:in ratios (1:1.5:2:3:4)-(mdpi:hdpi:xhdpi:xxhdpi:xxxhdpi)-(10dp-15dp-20dp-30dp-40dp). Whether my approach is correct or?

I have given different images of different resolutions in drawable-(mdpi:hdpi:xhdpi:xxhdpi:xxxhdpi) folders.

My question is in values-mdpi/dimens.xml-margintop-10dp, values-hdpi/dimens.xml-margintop-15dp,values-xhdpi/dimens.xml-margintop-20dp etc.Giving dimension values for different screen in the ratios of (1 : 1.5 : 2 : 3 : 4) is correct? in Main.xml:

<RelativeLayout 
    android:id="@+id/rl_submain"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >


    <ImageView 
        android:id="@+id/iv_papa"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="@dimen/s_mtop"
        android:background="@drawable/papa1"
        android:gravity="center"/>

    <TextView 
            android:id="@+id/tv_power"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_horizontal"
            android:layout_marginBottom="@dimen/s_mbot"
            android:textSize="12sp"
            android:textColor="@color/white"
            android:layout_alignParentBottom="true"
            android:text="@string/poweredby"/>

</RelativeLayout>



<resources>
<!--Splash-->mdpi
<dimen name="s_mtop">10dp</dimen>
<dimen name="s_mbot">2dp</dimen>

<resources>
<!--Splash-->hdpi
<dimen name="s_mtop">15dp</dimen>
<dimen name="s_mbot">3dp</dimen>

<resources>
<!--Splash-->xhdpi
<dimen name="s_mtop">20dp</dimen>
<dimen name="s_mbot">4dp</dimen>

 <resources>
<!--Splash-->xxhdpi
<dimen name="s_mtop">30dp</dimen>
<dimen name="s_mbot">6dp</dimen>

<resources>
<!--Splash-->xxxhdpi
<dimen name="s_mtop">40dp</dimen>
<dimen name="s_mbot">8dp</dimen>

Answer 1

Why dont you use weight for layout instead. Have one blank view above image and weight it according to your requirement it will stretch automatically. You can find example here

Or try like this. Give weight for space as per your need for blank layout

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:weightSum="1">
    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@android:color/holo_green_dark"
        android:layout_weight="0.2"
        android:id="@+id/view1" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageView"
       android:src="@drawable/ic_register"
        android:layout_weight="0.8"
       />
    </LinearLayout>
</RelativeLayout>

Answer 2

how can i give marginTop for an image view.I am doing calculation like this:in ratios (1:1.5:2:3:4)-(mdpi:hdpi:xhdpi:xxhdpi:xxxhdpi)-(10dp-15dp-20dp-30dp-40dp). Whether my approach is correct or?

Dimension Ratio (1:1.5:2:3:4)-(mdpi:hdpi:xhdpi:xxhdpi:xxxhdpi) is correct but it not for dimension unit dp/dip...it is for px

dp :Density-independent Pixels - An abstract unit that is based on the physical density of the screen. These units are relative to a 160 dpi (dots per inch) screen, on which 1dp is roughly equal to 1px. When running on a higher density screen, the number of pixels used to draw 1dp is scaled up by a factor appropriate for the screen's dpi. Likewise, when on a lower density screen, the number of pixels used for 1dp is scaled down.

For more detail on different dimension unit refer doc

So as per your example let marginTop = 10dp then as per ratio (1:1.5:2:3:4)-(mdpi:hdpi:xhdpi:xxhdpi:xxxhdpi)-(10px-15px-20px-30px-40px)
than means you can also do marginTop =10px but it would remain 10px across all..so higher the dpi the marginTop would look small in this case..

For advantage of dip/dp over px you can refer here

sp is similar to dp; but it is used in context of font size for reason refer dimension unit doc

You can also refer the converter here

dimensions should be given in dimens.xml(which is in values-mdpi,hdpi,xhdpi,xxhdpi,xxxhdpi folders) to support all screen.

Coming to this again for dimension you should not do values-mdpi, hdpi...and so on.Because if you use unit dp then it is independent of density of screen as mentioned.
if you use unit px then you can go for values-mdpi, values-hpdi...and so on, but again this would become overhead of manual calculation and possibility of inducing error by getting unwanted value.

So it is better that dimesnion value would only defer in terms of screen size not in terms of screen density. so your layout or values folder can be as per Android OS(API) version, and screen size like normal, large or as mentioned in link1, link2 and in comment by Eenvicible

Updates BASED on Comments
If you go through Supporting Different Screens then you will realize that
for layout we have folder structure layout-normal, layout-large, layout-large-land...but again this might vary
In the same link you can see drawable-mdpi..and so on. Here images we use are generally not density independent so we need same image in different densities and we add it in accordingly in folder
for values we have folder structure like values, values-fr in case you Supporting Different Language
Regardingly values-mdpi,values-hpdi I already explained above.

Please go through each and every link properly..bcoz I am refering to OFFICAL DOC ONLY

Answer 3

Yes, the values in your dimens.xml file are completely wrong. Please delete all your different dimens.xml. The different densities are for the actual images when you edit them with your image editor.

If you want a margin around your image, use linear layouts with weights or relative layouts, but do not use dps. Weighted linear layouts or relative layouts are much more flexible.

But if you do choose dps, which again, I do not recommend, know that one set of measurements in your dimens.xml is enough.

Ideally, do not create more xml layout/dimens variations than you need. You can tweak those if you need to, but make sure that you're solving an actual problem before you start adding on more qualifiers.