Screen adaptation solution 3- Toutiao adaptation solution

Personally, I think toutiao’s adaptation program is probably the simplest and easiest to develop. Its core code is just a few dozen lines. Here I just say the principle, its detailed process or refer to the toutiao team’s article toutiao adaptation plan. Modify the density and densityDpi of the system. If you don’t know the meaning of these two variables, please check the Android screen adaptation solution first.

Core adaptation process

According to the formula PX = DENSITY * dp, what is variable in this formula? Density can vary depending on the same or different screen sizes. Assuming a screen resolution of 1080 * 1920, if we know the dp = 480 of the design, then density = 1080/480 = 2.25, dPI = density * 160. In this way, we can write the layout according to the design size of the draft without thinking about it.

public class BaseUiActivity extends AppCompatActivity { public static final int WIDTH = 480; @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); DisplayMetrics appDisplayMetrics = getApplication().getResources().getDisplayMetrics(); // The width of the design draft ADAPTS to the target density, densityDpifloat targetDensity = (float) appDisplayMetrics.widthPixels / WIDTH; int targetDensityDpi = (int) (targetDensity * 160); DisplayMetrics activityDisplayMetrics = this.getResources().getDisplayMetrics(); activityDisplayMetrics.density = activityDisplayMetrics.scaledDensity = targetDensity; activityDisplayMetrics.densityDpi = targetDensityDpi; }}Copy the code

If you use the above code directly for adaptation, there are still problems, such as fonts becoming smaller on some devices and font sizes not working. The final solution is as follows:

// By creating the base class, If you need this adaptation, just inherit your Activity from it, Dp public Class BaseUiActivity extends AppCompatActivity {public static final int WIDTH = 480; privatefloat mAppScaleDensity;

    private float mAppDensity;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        final Application app = getApplication();
        DisplayMetrics appDisplayMetrics = app.getResources().getDisplayMetrics();
        if (mAppDensity == 0) {
            mAppDensity = appDisplayMetrics.density;
            mAppScaleDensity = appDisplayMetrics.scaledDensity;
            app.registerComponentCallbacks(new ComponentCallbacks() {

                @Override
                public void onConfigurationChanged(Configuration newConfig) {
                    if(newConfig ! = null && newConfig.fontScale > 0) { mAppScaleDensity = app.getResources().getDisplayMetrics().scaledDensity; } } @Override public voidonLowMemory() {}}); } // The width of the design draft to fit the target density, densityDpifloat targetDensity = (float) appDisplayMetrics.widthPixels / WIDTH;
        int targetDensityDpi = (int) (targetDensity * 160);
        floattargetScaleDensity = targetDensity * (mAppScaleDensity / mAppDensity); // Change the adapted activity to the calculated value. DisplayMetrics activityDisplayMetrics = this.getResources().getDisplayMetrics(); activityDisplayMetrics.density = targetDensity; activityDisplayMetrics.densityDpi = targetDensityDpi; activityDisplayMetrics.scaledDensity = targetScaleDensity; }}Copy the code

Let’s use the following, so here’s a textView divided into ten horizontal sections.

<? xml version="1.0" encoding="utf-8"? > <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    tools:context=".UIAdapter3Activity">

    <TextView
        android:textColor="#ffffff"
        android:background="@color/colorAccent"
        android:gravity="center"
        android:text="1"
        android:layout_width="48dp"
        android:layout_height="48dp" />

    <TextView
        android:textColor="#ffffff"
        android:background="@color/colorPrimary"
        android:gravity="center"
        android:text="2"
        android:layout_width="48dp"
        android:layout_height="48dp" />

    <TextView
        android:textColor="#ffffff"
        android:background="@color/colorAccent"
        android:gravity="center"
        android:text="3"
        android:layout_width="48dp"
        android:layout_height="48dp" />

    <TextView
        android:textColor="#ffffff"
        android:background="@color/colorPrimary"
        android:gravity="center"
        android:text="4"
        android:layout_width="48dp"
        android:layout_height="48dp" />

    <TextView
        android:textColor="#ffffff"
        android:background="@color/colorAccent"
        android:gravity="center"
        android:text="5"
        android:layout_width="48dp"
        android:layout_height="48dp" />

    <TextView
        android:textColor="#ffffff"
        android:background="@color/colorPrimary"
        android:gravity="center"
        android:text="6"
        android:layout_width="48dp"
        android:layout_height="48dp" />

    <TextView
        android:textColor="#ffffff"
        android:background="@color/colorAccent"
        android:gravity="center"
        android:text="Seven"
        android:layout_width="48dp"
        android:layout_height="48dp" />

    <TextView
        android:textColor="#ffffff"
        android:background="@color/colorPrimary"
        android:gravity="center"
        android:text="8"
        android:layout_width="48dp"
        android:layout_height="48dp" />

    <TextView
        android:textColor="#ffffff"
        android:background="@color/colorAccent"
        android:gravity="center"
        android:text="9"
        android:layout_width="48dp"
        android:layout_height="48dp" />

    <TextView
        android:textColor="#ffffff"
        android:background="@color/colorPrimary"
        android:gravity="center"
        android:text="10"
        android:layout_width="48dp"
        android:layout_height="48dp" />

</LinearLayout>
Copy the code

The following information is displayed:

Of course, I only use wide latitude here to adapt, if you want to high, the above code copy can be changed to high. In general, if the content is too long, the layout of high latitude is scrolling.