canvas教程

Android中Canvas绘图基础详解(附源码下载) Android开发中文站(5)

字号+ 作者:H5之家 来源:H5之家 2017-03-04 13:00 我要评论( )

Canvas中提供了drawBitmap方法用于绘制Bitmap,其使用代码如下所示: private void drawBitmap(Canvas canvas){//如果bitmap不存在,那么就不执行下面的绘制代码if(bitmap == null){return;}//直接完全绘制Bitmapca

Canvas中提供了drawBitmap方法用于绘制Bitmap,其使用代码如下所示:

private void drawBitmap(Canvas canvas){ //如果bitmap不存在,那么就不执行下面的绘制代码 if(bitmap == null){ return; } //直接完全绘制Bitmap canvas.drawBitmap(bitmap, 0, 0, paint); //绘制Bitmap的一部分,并对其拉伸 //srcRect定义了要绘制Bitmap的哪一部分 Rect srcRect = new Rect(); srcRect.left = 0; srcRect.right = bitmap.getWidth(); srcRect.top = 0; srcRect.bottom = (int)(0.33 * bitmap.getHeight()); float radio = (float)(srcRect.bottom - srcRect.top) / bitmap.getWidth(); //dstRecF定义了要将绘制的Bitmap拉伸到哪里 RectF dstRecF = new RectF(); dstRecF.left = 0; dstRecF.right = canvas.getWidth(); dstRecF.top = bitmap.getHeight(); float dstHeight = (dstRecF.right - dstRecF.left) * radio; dstRecF.bottom = dstRecF.top + dstHeight; canvas.drawBitmap(bitmap, srcRect, dstRecF, paint); }

界面如下所示:

这里写图片描述

我在res/drawable目录下放置了一张android的图片,下面对上面的代码进行说明:

  • Canvas的drawBitmap有多个重载方法,最简单的方法签名是:public void drawBitmap (Bitmap bitmap, float left, float top, Paint paint)该方法除了传入bitmap对象外,还需要传入left和top,left和top组成了一个坐标,决定了在Canvas中从哪个地方绘制Bitmap。在我们的代码中,left和top都设置为0,所以我们就在Canvas的左上角绘制了bitmap。
  • drawBitmap还有一个比较实用的方法,其方法签名是:public void drawBitmap (Bitmap bitmap, Rect src, Rect dst, Paint paint)该方法有两个功能:1.只绘制原有bitmap对象的一部分,2.还可以将要绘制的bitmap缩放到指定的区域。
  • 只绘制原有bitmap对象的一部分
    我们知道Bitmap是一个矩形,其是有宽度和高度的,也就说以bitmap对象本身作为坐标系(原点在bitmap左上角),我们可以构建一个Rect对象,如果满足left为0,top为0,right为bitmap的宽度,bottom为bitmap的高度,那么就说名我们要绘制整个Bitmap。但是有时候我们只想绘制Bitmap的一部分,例如我们上面的图中所示,我们想只绘制Android图像的头部区域怎么办呢?办法是我们构建一个Rect对象,定义我们要绘制Bitmap的哪些部位。
    比如我们通过代码srcRect.bottom = (int)(0.33 * bitmap.getHeight())指定了我们只绘制bitmap对象头部1/3的位置,即Android图像的头部,这样我们用该指定的srcRect绘制bitmap时只绘制了其头部位置。需要特别注意的是,srcRect中left、top、right、bottom的值都是以Bitmap本身的局部坐标系为基础的。
  • 将要绘制的bitmap缩放到指定的区域
    有时候我们需要将原有的bitmap进行放大或缩小,如上图所示,我们将原有图片放大了,这怎么做呢?我们需要指定RectF类型的参数dstRectF,以便告诉Android将srcRect中定义的bitmap缩放到哪里。即Android会将srcRect中定义的bitmap缩放到dstRectF区域范围内。需要注意的是,此处的dstRecF是绘图坐标系中的坐标,不是Bitmap本身的局部坐标系。我们在代码中保证了dstRecF的长宽比与srcRect中的长宽比相同,这样不会导致图片长宽比例变形,效果见上图中的第二个放大的图形。
  • 此处有一点需要说明,在绘图结束退出Activity的时候,我们需要调用bitmap的recyle()方法,防止内存泄露,本程序在onDestroy()方法中执行了该方法。
  • 总结
  • Canvas通过drawXXX等一些列的绘图方法决定了要绘制的图形的外形,我们可以通过自由组合绘制出我们想要的效果。drawXXX方法中的坐标都是基于当前绘图坐标系的坐标,而非Canvas坐标系,默认情况下二者重合。通过调用translate、rotate、scale等方法可以对绘图坐标系进行变换。
  • 画笔Paint控制着所绘制的图形的具体外观,Paint默认的字体大小为12px,在绘制文本时我们往往要考虑密度density设置合适的字体大小。画笔的默认颜色为黑色,默认的style为FILL,默认的cap为BUTT,默认的线宽为0,参见下图所示:

    这里写图片描述

  • 在画面状的图形时,如果Paint的style是FILL,那么绘制的就是填充面;如果是STROKE,那么绘制的就是轮廓线。
  • 代码上传到CSDN,点此下载

    感谢大家耐心读完,希望文本对大家了解Canvas中的绘图基础有所帮助!

    转载请注明:Android开发中文站 » Android中Canvas绘图基础详解(附源码下载)

    继续浏览有关

     

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

    相关文章
    • 在canvas中插入图片,渐变

      在canvas中插入图片,渐变

      2017-03-04 14:02

    • 【Fanvas技术解密】HTML5 canvas实现脏区重绘

      【Fanvas技术解密】HTML5 canvas实现脏区重绘

      2017-03-04 12:03

    • Canvas学习:绘制线段

      Canvas学习:绘制线段

      2017-03-04 12:00

    • Fabric.js 1.7.7发布,简易JavaScript Canvas库

      Fabric.js 1.7.7发布,简易JavaScript Canvas库

      2017-03-03 18:00

    网友点评