Responsive Layout Design

Question

I finished the java codes and function of my little project. At the end, i check to support a big amount of android devices according to their size. But it was fail.

While researching, i understand that i should use sp for textsizes and dp for all other parameters. The layout -xml- is existed via sp and dp. But it is not like that i expected.

I create a new project for example.

My xml; (in ConstraintLayout)

 <TextView
    android:id="@+id/textView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="72dp"
    android:text="Hello World!"
    android:textSize="105sp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.502"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="144dp"
    android:text="Check"
    android:textSize="160sp"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/textView" />

For 1080 x 1920 xxhdpi; Click here to see layout

For 1440 x 2960 hdpi(samsung galaxy s8 ) Click here to see layout

In galaxy s8, elements are really small and there is problem in view. I guess that i misunderstand a basic concept. Can you clear up my mind please?

you have to know screen dimension for all device support, have look [this](https://stackoverflow.com/questions/32860815/how-to-define-dimens-xml-for-every-different-screen-size-in-android) — Hemant Parmar, Jun 06 '18 at 12:47
1. of all you use bias. Remove it if you dont need. 2. You use contrains additional to margins. Remove margins, do the possitions only with contrains. 3. Depending on Device font/Size and theme, every ui app will look a little different. Overview about CL: https://developer.android.com/training/constraint-layout/ As hakan said, dimensions could be usefull, but you dont need them if you design a perfect contrain layout — YingYang, Jun 06 '18 at 12:50

score 0 · Accepted Answer · answered Jun 06 '18 at 13:02

You're missing something here: when you set android:layout_marginTop="72dp" the 72dp wil lbe interpreted the same way in both layout files.

A solution is to use dimens instead of values directly in your xml file.

Watch here : https://stackoverflow.com/a/32861248/5778152

Hope it helps.

score 0 · Answer 2 · answered Jun 06 '18 at 13:11

You have to be careful at screen size and pixel density.

The best way to treat all screen sizes is to use ConstraintLayout, or weightSum in LinearLayout (but it slows UI performance). This will help you keep the same position of the elements on all screens.

Pixel density is harder to treat. For text size, for example, I find it useful to use different dimens files. Right click values folder and click Values resource file, put the name dimens and then choose Density from the left. There you can select what density you like to treat. In each file you make you can make a text size with the same name, like this:

<dimen name="normal_text_size">15sp</dimen>

and each time you set a text size use this tag. This way depending on the phone density the appropriate text size will be automatically selected.

You can read about ConstraintLayout here

Read about screen size here

And about pixel density here

Responsive Layout Design

2 Answers2