Android UI效果之绘图篇(二)

2019-12-10 19:02:26王旭

Android UI效果之绘图篇(二)

其他的drawXxx方法这里就不再赘述,大家可以一一去尝试。 
这里再来看下canvas中几个比较重要的方法:

canvas.save();
canvas.restore();
canvas.translate(dx, dy);
canvas.rotate(degrees);
canvas.saveLayer(bounds, paint, saveFlags);

save():把当前的绘制的图像保存起来,让后续的操作相当于是在一个新的图层上的操作。 
restore():将sava()之前的图层和save之后的图层进行合并操作 
translate():画布平移 
rotate():画布旋转 
大家可能会有疑问,既然我们可以利用坐标系来定位画布中的所有坐标点,为什么还要画布平移和画布旋转的api呢?现在假设有这样一个需求,需要绘制一个仪表盘,而绘制仪表盘的刻度我们可以利用三角函数sin cos 来计算出相应的偏移角度,当然这对于数学学霸来说很easy,一般人而言就需要把三角函数的公式翻个遍了,所以谷歌工程师,为我们实现平移和旋转的api,遇到类似于仪表盘的效果是,只需要旋转当前画布就能实现相应的效果,为我们节省了计算量和工作量。

paint.setColor(0xff00ccff);
  paint.setAntiAlias(true);
  paint.setStyle(Style.STROKE);
  canvas.translate(canvas.getWidth() / 2, 200); // 将位置移动画纸的坐标点,不用每次都从坐标原点计算
  canvas.drawCircle(0, 0, 100, paint); 
  Paint tmpPaint = new Paint(paint); 
  tmpPaint.setStrokeWidth(1);
  float y = 100;
  int count = 60; // 总刻度数
  for (int i = 0; i < count; i++) {
   if (i % 5 == 0) {
    canvas.drawLine(0f, y, 0, y + 12f, paint);
    canvas.drawText(String.valueOf(i / 5 + 1), -4f, y + 25f,
      tmpPaint);
   } else {
    canvas.drawLine(0f, y, 0f, y + 5f, tmpPaint);
   }
   canvas.rotate(360 / count, 0f, 0f); // 旋转画纸
  }
  // 绘制指针
  paint.setStrokeWidth(2);
  canvas.drawLine(0, 10, 0, -65, paint);
  paint.setStrokeWidth(4);
  canvas.drawLine(0, 10, 20, -35, paint);