Phone Resolution basics (DPI,DIP calculation)

1. Terminology and concepts

Terms	Description	Note
Screen size	Refers to the actual physical size of the phone, such as the usual 2.8-inch, 3.2-inch, 3.5-inch, 3.7-inch	Motorola milestone phone is 3.7 inches
Aspect Ratio (width/height ratio)	Refers to the actual physical dimensions of the width-to-height ratio, divided into long and nolong	Milestone is 16:9, belongs to Long
Resolution (resolution)	The same as the computer resolution concept, refers to the phone screen vertical, horizontal direction of the number of pixels	Milestone is 854*480.
DPI (dot per inch)	Pixels per inch, such as 120dpi,160dpi, assume that the screen physical size of the QVGA (320*240) Resolution is (2 inches * 1.5 inches), dpi=160	Can reflect the sharpness of the screen, which is used to scale the UI
Density (Density)	The pixel concentration in the screen, Resolution/screen size can reflect the cell phone density,
Density-independent Pixel (DIP)	Refers to the logical density unit, the corresponding formula for dip and specific pixel values is dip/pixel=dpi value/160, which is PX = DP * (dpi/160)

2. DPI value calculation

For example: Calculate WVGA (800*480) resolution, 3.7-inch density dpi,1 shown

Figure 1

Diagonal pixel represents the pixel value (=) of the diagonal, dpi=933/3.7=252

3. Classification of mobile phone screen

3.1 According to the cell phone screen density (DPI) or screen size is divided into the following 3 classes, 2 shows

Figure 2

3.2 The corresponding relationship between screen classification and pixel density of mobile phones is shown in table 1:

 

TD valign= "Top" >

	Low density (120), ldpi	Medium density (in), mdpi	High density (+), hdpi
Small screen	QVGA (240x320)
Normal screen	WQVGA400 (240x400) WQVGA432 (240x432)	HVGA (320x480) /td>	WVGA800 (480x800) WVGA854 (480x854)
Large screen		wvga800* (480x800) wvga854* (480x854)

Table 1

3.3 Mobile phone size distribution (http://developer.android.com/resources/dashboard/screens.html) 3, is mainly based on the resolution of 800*480 and 854*480 mobile phone users mostly

Figure 3

From the above screen size distribution, in fact, the phone just consider 3-4.5-inch density of 1 and 1.5 of mobile phones

4 UI Design

From a development perspective, the application will provide 3 sets of UI layout files based on the 3-class Android phone screen, but the corresponding interface icons also need to provide 3 sets, as shown in table 2

Icon Type	Standard Asset Sizes (in Pixels), for generalized screen densities
	Low density screen (ldpi)	Medium density screen (MDPI)	High density screen (hdpi)
Launcher	X × px	x px	x px
Menu	X × px	x px	x px
Status Bar	x px	x + px	x px
Tab	x px	x + px	x px
Dialog	x px	x + px	x px
List View	x px	x + px	x px

Table 2

5 How do I adapt to the screen size?

1) Interface layout aspect

It is necessary to prepare 5 sets of layouts according to the size of the physical size, layout (put some common layout XML files, such as the top and bottom layouts in the interface, will not change with the screen size, like the title bar of the WinDOS window), Layout-small ( Screen size less than 3 inches in layout), layout-normal (screen size less than 4.5 inches or so), Layout-large (4 inches-7 inches), Layout-xlarge (7-10 inches)

2) Picture Resources

5 sets of picture resources need to be prepared according to the DPI value, drawable,drawalbe-ldpi,drawable-mdpi,drawable-hdpi,drawable-xhdpi

Android has an automatic matching mechanism to select the corresponding layout and picture resources

Cell phone resolution pixel density and screen size are the words we often hear, the relationship between them is as follows :

Resolution refers to how many container points are on the screen, each of which is used to hold one pixel.

Pixel strictly refers to the image on the picture, the more pixels on the picture, the more clearly the picture is clear, of course, the larger.

The phone can have the same resolution, but the screen size can be different, such as 3.7-inch screen can be 320*480 resolution, 5.1-inch screen can also be 320*480 resolution, then what is the difference between the 2 screen display?

