"Turn" Android's merge tutorial and examples

Original: http://blog.sina.com.cn/s/blog_62f987620100sf13.html

The <merge/> label is introduced separately because it plays an important role in optimizing the UI structure. The goal is to optimize the structure of the entire Android layout by cutting redundant or extra layers . The core function is to reduce the level of redundancy to achieve the purpose of optimizing the UI!

An example will be used to understand what the tag actually does, so you can get a more intuitive view of <merge/> usage.

Create a simple Layout that contains two views elements:ImageView and TextView By default We place these two elements in framelayout. The effect is to display a picture in full screen in the main view, then display the title on the picture and below it. The following is the XML code:

<? XML version= "1.0" encoding="Utf-8"?>

<framelayout xmlns:android="http://schemas.android.com/apk/res/android"

Android:layout_width="Fill_parent"

android:layout_height="Fill_parent">

<ImageView

Android:layout_width="Fill_parent"

android:layout_height="Fill_parent"

android:scaletype="center"

android:src="@drawable/rain" />

<TextView

Android:layout_width="Wrap_content"

android:layout_height="Wrap_content"

android:layout_marginbottom="20dip"

android:layout_gravity="Center_horizontal|bottom"

android:padding="12dip"

android:background="#AA000000"

android:textcolor="#ffffffff"

android:text="Golden Gate2" />

</framelayout>

Apply the Layout above The view to run is :

start tools> hierarchyviewer.bat tool to view the current UI Structure View :

We can clearly see the presence of two framelayout nodes, it is clear that these two completely identical nodes caused the waste of resources (here can be reminded that in the development of the project can be habitual hierarchyviewer view the current UI resource allocation), how can you solve this problem (how do you get rid of redundant framelayout nodes in the current example )? This is the time to use the <merge/> tag to deal with similar problems. We replace the framlayout in the above XML code with the merge:

<? XML version= "1.0" encoding="Utf-8"?>

<merge xmlns:android="http://schemas.android.com/apk/res/android">

<ImageView

Android:layout_width="Fill_parent"

android:layout_height="Fill_parent"

android:scaletype="center"

android:src="@drawable/rain" />

<TextView

Android:layout_width="Wrap_content"

android:layout_height="Wrap_content"

android:layout_marginbottom="20dip"

android:layout_gravity="Center_horizontal|bottom"

android:padding="12dip"

android:background="#AA000000"

android:textcolor="#ffffffff"

android:text="Golden Gate2" />

</Merge>

UI structure diagram:

The effect shown in emulator is the same after running the program, but ui structure is changed, the original redundant Framelayout nodes are merged together, or can be understood as adding a subset of merge tags directly to the activity Framelayout with the node (here to remind everyone: all activity View root node are framelayout). If you create a layout is not used framlayout as the root node (instead, apply the Span lang= "en-us" xml:lang= "en-us" >linerlayout and other definitions root label), cannot apply the above example through merge to optimise ui structure.

In addition to the above example,Meger has another usage, and when an include or viewstub tag is imported from an external XML structure, the imported XML can be represented as a root node in the merge. This way, when embedded in the parent structure, it is good to dissolve the subset it contains into the parent structure without the redundant nodes.

There are two additional points that require special attention :

<merge/> can only be used as the root node of XML layout.

When the XML layout that needs to be expanded is itself composed of the merge as the root node, the imported XML layout needs to be placed in the ViewGroup, and the attachtoroot must be set to True.

"Turn" Android's merge tutorial and examples