Android之布局优化

两点之间未必直线最短，有时迂回曲折能够更快地抵达终点。

本讲内容：include标签、merge标签和ViewStub标签。

一、使用include标签将可复用的组件抽取出来(引用布局)

二、使用merge标签减少布局的嵌套层次（merge相当于framelayout）

场景1：布局根结点是FrameLayout且不需要设置background或padding等属性，可以用merge代替。
场景2：某布局作为子布局被其他布局include时，使用merge当作该布局的顶节点，这样在被引入时，顶结点会自动被忽略。

三、使用ViewStub标签来加载一些不常用的布局

作用：ViewStub标签同include标签一样可以用来引入一个外部布局，不同的是，ViewStub引入的布局默认不会扩张，既不会占用显示也不会占用位置，从而在解析Layout时节省cpu和内存

示例一：include

下面是res/layout/title.xml 布局文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/title_bg" >

    <Button
        android:id="@+id/title_back"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_margin="5dp"
        android:background="@drawable/back_bg"
        android:text="Back"
        android:textColor="#fff" />

    <TextView
        android:id="@+id/title_text"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="1"
        android:gravity="center"
        android:text="This is Title"
        android:textColor="#fff"
        android:textSize="25sp" />

    <Button
        android:id="@+id/title_edit"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_margin="5dp"
        android:background="@drawable/edit_bg"
        android:text="Edit"
        android:textColor="#fff" />

</LinearLayout>

下面是res/layout/activity_main.xml 布局文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <include layout="@layout/title" />

</LinearLayout>

示例二：merge

下面是res/layout/progress.xml 布局文件：

<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <ProgressBar
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" />

</merge>

下面是res/layout/activity_main.xml 布局文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="正文内容"
            android:textSize="25sp" />

        <include layout="@layout/progress" />
    </FrameLayout>

</LinearLayout>

示例三：ViewStub

 

下面是res/layout/activity_main.xml 布局文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <Button 
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="显示隐藏内容"/>
    
    <ViewStub 
        android:id="@+id/id_viewStub"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout="@layout/title"/>
</LinearLayout>

下面是MainActivity.java主界面文件：

public class MainActivity extends Activity {
	private Button b;
	private ViewStub stub;

	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		b=(Button) findViewById(R.id.button);
		stub=(ViewStub) findViewById(R.id.id_viewStub);
		b.setOnClickListener(new OnClickListener() {
			public void onClick(View v) {
				stub.inflate();
			}
		});
	}
}

Take your time and enjoy it