canvas教程

Android 2D Graphics学习(2)、Canvas篇1、Canvas基本使用

字号+ 作者:H5之家 来源:H5之家 2016-11-11 17:00 我要评论( )

Android 2D Graphics学习(2)、Canvas篇1、Canvas基本使用 2016-11-07 19:54 | 61人阅读 | 来源 Android 2D Graphics学习(二)、Canvas篇1、Canvas基本使用 Canvas的意思是画布,表现在屏幕上就是一块区域,我们可以再上面使用各种API绘制我们想要的东西。

Android 2D Graphics学习(2)、Canvas篇1、Canvas基本使用

2016-11-07 19:54 | 61人阅读 | 来源

Android 2D Graphics学习(二)、Canvas篇1、Canvas基本使用
Canvas的意思是画布,表现在屏幕上就是一块区域,我们可以再上面使用各种API绘制我们想要的东西。可以说,Canvas贯穿整个2D Graphics,android.graphics中的所有类,几乎都于Canvas有直接或间接的联系。所以了解Canvas是学习2D Graphics的基础。

Android官方文档对Canvas的简介很好的介绍了Canvas的使用:

The Canvas class holds the "draw" calls. To draw something, you need 4 basic components: A Bitmap to hold the pixels,  a Canvas to host the draw calls (writing into the bitmap), a drawing primitive (e.g. Rect, Path, text, Bitmap), and a paint (to describe the colors and styles for the drawing). 一个Canvas对象有四大基本要素:

1、一个用来保存像素的Bitmap

2、一个Canvas在Bitmap上进行绘制操作

3、绘制的东西

4、绘制的画笔Paint


1、如何获得一个Canvas对象。

Canvas对象的获取方式有三种:

第一种我们通过重写View.onDraw方法,View中的Canvas对象会被当做参数传递过来,我们操作这个Canvas,效果会直接反应在View中。

第二种就是当你想自己创建一个Canvas对象。从上面的基本要素可以明白,一个Canvas对象一定是结合了一个Bitmap对象的。所以一定要为一个Canvas对象设置一个Bitmap对象。

//得到一个Bitmap对象,当然也可以使用别的方式得到。但是要注意,改bitmap一定要是mutable(异变的) Bitmap b = Bitmap.createBitmap(100,100, Bitmap.Config.ARGB_8888); Canvas c = new Canvas(b); /*先new一个Canvas对象,在调用setBitmap方法,一样的效果 * Canvas c = new Canvas(); * c.setBitmap(b); */第三种方式,是调用SurfaceHolder.lockCanvas(),返回一个Canvas对象。


2、Canvas能绘制什么

Canvas类提供了一系列的draw...方法,从这些方法的名字就可以知道Canvas可以绘制的对象。

1、填充

public void drawARGB(int a, int r, int g, int b) public void drawColor(int color) public void drawRGB(int r, int g, int b) public void drawColor(int color, PorterDuff.Mode mode) 因为Canvas内部维持了一个mutable Bitmap,所以,它可以使用这些颜色去填充整个Bitmap。并且在API中提到(restricted to the current clip)受限制于clip的范围


 public void drawPaint(Paint paint)

同理,Canvas也可以使用画笔去填充整个Bitmap,同样和填充颜色一样受限制于clip的范围,API中明确指出(This is equivalent (but faster) to drawing an
 infinitely large rectangle with the specified paint)这相当于用指定的画笔画一个更大范围的矩形,但是速度更快。

其实在Skia内部,填充调用的都是drawPaint方法的。



2、绘制几何图像

canvas.drawArc (扇形)

canvas.drawCircle(圆)

canvas.drawOval(椭圆)

canvas.drawLine(线)

canvas.drawPoint(点)

canvas.drawRect(矩形)

canvas.drawRoundRect(圆角矩形)

canvas.drawVertices(顶点)

cnavas.drawPath(路径)


3、绘制图片

canvas.drawBitmap (位图)

canvas.drawPicture (图片)


4、文本

canvas.drawText


上面列举的是Canvas所能绘制的基本内容,在实际使用中,可以使用各种过滤或者过度模式,或者其他手段,来达到绘制各种效果。


3、Canvas的变换