For example: If a phone screen width is 5cm,b phone width is 10Cm, width resolution is 320, then when the same picture is displayed, the image on the B phone will be larger, and there is no clear on a mobile phone. Why, this is our common density (DPI) concept, which is the number of dots per inch. itself a line of 5CM has 320 points, the DPI is about 150, is now a row of 10CM has 320 points, the density is about 75. The density is greatly reduced, so the image displayed by the B phone will become larger and less clear. Just as we use the Android screen monitor on the computer to display the phone screens, the total feeling on the computer is a bit large, this is because your computer's resolution density does not have a large resolution density of the phone, you can turn the computer's resolution a little bit so that the computer screen density and cell phone density consistent.

Conversion method:

72 Megapixels/inch = 28.346 px/cm

300 megapixels/inch = 118.11 px/cm

1 cm = 0.3937 inches

1 inch = 2.54 cm

Pixels can not be directly converted into inches, centimeters, to be converted at the DPI!

in a common 1024 pixel comparison :

1024 pixels = 3.413 inches = 8.67 centimeters (300 pixels/inch dpi per inch ≈0.003333 pixels), so the 1024 pixel centimeter size is: 1024*0.003333*2.54

1024 pixels = 14.222 inches = 36.12 centimeters (72 pixels/inch dpi per inch ≈0.013889 pixels), so the 1024 pixel centimeter size is: 1024*0.013889*2.54

To lift the resolution, we need to understand two concepts, image resolution and output resolution.

The image resolution is the number of pixels per inch, in PPI units, and the image resolution is often expressed as the total pixel count in each direction, such as 640x480 pixels, 1280x960 pixels, and so on. The image output quality is determined by the output resolution of the image, which describes the number of dots (dpi) that can be generated per inch of the device output image, in dpi, but not always equal.

DPI (dot per inch) output resolution

The printer resolution, also known as the output resolution, refers to the maximum number of points per inch that can be printed in two directions, horizontal and vertical, in the print output, usually in dots per inch or dpi (dot per inch). The so-called maximum resolution refers to the maximum resolution that the printer can print, that is, the limit resolution of the printed output. Usually said the printer resolution generally refers to the maximum resolution of the printer, the current general laser printer resolution is above 600x600dpi.

DPI is the abbreviation for "dot per inch". As the name implies, it refers to the number of points per inch length. In general, we use DPI as the resolution unit for Scanners and printers, and higher values indicate higher resolution. At present, the market for the sale of scanners optical resolution is mainly 600x1200 DPI and 1200x2400 dpi two kinds. The optical resolution of the scanner is composed of two numbers because of the difference in transverse resolution and longitudinal resolution. The smaller number is usually the longitudinal resolution, which is the value we typically use to differentiate the scanner's resolution. That is, the 600x1200 dpi scanner, which we usually simply referred to as the DPI.

The resolution of the computer monitor is about 72dpi, this value is actually calculated: A 15-inch computer monitor For example, the visual area of the horizontal length of about 11.2 inches, if the display mode is 800x600, then the resolution is 800/11.2=71.4. If it is a 17-inch computer monitor, in the display mode of 1024x768, the resolution becomes 1024/12.8=80.

Pixels (Pixel)

For a computer's screen device, a pixel (Pixel) or PX is the most basic unit, a point. All other units are in a fixed proportional conversion relationship with pixels. All length units are based on the display of the screen, and are uniformly converted to the number of pixels before being displayed. Therefore, the relative length and absolute length have no essential difference in terms of the computer's screen. Any unit is actually pixels, the difference is only the proportion of different.

If you extend the discussion to other output devices, such as printers, the basic unit of length may not be pixels, but other units that correspond to the units of measure in your life.

The absolute length of the CSS unit is for output devices. For PT, this is a very common font unit in the Typography tool (Word,adobe, etc.), regardless of whether your display resolution is 1024x768 or 800*600, the same document is printed on paper as a result.

Which length unit is better for writing web pages, px or PT?

I personally prefer PX, because PX can accurately represent the position and size of the elements on the screen, the Web page is mainly for the screen display, not for the sake of printing and other needs.

