Android高级开发-布局渲染流程与优化

CPU(中央处理器)与GPU(图像处理器)

主要是设计目标不同，针对不同的应用场景。多缓存多分支，适用于复杂的逻辑运算,主要负责Measure，Layout，Record，Execute的计算操作。

CPU擅长逻辑控制和通用类型数据运算。CPU的运算速度取决于请了多么厉害的教授，教授处理复杂任务的能力高，但简单重复的任务，还是人多快。众核少缓存,适用于结构单一的数据处理,主要负责Rasterization(栅格化)操作。

GPU擅长大规模并发计算。GPU的运算速度取决于雇了多少小学生。

绿色的是计算单元，橙红色的是存储单元，橙黄色的是控制单元。

屏幕上显示的文字、图像等，都是通过屏幕上的像素点显示颜色来完成的。

Resterization栅格化是绘制那些Button，Shape，Path，String，Bitmap等组件最基础的操作。它把那些组件拆分到不同的像素上进行显示。这是一个很费时的操作，GPU的引入就是为了加快栅格化的操作。

CPU负责把UI组件计算成Polygons，Texture纹理，然后交给GPU进行栅格化渲染。整个流程如下

FPS (Frames Per Second)每秒帧数 60FPS 用户看的话觉得动作是连续的，至少是每秒10-12帧的速度，而想达到流畅的效果，至少需要每秒24帧。这也是为什么电影片源通常都是24帧的原因。如果和手机交互，如触摸和反馈，低于60FPS会感觉卡顿，60FPS是最佳流畅度。

为了保证用户的视觉效果，所以Android系统每隔16ms(1000ms/60fps)发出VSYNC信号，触发对UI渲染。

如果渲染操作超过了16ms，那么用户在16ms * 2 看到的2帧画面相同，感觉界面卡顿，即丢帧现象。

卡顿分析(16ms主要做两件事)

将UI对象转换成Polygons，Texture纹理。(LayoutInflater将XML转换成JAVA对象给CPU)
CPU传递数据给GPU、GPU进行绘制。

布局优化

减少布局元素的层级嵌套，删除多余布局。或更改布局组件。如使用ContraintLayout。(减少转换对象的时间)
减少布局中的背景。(减少GPU重复绘制)
自定义View是否进行裁剪。(减少GPU重复绘制)

public class ClipView extends View {

    Card[] cards;
    Paint paint;

    ......

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        Card card;
        Bitmap bitmap;
        for (int i = 0; i < cards.length - 1; i++) {
            card = cards[i];
            bitmap = BitmapFactory.decodeResource(getResources(), card.resId);
            canvas.drawBitmap(bitmap, card.x, 0, paint);
//            drawCards(canvas, bitmap, card.x, cards[i + 1].x);
        }

        card = cards[cards.length - 1];
        bitmap = BitmapFactory.decodeResource(getResources(), card.resId);
        canvas.drawBitmap(bitmap, card.x, 0, paint);
    }

    private void drawCards(Canvas canvas, Bitmap bitmap, int s, int e) {
        canvas.save();
        canvas.clipRect(s, 0, e, bitmap.getHeight());
        canvas.drawBitmap(bitmap, s, 0, paint);
        canvas.restore();
    }
}

<?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"
    android:gravity="center">
    <com.outman.example.androidtest.clip.ClipView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#0000ff"
        android:layout_margin="10dp"/>
</LinearLayout>