android性能优化练习:过度绘制

练习:https://github.com/zhangbz/AndroidUIPorblems

查看过度绘制

在开发者选项中开启"调试GPU过度绘制"

判断标准

无色:没有过度绘制,即只绘制了一次

蓝色:一倍过度绘制

绿色:二倍过度绘制

淡红色:三倍过度绘制

红色:四倍或以上过度绘制

实践





其中"This is test"四次或以上倍数过度绘制,其背景三倍,按钮两倍,按钮中的文字三倍,背景一倍.

Mainactivity优化

首先分析布局文件,发现嵌套的LinearLayout设置了与父LinearLaytout相同的背景色,故删除其背景色设置,效果如下



然后由于Android自带的一些主题，window会被默认添加一个纯色的背景，因为这个Activity的界面的背景占满了整个屏幕，所以我们可以去掉该activity的默认绘制，在mainactivity的onCreate()方法里面修改代码。

protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

getWindow().setBackgroundDrawable(null);//新增代码

//...
}

效果如下:



至此,消除了该页面三倍及以上过度绘制.

overdrawview优化







原实现方法如下,由于onDraw()方法中绘制的图形存在覆盖现象,因而导致了过度绘制

@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);

int width = getWidth();
int height = getHeight();

mPaint.setColor(Color.GRAY);
canvas.drawRect(0, 0, width, height, mPaint);

mPaint.setColor(Color.CYAN);
canvas.drawRect(0, height/4, width, height, mPaint);

mPaint.setColor(Color.DKGRAY);
canvas.drawRect(0, height/3, width, height, mPaint);

mPaint.setColor(Color.LTGRAY);
canvas.drawRect(0, height/2, width, height, mPaint);
}

修改代码,避免相互覆盖

@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);

int width = getWidth();
int height = getHeight();

mPaint.setColor(Color.GRAY);
canvas.drawRect(0, 0, width, height/4, mPaint);

mPaint.setColor(Color.CYAN);
canvas.drawRect(0, height/4, width, height/3, mPaint);

mPaint.setColor(Color.DKGRAY);
canvas.drawRect(0, height/3, width, height/2, mPaint);

mPaint.setColor(Color.LTGRAY);
canvas.drawRect(0, height/2, width, height, mPaint);
}

优化效果



busyondraw优化

点击按钮时会出现明显的卡顿现象,从以下代码中可以判断,造成该问题的原因应该是onDraw()方法中的耗时操作

@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);

for (int i = 0; i < 1000; i++) {
System.out.println("canvas = [" + canvas + "]" + i);
}

Paint paint = new Paint();
paint.setColor(Color.RED);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(4);
int radius = Math.min(getWidth(), getHeight()) / 2;
canvas.drawCircle(getWidth()/2, getHeight()/2, radius, paint);
}

优化方案:将耗时操作移入到子线程中

new Thread(new Runnable() {
@Override
public void run() {
for (int i = 0; i < 1000; i++) {
System.out.println("canvas = [" + canvas + "]" + i);
}
}
}).start();