一、思维导图

Android布局技巧与优化

二、重述知识

这节课主要讲了Android的布局是怎样绘制的，
它是按层级一层层地绘制的，所以如果层次太多就会产生性能问题。
这就需要我们去优化布局，有以下的这些手段：

1. 多用相对布局，合理使用线性布局；
2. 用<include/>标签去引用相同的部分
3. 用<merge/>减少无用的层次
4. 布局结构要清晰，删除无用的布局，选择合适的布局。

还可以利用“Android Lint”、“Hierarchy Viewer”这样的工具协助优化。
另外，不要嵌套多个使用layout_weight属性的LinearLayout。

三、具体应用场景

略。（这些优化技巧，很难从应用长什么样子看出来，用起来才知道。）

四、扩展理解(优劣？有无替代方案?除了这样用，还能怎么用?)

这里推荐徐宜生的《Android群英传》P228~P234，
有这方面内容的明细，其实根本不用写，看完、练完书上的也就学到了。

Android布局是怎样绘制出来的（是什么）?【简述】

在Android中，系统对View进行测量、布局和绘制时，都是通过对View数的遍历来进行操作的。 ——《Android群英传》

简单来说，就是一层层深入，画完“子”那一层，再回去画“父”那层。

更深入的内容，请阅读《公共技术点之 View 绘制流程》这篇文章，我初学就先不看了。

为什么我这个应用这么卡（为什么）？

首先，回答这个问题，要先知道怎样才会觉得应用不卡。
玩游戏的都知道，最佳fps是60fps，
我们人眼能感觉到的流畅是40帧/秒到60帧/秒。
在Android中， 1秒/60帧 约等于16ms。
这个数据表示，我们在手机屏幕看到的所有UI界面的东西，
都要保证在16ms内完成绘制，画不完的要等到下一次屏幕渲染，
这样就会在16ms*2的时间内，显示同一帧画面，
那我们人眼看出来的效果，就是“卡”了。

那我怎么优化才能不卡啊（怎样做）?

目前对我来说，就是上面说到那几样：优化布局层级、<include/>、<merge/>、<ViewStub/> ……

五、核心代码或操作

1.课程视频中的减少<LinearLayout/>的操作
首先从第3分钟开始，老师以拖控件的方式，
拖了一个布局出来，从“3：28~8:45”这段时间，过程如下所示：

前8分钟操作步骤 1

中间那个横向的<LinearLayout/>高度改为100dp，
在中间那个<LinearLayout/>再加个<LinearLayout/>，
再改一下大小、颜色之类的属性，就弄成下面最后的那幅图那样。

前8分钟操作步骤 2

代码大概是下面这样，这个是我自己拖的，
不是视频里面的：

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

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button" />

    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="100dp"
        android:background="#567890"
        android:gravity="right"
        android:orientation="horizontal">

        <TextView
            android:id="@+id/textView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Large Text"
            android:textAppearance="?android:attr/textAppearanceLarge" />

        <LinearLayout
            android:layout_width="100dp"
            android:layout_height="match_parent"
            android:background="@color/red"
            android:orientation="horizontal"></LinearLayout>

        <Button
            android:id="@+id/button7"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="New Button" />

        <TextView
            android:id="@+id/textView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Large Text"
            android:textAppearance="?android:attr/textAppearanceLarge" />

        <TextView
            android:id="@+id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Large Text"
            android:textAppearance="?android:attr/textAppearanceLarge" />
    </LinearLayout>

    <Button
        android:id="@+id/button4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button" />

    <Button
        android:id="@+id/button5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button" />

    <Button
        android:id="@+id/button6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Large Text"
        android:textAppearance="?android:attr/textAppearanceLarge" />

</LinearLayout>

然后就可以开始减少层次了，过程如下：

2.课程视频中的<include/>的操作
例如我有一个布局，要用到其它很多的Activity，
没理由每个Activity再重新写一遍这个布局的代码，
这时候就可以用<include/>标签，
把这个需要重用的代码放到那些Activity需要的地方。

新建一个这样的 layout_title.xml 布局

在另一个Activity把它include进来

产生这样的效果

就像上面这样，在activity_main.xml中把layout_title.xml的布局<include/>进来。

(课程视频里面其它的优化技巧说得都不太好，
看完别的资料，还需要写另一篇博文说一下。)

六、相关面试题

待补充。

七、脑内记忆

主要记住下面这件代码：

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

layout → 布局
一般这句都是有两个"布局"，
那个@想成象棋棋子，两个"布局"include在一起，
就是一幅象棋咯。(脑洞略大)

八、参考资料

1. Android Layout Tricks #1
2. Android Layout Tricks #2: Reusing layouts
3. Android Layout Tricks #3: Optimize by merging
4. Android Layout Tricks #3: Optimize with stubs
5. Optimizing Your UI
6. Analyzing UI Performance with Systrace
7. Improving Your Code with lint
8. Improving Layout Performance
9. 布局优化技巧
10. Android最佳性能实践(四)——布局优化技巧
11. [Android]布局优化技巧](http://www.cnblogs.com/rossoneri/p/4838072.html)
12. 【推荐】Android布局优化之过度绘制
13. 【推荐】公共技术点之 View 绘制流程