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

扩展知识
CPU(中央处理器)与GPU(图像处理器)
主要是设计目标不同,针对不同的应用场景。多缓存多分支,适用于复杂的逻辑运算,主要负责Measure,Layout,Record,Execute的计算操作。
CPU擅长逻辑控制和通用类型数据运算。CPU的运算速度取决于请了多么厉害的教授,教授处理复杂任务的能力高,但简单重复的任务,还是人多快。众核少缓存,适用于结构单一的数据处理,主要负责Rasterization(栅格化)操作。
GPU擅长大规模并发计算。GPU的运算速度取决于雇了多少小学生。

Android高级开发-布局渲染流程与优化
Android高级开发-布局渲染流程与优化
绿色的是计算单元,橙红色的是存储单元,橙×××的是控制单元。
屏幕上显示的文字、图像等,都是通过屏幕上的像素点显示颜色来完成的。
Android高级开发-布局渲染流程与优化
Resterization栅格化是绘制那些Button,Shape,Path,String,Bitmap等组件最基础的操作。它把那些组件拆分到不同的像素上进行显示。这是一个很费时的操作,GPU的引入就是为了加快栅格化的操作。
CPU负责把UI组件计算成Polygons,Texture纹理,然后交给GPU进行栅格化渲染。
整个流程如下
Android高级开发-布局渲染流程与优化
FPS (Frames Per Second)每秒帧数
60FPS 用户看的话觉得动作是连续的,至少是每秒10-12帧的速度,而想达到流畅的效果,至少需要每秒24帧。这也是为什么电影片源通常都是24帧的原因。如果和手机交互,如触摸和反馈,低于60FPS会感觉卡顿,60FPS是最佳流畅度。
为了保证用户的视觉效果,所以Android系统每隔16ms(1000ms/60fps)发出VSYNC信号,触发对UI渲染。
如果渲染操作超过了16ms,那么用户在16ms * 2 看到的2帧画面相同,感觉界面卡顿,即丢帧现象。

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

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

布局优化

1.减少布局元素的层级嵌套,删除多余布局。或更改布局组件。如使用ContraintLayout。(减少转换对象的时间)
2.减少布局中的背景。(减少GPU重复绘制)
3.自定义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>

猜你喜欢

转载自blog.51cto.com/14295695/2404353