Let’s go back to the book and see how the visual effect of DP looks the same this time. If it is a little difficult to read this period, you can first read my last article 👈. You can click the link

Calculate the screen display effect

How can devices with different DPI have the same display effect at 1920×1080 resolution? The same number of pixels?

NO, NO, NO, answer: It’s the same size, it’s very intuitive, just like in the real world, you and I look at the same thing, the same size!

So amazing?

Let me give you an example to figure out how does DP make our visuals consistent

Your phone has a DPI of 440 and your tablet has a DPI of 213

We want to figure out the actual display length (in inches) by figuring out how many pixels it takes and dividing by Dpi

The calculation process

Suppose you need to display a length of 150dp. The actual display length is

Dpi calculation method: DPI = number of pixels Size DPI =\ FRAc {number of pixels}{size} DPI = number of pixels size

Dp value is converted to pixel number: 150 dp = density * 150 px150dp = 150 px150dp = density density x 150 px (density = dpi160) (density = \ frac {dpi} {160}) (density = 160 dpi)

So we figured out how many pixels

The visual dimensions of mobile phone 150DP are: 150DP ×densitydpi\ FRAc {150DP ×density}{dPI} DPI150DP ×density

Density = dPI160density = frac{dpi}{160}density=160dpi, so the visual size is 150160 “frac{150}{160} in

So by default, our phone size DPI doesn’t affect the display, it always displays the same size, just like in the real world

1dp=density×1px1dp=density×1px1dp=density×1px; 1DP =density×1px1dp=density×1px; 1DP =density×1px; The dPI is doubled, the number of pixels per inch is doubled, and the 1DP is doubled. The physical length of the display remains the same.

Thus, ignoring the rounding of DPI calculation, it can be said that dp can completely ensure the consistency of display effect.

Think about:

Why do many of the screens we look at have inconsistent displays?

** That is because the APP configures different values of width and height for the same control at different DPI or different resolution

Such as:

Example 1 (Sw Minimum Width)

Values – SW1281DP, values- SW1537DP, values- SW1921DP, values

ScreenWidth = [0,1280]; screenWidth = dp

ScreenWidth: [1281,1536]; values-sw1281dp

ScreenWidth at [1537,1920], unit dp, read values in sw1537dp

ScreenWidth = [1921,∞]; screenWidth = [1921,∞]

Example 2 (Different levels of DPI)

Values – ldpi, 120 dpi

Values – mdpi, 160 dpi

Values – hdpi, 240 dpi

Values – xhdpi, 320 dpi

Values – xhdpi, 480 dpi

Values -nodpi, any DPI

Values – tvdpi, about 213 dpi

For this part, you can go to the official document, which is very comprehensive. I add two information that is not easy to see in the official document

  1. dpiThe suffix is to seePhysical actual resolutionOf which, close to which counts

Here you can see that the physical DPI is 300, but I overwrite the DPI is 440, and it still reads the XHDPI because 300 is closest to 320

  1. There are many suffixes that can be added to the RES folder

    Android Studio is optional when you create it

OVER

Feel good, welcome to like, comment, share!