截至 2019 年，使用现代技术支持不同的屏幕尺寸

Question

This question has been asked more then 100 times on SO, for example this question was asked 8 years before. And for sure the methods define in discussion are obsolete.

With the new designing components such as Constraint Layout and changes in bucket such as MipMap and other changes in techniques I want to discuss now the modern techniques.

What are the best practices for making an app to support large number of devices when it comes to designing specifically. I have more then 3 years of experience in android and still I am keen to learn the new things which are not generally discussed anywhere officially. So can you tell me what rules must be followed to support different screen sizes?

For Example I am going to show you screen which we must look on all devices to look like same

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout
    android:layout_width="match_parent"    
    android:orientation="vertical"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:layout_height="wrap_content"
    android:layout_margin="30dp"
    android:gravity="center"
    >

    <TextView
        android:id="@+id/lblLogo"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="@string/app_name"
        android:autoSizeTextType="uniform"
        android:gravity="center"
        android:padding="15dp"
        />


    <!-- Email Label -->
    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/tilLoginEmail"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/etLoginEmail"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="textEmailAddress"
            android:hint="Email" />

    </com.google.android.material.textfield.TextInputLayout>



    <!-- Password Label -->
    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/tilLoginPassword"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/etLoginPassword"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="textPassword"
            android:hint="Password"/>

    </com.google.android.material.textfield.TextInputLayout>



    <com.google.android.material.button.MaterialButton
        android:id="@+id/btnLogin"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:padding="12dp"
        android:text="@string/btnLogin"/>
</LinearLayout>

This looks perfectly good on mobile devices, but looks worst on tablets and large screen.

see the picture below on mobile screen.

see the picture below on tablets

Question: What what should be done to show centered beautiful layout in tablet too instead of wide full screen edit text. In other words what should be followed to show layout same on all devices according to new techniques?

Note: I know if we apply some properties we can limit width of edittext in given example but we can not use such properties in other complex layouts.

Answer 1

May be you can try below library which manages all the screen size resolution automatically. I am using this in my current projects.

For Dimension

implementation 'com.intuit.sdp:sdp-android:1.0.6'

For TextSize

implementation 'com.intuit.ssp:ssp-android:1.0.6'

For More Info https://github.com/intuit/sdp