小白成长记——Android进阶之布局优化

布局优化主要从两方面着手：

一方面，尽量减少布局文件的层级，布局的层级减少了，程序在加载界面的时候就会更快。这一方面主要在于两点：首先，删除布局中无用的控件和层次；然后，在实现功能相同的情况下尽量使用较高性能的ViewGroup，比如使用LinearLayout或者FrameLayout来代替RelativeLayout。当然如果单纯一个LinearLayout或者FrameLayout无法实现预期效果，需要通过嵌套来实现的话，还是建议使用RelativeLayout。

另一方面，使用三个标签来降低布局的层次：

1.将可复用的布局组件抽取出来并使用include标签将其引入我们需要它的布局文件中：

activity_include_test.xml：

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

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="正文内容" />
</LinearLayout>

comment_header.xml：

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

    <TextView
        android:id="@+id/tv_test"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="测试include" />
</LinearLayout>

可能会有人有疑问，我在Activity中只加载activity_include_test的布局，像这样：

@Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_include_test);
        mTextView = (TextView) findViewById(R.id.tv_test);
    }

那我的findViewById()到底能不能找到comment_header中的控件呢？

答案是肯定的，include标签默认是把布局组件加载到当前布局中，我们可以放心的使用。

2.使用VIewStub标签来加载一些不常用的布局：

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

activity_viewstub_test.xml：

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

    <Button
        android:id="@+id/btn_VSshow"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="显示隐藏内容" />

    <ViewStub
        android:id="@+id/viewStub"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout="@layout/comment_text" />
</LinearLayout>

MainActivity：

@Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_viewstub_test);
        mButton = (Button) findViewById(btn_VSshow);
        mStub = (ViewStub) findViewById(R.id.viewStub);
        mButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                mStub.inflate();
            }
        });
    }

3.使用merge标签减少布局的嵌套层次：

作用：合并UI布局，降低UI布局的嵌套层次

应用场景举例：

1).布局根节点是FrameLayout且不需要设置background、padding等属性，可以用merge代替

2).某布局作为子布局被其他布局include时，使用merge作为该布局的顶节点，这样在被引入时顶节点会被自动忽略

activity_merge_test.xml：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    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="正文内容" />

        <include layout="@layout/comment_progress" />
    </FrameLayout>
</LinearLayout>

comment_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>