Android: Design screen adaptation

According to statistics the current market Android phone resolution has more than 10 kinds of resolution so widely so that we meet a lot of difficulties in dealing with the resolution, this article on this difficult record design and practical layout of the solution.

Design layout with 320x480 as Blueprint

Because the Android layout is generally used in DP units, and we design the general use of PX units, which involves the unit conversion problem, and under MDPI, the screen density of 160,PX and DP is a 1:1 relationship, that is, 1px =1DP (dpi/160),

So in order to more convenient conversion, in the design of the time, you can give priority to MDPI, that is, 320x480px as the blueprint for the design.

And don't forget the height of the status bar above the phone.

So when we measure pitch 10px with Photoshop, we can label 10DP in the layout.

corresponding Relationship table

Resource Folder	Screen Resolution	type	corresponding icon size	screen Density	1DP
XHDPI Ultra-High resolution	1280*720	WQVGA	96*96	320	=2
HDPI High resolution	480*800	WVGA	72*72	240	=1.5
MDPI Medium resolution	480*320	HVGA, VGA	48*48	160	=1
LDPI Low resolution	320*240	QVGA	36*36	120	=0.75

Android: Layout unit Conversions >>

Provide different images for different screen sizes:

By default, Android scales. png,. jpg,. gif files, and. 9.png to render the appropriate size, and if no matching resources are available, it will be scaled using default resources or other density-dependent resources. The default resource refers to a resource without qualifiers (under drawable/, the default resource). Scaling can make them distorted, so for the best display of the images, you should provide different sizes of images for different screen densities. If you provide a set of graphs that provide at least a higher resolution of high-density bitmaps rather than providing which medium-density designs.

Android tools: Stretch Image ninepatch>>

Create a different layout folder, values folder, Drawable folder, and other resource folders under the Res/directory

Resource folder naming: Resource Name-Attribute 1-Property 2-Property 3-Property 4-Property 5 ..... (VALUES-LDPI, values-land-mdpi)

That is, the <resources_name>-<qualifier> format naming system will be based on the size of the screen to choose the appropriate use.

Where the resources_name resource name is the resource type name, including: drawable, values, layout, Anim, raw, menu, color, animator, XML;

<qualifier> is a configuration qualifier that specifies the corresponding screen parameter, and the qualifier can refer to the following table:

Phone features	Resource Qualifier	Description
Screen size	Small	Small size screen
	Normal	Normal-sized screens
	Large	Large screen Size
	XLarge	Extra Large screen size
Resolution	The	values-ldpi-320x240
	480x320	values-480x320
	800x480	values-800x480
	854x480	values-854x480
	960x540	values-960x540, values-hdpi-960x540
	960x640	values-960x640, values-xhdpi-960x640
	1024x600	values-mdpi-1024x600
	1280x720, 1280x800	values-1280x720
	Other	values-xhdpi-1184x768, values-xhdpi-1280x720, values-xhdpi-1920x1080
Density	ldpi	Low Density ~120dpi
	mdpi	Medium Density ~160dpi
	hdpi	High Density ~240dpi,
	xhdpi	Ultra high density? 320dpi,
	nodpi	Store resources that ignore screen density, such as: some images that cannot be stretched are placed in drawable-nodpi, but are wide and wrap_content
	tvdpi	Mainly used in TV, most apps don't need to use
Direction	Land	Landscape screen
	Port	Portrait screen
Version	V1~v19	New project can be seen, API 1 to API 19

Suppose you need to adapt to 320x240,480x320 resolution. Create a new folder under the Res directory values-320x240, values-480x320. Then, in the folder values, values-320x240 and values-480x320, create a new XML file Dimens.xml set the font size, width, and advanced properties. Depending on the current device's screen size, resolution, screen density, orientation, aspect ratio, the Android system selects the appropriate folder to load.

Note that the following are:

Values are found before values-ldpi, and the system thinks that values are closer than values-ldpi.

Multi-resolution compatibility test

Customize AVD as your application's test environment, simulating the size and density of real machines,

The layout file can see the effect in the preview:

Android: Design screen adaptation