如果只是那些简单的draw...方法,那么canvas的功能就太单调了。Canvas还提供了一系列位置转换的方法:rorate、scale、translate、skew(扭曲)等。

@Override protected void onDraw(Canvas canvas) { canvas.translate(100, 100); canvas.drawColor(Color.RED);//可以看到,整个屏幕依然填充为红色 canvas.drawRect(new Rect(-100, -100, 0, 0), new Paint());//缩放了 canvas.scale(0.5f, 0.5f); canvas.drawRect(new Rect(0, 0, 100, 100), new Paint()); canvas.translate(200, 0); canvas.rotate(30); canvas.drawRect(new Rect(0, 0, 100, 100), new Paint());//旋转了 canvas.translate(200, 0); canvas.skew(.5f, .5f);//扭曲了 canvas.drawRect(new Rect(0, 0, 100, 100), new Paint()); // canvas.setMatrix(matrix);//Matrix的使用在后面在是。 }


Canvas虽然内部保持了一个Bitmap,但是它本身并不代表那个Bitmap,而更像是一个图层。我们对这个图层的平移旋转和缩放等等操作,并不影响内部的Bitmap,仅仅是改变了该图层相对于内部Bitmap 的坐标位置、比例和方向而已。


4、Canvas的保存和回滚

为了方便一些转换操作,Canvas还提供了保存和回滚属性的方法(save和restore),比如你可以先保存目前画纸的位置(save),然后旋转90度,向下移动100像素后画一些图形,画完后调用restore方法返回到刚才保存的位置。

Canvas提供的该功能的API如下:

/** * 保存当前的matrix和clip到私有的栈中(Skia内部实现)。任何matrix变换和clip操作都会在调用restore的时候还原。 * @return 返回值可以传入到restoreToCount()方法,以返回到某个save状态之前。 */ public native int save(); /** * 传入一个标志,来表示当restore 的时候,哪些参数需要还原。该参数定义在Canvas中,参照下面。 * save()方法默认的是还原matrix和clip,但是可以使用这个方法指定哪些需要还原。并且只有指定matrix和clip才有效,其余的几个参数是 * 用于saveLayer()和saveLayerAlpha()方法 的。 */ public native int save(int saveFlags); /** * 回到上一个save调用之前的状态,如果restore调用的次数大于save方法,会出错。 */ public native void restore(); /** * 返回栈中保存的状态,值等译 save()调用次数-restore()调用次数 */ public native int getSaveCount(); /** * 回到任何一个save()方法调用之前的状态 */ public native void restoreToCount(int saveCount); /**saveFlags的参数*/ public static final int MATRIX_SAVE_FLAG = 0x01;//需要还原Matrix public static final int CLIP_SAVE_FLAG = 0x02;//需要还原Clip /**下面三个参数在saveLayer的时候使用,具体作用,没有搞明白*/ public static final int HAS_ALPHA_LAYER_SAVE_FLAG = 0x04; public static final int FULL_COLOR_LAYER_SAVE_FLAG = 0x08; public static final int CLIP_TO_LAYER_SAVE_FLAG = 0x10; public static final int ALL_SAVE_FLAG = 0x1F; //还原所有 /*关于saveLayer的具体flags还不大明白它的含义,具体怎么使用在下面例子中*/ public int saveLayer(RectF bounds, Paint paint, int saveFlags) public int saveLayer(float left, float top, float right, float bottom, Paint paint, int saveFlags) public int saveLayerAlpha(RectF bounds, int alpha, int saveFlags) public int saveLayerAlpha(float left, float top, float right, float bottom, int alpha, int saveFlags)



saveLayer

 

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

相关文章
  • Android自定义组件系列【9】Canvas绘制折线图

    Android自定义组件系列【9】Canvas绘制折线图

    2016-11-11 11:00

  • Android仿微信二维码和条形码

    Android仿微信二维码和条形码

    2016-11-11 10:00

  • 2D绘图的学习Paint,Canvas(一)

    2D绘图的学习Paint,Canvas(一)

    2016-11-07 17:00

  • canvas学习—生长的小树

    canvas学习—生长的小树

    2016-11-07 16:00

网友点评
<