[mobile terminal] design size of mobile phone interface

Hello everyone , I meet you again , I'm your friend, Quan Jun .

from Design On the one hand , do mobile phone The dimensions of interface design are generally divided into iPhone and Android Two devices .

Android Common logical resolution of ：

Android Common logical resolution of ： Refer to the screen size
360 * 640 、 360 * 720、 360 * 740、 360 * 760、 360 * 780、 360 * 800
411 * 731
480 * 853

iPhone The resolution of the

equipment	Logical resolution (point)(pt)	Physical resolution (pixel)(px)	Screen size (diagonal)	Zoom factor (scale)	Pixel density PPI	The proportion （ The approximate ）
iPhone 2G / 3 / 3GS	320 x 480	320 x 480	3.5 Inch	@1x	163	2:3
iPhone 4 / 4S	320 x 480	640 x 960	3.5 Inch	@2x	326	2:3
iPhone 5 / 5S / 5C / SE	320 x 568	640 x 1136	4.0 Inch	@2x	326	9:16
iPhone 6 / 6S / 7 / 8	375 x 667	750 x 1334	4.7 Inch	@2x	326	9:16
iPhone 6 Plus / 6S Plus / 7 Plus / 8 Plus	414 x 736	1080 x 1920	5.5 Inch	@3x	401	9:16
iPhone X/XS	375 x 812	1125 x 2436	5.8 Inch	@3x	458	9:20
iPhone XS Max	414 x 896	1242 x 2688	6.5 Inch	@3x	458	9:20
iPhone XR	414 x 896	828 x 1792	6.1 Inch	@2x	326	9:20
iPhone SE ( Second generation )	375 x 667	750 x 1334	4.7 Inch	@2x	326	9:16
iPhone 11	414 x 896	828 x 1792	6.1 Inch	@2x	326
iPhone 11 Pro	375 x 812	1125 x 2436	5.8 Inch	@3x	458
iPhone 11 Pro Max	414 x 896	1242 x 2688	6.5 Inch	@3x	458
iPhone 12 mini	375 x 812	1080 x 2340	5.4 Inch	@3x	476
iPhone 12 / 12 Pro	390 x 844	1170 x 2532	6.1 Inch	@3x	460
iPhone 12 Pro Max	428 x 926	1284 x 2778	6.7 Inch	@3x	458

new iPhone 12 Release , We can talk iPhone Screen size

Screen size

Screen size refers to the diagonal length of the screen .

Company

The unit of the screen is in inches . The conversion relationship is as follows ：1 inch = 2.54cm = 25.4mm

Logical resolution and physical resolution

Logical resolution in point（pt） In units of , Physical resolution in pixel（px） In units of .

Zoom factor （scale）

Because there is a certain proportional relationship between logical resolution and physical resolution , This scaling relationship is called scaling factor . The corresponding relationship is ：1pt = scale * px

Pixel density PPI

Pixel density PPI(Pixel Per Inch) Is the number of pixels per inch .

Calculation PPI, The Pythagorean theorem can be simply used to calculate the pixels appearing on the alignment line , Divide by the length on the diagonal ：

We know , The screen of the mobile phone is presented one by one in the form of pixels .PPI The higher the value , It means a more delicate picture . The lower PPI The screen looks grainy . But when PPI When the value reaches a certain level , If you continue to improve, the naked eye will not be able to distinguish . This is what Apple put forward Retina Concept of display screen . Within a certain distance , The mobile phone display is on 200PPI When above , The naked eye cannot distinguish a single pixel .

Publisher ： Full stack programmer stack length , Reprint please indicate the source ：https://javaforall.cn/151801.html Link to the original text ：https://javaforall.cn