CSS relative length units (relative length unit)

The relative two words in the relative length unit of CSS indicate that the unit of length will change with its reference value, not fixed. The following is a list of CSS relative length units:

css Relative length units

Description

The font height of the EM element the element s font

The height of the "x" of the letter x of the EX

px pixels pixels

% percent percentage

CSS Absolute length units (absolute length unit)

The absolute length unit is a fixed value. For example, we used to have mm, is the meaning of millimeters. The following is a list of CSS absolute length units:

CSS Absolute Length units

Description

in inch inches (1 inch = 2.54 cm)

CM cm centimeters

mm mm millimeters

PT Point points (1 points = 1/72 inches)

PC Pickup Picas (1 pickup = 12 points)

Pixels are relative to the display screen resolution. For example, the resolution used by Windows users is typically 96 pixels per inch. The resolution used by Mac users is typically 72 pixels per inch. So the DPI in Windows CSS is 96 pixels per inch.

Additional tables are attached:

Common photo size, pixel and print size comparison table (practical)

Inches Photo Specs	Cm	Pixel	Digital camera Type	Print size Resolution: 300DPI
1 inch	2.5x3.5cm	413x295	/	/
Photo ID	3.3x2.2	390x260	/	/
2	3.5x5.3cm	626x413	/	/
Small 2 inch (Passport)	4.8x3.3cm	567x390	/	/
5 inch	12.7x8.9	1200x840 or more	1 million megapixels	/
6 inch	15.2x10.2	1440x960 or more	1.3 million megapixels	/
7 inch 7x5	17.8x12.7	1680x1200 or more	2 million megapixels	12.7x17.7
8 inch 8x6	20.3x15.2	1920x1440 above	3 million megapixels	15.2x20.3
10 inch 10x8	25.4x20.3	2400x1920 or more	4 million megapixels	20.3x25.4
12 inch 12x10	30.5x20.3	2500x2000 or more	5 million megapixels	25.4x30.5
15 inch 15x10	38.1x25.4	3000x2000	6 million megapixels	25.4x38.1

Recent projects found that the same resolution of 2 machines, an interface style is not the same, after many tests found that the first pad (Lenovo a1_07) density of 1.5, converted to DPI is 240, is high density, the other pad density of 1, is medium density, Convert to DPI is 160, should belong to medium density
And that's the problem.Workaround：
The values folder should be placed under the values-hdpi, values-mdpi respectively corresponding style, OK
Here are the learning materials
Screen resolution
Convert the physical DPI on the device to dips using multiplication
Androidname approx. resolution multiply by this get dips
ldpi ~120 dpi 1.333
MDPI ~160 DPI 1.0 (Baseline density)
tvdpi ~213 dpi 0.751
hdpi ~240 DPI 0.67
xhdpi ~320 DPI 0.5

DPI: pixels per inch (density *160)
Density: Density

Cell phone pixel density (density) is actually in 160 pixels per inch as the reference standard, the main density is 0.75,1,1.5 and 2, when the density of 2 o'clock means 1 inches has 320 pixels, Android in the code can get to the screen pixel value and density, Based on these values, the physical dimensions of the screen can be calculated backwards

Screen size = pixel value of screen diagonal/(density *160) = [(Long squared + width squared) Open radical]/(density *160)

Practice Process：

Because the density density obtained in the Android device itself is approximately equal to the value, such as the calculation of the exact density of the density=1.575, actually read in the code density=1.5, It is necessary to implement a simple calculation of the screen size of the application on different devices to verify the physical size accuracy, the specific code is as follows:

Displaymetrics metric = new Displaymetrics ();
Getwindowmanager (). Getdefaultdisplay (). Getmetrics (Metric);
int width = metric.widthpixels; Screen width (pixels)
int height = metric.heightpixels; Screen height (pixels)
float density = metric.density; Screen Density (0.75/1.0/1.5)
int densitydpi = metric.densitydpi; Screen density dpi (120/160/240)
Double diagonalpixels = math.sqrt (Math.pow (width, 2) +math.pow (height, 2));
Double screensize = diagonalpixels/(160*density);

Phone Resolution basics (DPI,DIP calculation)