之前我们已经详细的分析过clipRect函数了
Android画布剪裁函数clipRect详解
今天我们主要的是针对自定义控件的OverDraw做优化,下面直接上demo,先直观感受一下:
public class OverdrawDemo extends View {
private Bitmap[] mCards = new Bitmap[3];
private int[] mIngId = new int[]{R.drawable.icon_a, R.drawable.icon_k, R.drawable.icon_q};
public OverdrawDemo(Context context) {
super(context);
initBitmap();
}
public OverdrawDemo(Context context, AttributeSet attrs) {
super(context, attrs);
initBitmap();
}
public OverdrawDemo(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initBitmap();
}
private void initBitmap() {
Bitmap bitmap = null;
for (int i = 0; i < mCards.length; i++) {
bitmap = BitmapFactory.decodeResource(getResources(), mIngId[i]);
// 创建缩放图
mCards[i] = Bitmap.createScaledBitmap(bitmap, 400, 600, false);
mCards[i] = bitmap;
}
setBackgroundColor(0xffffffff);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.save();
canvas.translate(120, 0);
for (Bitmap bm : mCards) {
canvas.translate(120, 0);
canvas.drawBitmap(bm, 0, 0, null);
}
canvas.restore();
}
}
从上面的大概知道我们要做的事情,就是将三张图片重叠展示(Activity里面的代码,只是将上面的自定义View展示出来)。其实我们就是模仿扑克游戏里面的扑克牌摆放。那么我们现在将demo运行起来并来看看是否存在过度绘制的情况。
什么是过度绘制以及怎么调试过度绘制
在上图中,出现了大片的粉丝,甚至还有小片的红色的红色区域。这会直接导致我们应用卡顿。这不是我们想要的,是时候用clipRect来改变这一切了。只是在onDraw的时候稍作改动,就会产生不一样的结果,具体代码如下:
@Override protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.save();
canvas.translate(120, 0);
for (int i = 0; i < mCards.length; i++) {
canvas.translate(120, 0);
canvas.save();
if (i < mCards.length - 1) {
canvas.clipRect(0, 0, 120, mCards[i].getHeight());
}
canvas.drawBitmap(mCards[i], 0, 0, null);
canvas.restore();
}
canvas.restore();
}
其实clipRect函数就是通过巧妙的剪裁和拼接画布,将自定义控件中重叠的部分,做优化处理。
更多关于clipRect的使用技巧