canvas教程

Canvas之translate、scale、rotate、skew方法讲解!,canvasskew(5)

字号+ 作者:H5之家 来源:H5之家 2017-06-16 12:00 我要评论( )

再在y轴上倾斜45度看看: @Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);canvas.drawColor(Color.BLUE);canvas.drawRect(new Rect(0, 0, 400, 400), mPaint);// y 方向上倾斜45 度canvas.s


再在y轴上倾斜45度看看:

@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); canvas.drawColor(Color.BLUE); canvas.drawRect(new Rect(0, 0, 400, 400), mPaint); // y 方向上倾斜45 度 canvas.skew(0, 1); mPaint.setColor(0x8800ff00); canvas.drawRect(new Rect(0, 0, 400, 400), mPaint); }此时效果如下:



关于Canvas(画布)的translate(平移)、scale(缩放) 、rotate(旋转) 、skew(错切)就说这么多,这些方法都不复杂,而灵活的使用往往能解决绘制中很多看似复杂的问题,所以重在理解,并在看到与之相关的效果时能够及时恰当的进行关联。


当然对Canvas的操作往往使用Matrix(后面会单独讲)也能达到同样的效果,想看例子可参考 一个绚丽的loading动效分析与实现!


源码下载链接




 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • canvas-vue

    canvas-vue

    2017-06-16 12:00

  • 如何使用HTML5 Canvas动态的绘制拓扑图

    如何使用HTML5 Canvas动态的绘制拓扑图

    2017-06-16 11:00

  • Canvas 绘图怎么旋转图片,不是画布旋转?

    Canvas 绘图怎么旋转图片,不是画布旋转?

    2017-06-16 10:03

  • HTML5 Canvas基本线条绘制的实例教程,html5canvas

    HTML5 Canvas基本线条绘制的实例教程,html5canvas

    2017-06-16 10:00

网友点评
a