android中canvas使用基础教程,Android中canvas基本使用

最新推荐文章于 2025-06-01 19:47:55 发布
最新推荐文章于 2025-06-01 19:47:55 发布
阅读量1.2k 收藏 1
点赞数
文章标签： android中canvas使用基础教程
本文详细介绍了使用Android Canvas API绘制扇形、圆形、椭圆、线、点、矩形、圆角矩形、路径、位图和文字的基本方法，并展示了如何运用裁剪功能实现各种图形效果，包括矩形裁剪、路径运算和复杂的区域裁剪操作。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

canvas绘制

基本方法：

canvas.drawArc ()//(扇形)

canvas.drawCircle()//(圆)

canvas.drawOval()//(椭圆)

canvas.drawLine()//(线)

canvas.drawPoint()//(点)

canvas.drawRect()//(矩形)

canvas.drawRoundRect()//(圆角矩形)

canvas.drawVertices()//(顶点)(不了解)

canvas.drawPath()//(路径)

canvas.drawBitmap()// (位图)

canvas.drawText()// (文字)

1.扇形：

/**

* author : zhangy

*

* des : 画扇形,圆心为外接矩形的中心

*

* date : 2016/4/18

*/

private void drawArc(Canvas canvas) {

RectF rectF = new RectF(0, 0, 100, 100);

Log.d("yang","left:" + rectF.left + "top:" +rectF.top + "right:" + rectF.right + "bottom:" + rectF.bottom);

paint.setColor(Color.parseColor("#33333333"));

//oval :指定圆弧的外轮廓矩形区域。

//startAngle: 圆弧起始角度，单位为度。从180°为起始点

//sweepAngle: 圆弧扫过的角度，顺时针方向，单位为度。

//useCenter: 如果为True时，在绘制圆弧时将圆心包括在内，通常用来绘制扇形。如果false会将圆弧的两端用直线连接

//paint: 绘制圆弧的画板属性，如颜色，是否填充等

// public void drawArc(@NonNull RectF oval, float startAngle, float sweepAngle, boolean useCenter,@NonNull Paint paint)

canvas.drawRect(rectF,paint);

paint.setColor(Color.parseColor("#ff0000"));

canvas.drawArc(rectF,0,90,true,paint);

}

第三个参数传true

5b0de0493a76

第三个参数传false

5b0de0493a76

2.圆：

/**

* author : zhangy

*

* des : 画圆

*

* date : 2016/4/18

*/

private void drawCircle(Canvas canvas) {

paint.setColor(Color.GREEN);

//cx ： 圆心在x轴上的坐标

//cy : 圆心的y轴上的坐标

//radius: 半径

//public void drawCircle(float cx, float cy, float radius, @NonNull Paint paint)

canvas.drawCircle(50,50,50,paint);

}

5b0de0493a76

3.椭圆：

/**

* author : zhangy

*

* des : 画椭圆

*

* date : 2016/4/18

*/

private void drawOval(Canvas canvas) {

paint.setColor(Color.BLACK);

RectF rectF = new RectF(0, 0, 150, 100);

//oval : 外接矩形

//public void drawOval(@NonNull RectF oval, @NonNull Paint paint)

canvas.drawOval(rectF,paint);

}

5b0de0493a76

4.线：

/**

* author : zhangy

*

* des : 画线

*

* date : 2016/4/18

*/

private void drawLine(Canvas canvas) {

//public void drawLine(float startX, float startY, float stopX, float stopY,@NonNull Paint paint)

canvas.drawLine(0,0,100,100,paint);

canvas.translate(0,110);

//画一组线

float[] pts={0,0,100,0,

100,0,100,100,

100,100,0,100,

1,100,1,0};

//线宽

paint.setStrokeWidth((float) 2.0);

//pts : 绘制直线的端点数组，每条直线占用4个数据。

//public void drawLines(@Size(min=4,multiple=2) @NonNull float[] pts, @NonNull Paint paint)

// canvas.drawLines(pts, paint);

//offset : 指定跳过的数据个数

//count : 指定取出数据的个数

//public void drawLines(@Size(min=4,multiple=2) float[] pts, int offset, int count, Paint paint)

canvas.drawLines(pts,4,12,paint);

}

5b0de0493a76

5.点：

/**

* author : zhangy

*

* des : 画点

*

* date : 2016/4/18

*/

private void drawPoint(Canvas canvas) {

paint.setStrokeWidth((float) 5.0);

canvas.drawPoint(50,50,paint);

canvas.translate(0,100);

float[] pst = {20,20,40,40,60,60};

paint.setColor(Color.RED);

canvas.drawPoints(pst,paint);

canvas.translate(0,100);

//跳过前两个元素

canvas.drawPoints(pst,2,4,paint);

}

5b0de0493a76

6.矩形：

/**

* author : zhangy

*

* des : 画矩形

*

* date : 2016/4/18

*/

private void drawRect(Canvas canvas) {

canvas.drawRect(0,0,100,100,paint);

canvas.translate(0,110);

canvas.drawRect(new RectF(0,0,100,100),paint);

canvas.translate(0,110);

canvas.drawRect(new Rect(0,0,100,100),paint);

}

5b0de0493a76

7.圆角矩形：

/**

* author : zhangy

*

* des : 画圆角矩形

*

* date : 2016/4/18

*/

private void drawRoundRect(Canvas canvas) {

paint.setColor(Color.BLUE);

//rect : 要绘制的矩形

//rx : x轴方向的弧度

//ry : y轴方向上的弧度

//public void drawRoundRect(@NonNull RectF rect, float rx, float ry, @NonNull Paint paint)

canvas.drawRoundRect(new RectF(0,0,100,100),10,10,paint);

//其他重载方法类似

}

5b0de0493a76

8.路径：

/**

* author : zhangy

*

* des : 画路径

*

* date : 2016/4/18

*/

private void drawPath(Canvas canvas) {

Path path = new Path(); //Path对象

path.moveTo(10, 50); //起始点

path.lineTo(50, 50); //连线到下一点

path.lineTo(10, 150); //连线到下一点

path.lineTo(50, 100); //连线到下一点

path.lineTo(50, 100); //连线到下一点

paint.setColor(Color.RED);

canvas.drawPath(path, paint); //绘制任意多边形

}

5b0de0493a76

9.位图：

/**

* author : zhangy

*

* des : 画位图

*

* date : 2016/4/18

*/

private void drawBitmap(Canvas canvas) {

Bitmap bitmap=((BitmapDrawable)getResources().getDrawable(R.mipmap.ic_launcher)).getBitmap();

//left : 位图距左边的偏移量

//top : 位图距顶部的偏移量

//public void drawBitmap(@NonNull Bitmap bitmap, float left, float top, @Nullable Paint paint)

// canvas.drawBitmap(bitmap,0,0,paint);

Rect rect = new Rect(0, 0, 100, 100);

RectF rectf = new RectF(0, 0, 50, 50);

//src : 是对图片进行裁截，若是空null则显示整个图片

//dst ：是图片在Canvas画布中显示的区域，大于src则把src的裁截区放大， 小于src则把src的裁截区缩小。

//public void drawBitmap(@NonNull Bitmap bitmap, @Nullable Rect src, @NonNull RectF dst,@Nullable Paint paint)

canvas.drawBitmap(bitmap,rect,rectf,paint);

}

canvas.drawBitmap(bitmap,rect,rectf,paint)该方法是先用rect对原图进行裁剪，再根据rectf对裁剪后的图进行放大或缩小

5b0de0493a76

10.文字：

/**

* author : zhangy

*

* des : 绘制文字

*

* date : 2016/4/18

*/

private void drawText(Canvas canvas) {

paint.setTextSize(30);

Paint.FontMetrics fm = paint.getFontMetrics();

//x : 绘制时x轴偏移量

//y ：绘制时y轴偏移量

//drawText(@NonNull String text, float x, float y, @NonNull Paint paint)

canvas.drawText("zhangy",0,(fm.bottom - fm.top) / 2,paint);//这里要计算文字绘制的起点，因为文字是按baseLine来绘制的。

}

绘制文字时注意文字绘制的起点位置如果不是很清楚如何计算，请参考这里

5b0de0493a76

Canvas裁剪：

Canvas提供了ClipPath, ClipRect, ClipRegion 等方法来裁剪，通过Path, Rect ,Region 的不同组合，Android几乎可以支持任意现状的裁剪区域。

android.graphics包中定义了Point, Rect, Path, Region 这几种几何形状，Path可以为有圆弧，椭圆，二次曲线，三次曲线，线段，矩形等基本几何图形或是由这些基本几何图形组合而成，Path可以为开放或是闭合曲线。Rect提供了定义矩形的简洁方法。Region则支持通过区域的“加”，“减”，“并”，“异或”等逻辑运算由多个Region组合而成。Region.Op定义了Region支持的区域间运算种类。

Op是一个枚举，定义在Region类中。

假设用region1 去组合region2

public enum Op {

DIFFERENCE(0), //最终区域为region1 与 region2不同的区域

REPLACE(1); //最终区域为为region2的区域

INTERSECT(2), // 最终区域为region1 与 region2相交的区域

UNION(3), //最终区域为region1 与 region2组合一起的区域

XOR(4), //最终区域为region1 与 region2相交之外的区域

REVERSE_DIFFERENCE(5), //最终区域为region2 与 region1不同的区域

}

1.裁剪普通矩形：

我们先在canvas画布上裁剪出一个矩形作为背景(不贴图了)

这里canvas.save();和canvas.restore();是两个相互匹配出现的，作用是用来保存画布的状态和取出保存的状态的。这里稍微解释一下，

当我们对画布进行旋转，缩放，平移等操作的时候其实我们是想对特定的元素进行操作，比如图片，一个矩形等，但是当你用canvas的方法来进行这些操作的时候，其实是对整个画布进行了操作，那么之后在画布上的元素都会受到影响，所以我们在操作之前调用canvas.save()来保存画布当前的状态，当操作之后取出之前保存过的状态，这样就不会对其他的元素进行影响

/**

* author : zhangy

*

* des : 绘制背景

*

* date : 2016/4/18

*/

private void drawBg(Canvas canvas) {

canvas.clipRect(0, 0, 100, 100);

canvas.drawColor(Color.WHITE);

paint.setColor(Color.RED);

canvas.drawLine(0, 0, 100, 100, paint);

paint.setColor(Color.GREEN);

canvas.drawCircle(30, 70, 30, paint);

paint.setColor(Color.BLUE);

canvas.drawText("Clipping", 50, 50, paint);

}

2.相减(DIFFERENCE)： 最终区域为region1 与 region2不同的区域

/**

* author : zhangy

*

* des : 相减

*

* date : 2016/4/18

*/

private void drawDiff(Canvas canvas) {

canvas.save();

canvas.translate(10, 10);

canvas.clipRect(0, 0, 100, 100);

canvas.clipRect(30, 30, 70, 70, Region.Op.DIFFERENCE);

drawBg(canvas);

canvas.restore();

}

5b0de0493a76

3.替代(REPLACE)： 最终区域为为region2的区域

/**

* author : zhangy

*

* des : 替代

*

* date : 2016/4/18

*/

private void drawReplace(Canvas canvas) {

Path path = new Path();

canvas.save();

canvas.translate(10, 10);

path.reset();

canvas.clipPath(path); // makes the clip empty

path.addCircle(50, 50, 50, Path.Direction.CCW);

canvas.clipPath(path, Region.Op.REPLACE);

drawBg(canvas);

canvas.restore();

canvas.save();

canvas.translate(10, 10);

canvas.clipRect(0, 0, 60, 60);

canvas.clipRect(40, 40, 100, 100, Region.Op.REPLACE);

drawBg(canvas);

canvas.restore();

}

5b0de0493a76

4.相交(INTERSECT)：最终区域为region1 与 region2相交的区域

/**

* author : zhangy

*

* des : 交集

*

* date : 2016/4/18

*/

private void drawIntersect(Canvas canvas) {

canvas.save();

canvas.translate(10, 10);

canvas.clipRect(0, 0, 100, 100);

canvas.clipRect(30, 30, 70, 70, Region.Op.INTERSECT);

drawBg(canvas);

canvas.restore();

}

5b0de0493a76

5.并集(UNION)：最终区域为region1 与 region2组合一起的区域

/**

* author : zhangy

*

* des : 并集

*

* date : 2016/4/18

*/

private void drawUnion(Canvas canvas) {

canvas.save();

canvas.translate(10, 10);

canvas.clipRect(0, 0, 60, 60);

canvas.clipRect(40, 40, 100, 100, Region.Op.UNION);

drawBg(canvas);

canvas.restore();

}

5b0de0493a76

6.除相交(XOR)：最终区域为region1 与 region2相交之外的区域

/**

* author : zhangy

*

* des : 除相交

*

* date : 2016/4/18

*/

private void drawXor(Canvas canvas) {

canvas.save();

canvas.translate(10, 10);

canvas.clipRect(0, 0, 60, 60);

canvas.clipRect(40, 40, 100, 100, Region.Op.XOR);

drawBg(canvas);

canvas.restore();

}

5b0de0493a76

7.求同存异(REVERSE_DIFFERENCE)：最终区域为region2 与 region1不同的区域(后画的减去交集)

/**

* author : zhangy

*

* des : 求同存异

*

* date : 2016/4/18

*/

private void drawReverse(Canvas canvas) {

canvas.save();

canvas.translate(10, 10);

canvas.clipRect(0, 0, 60, 60);

canvas.clipRect(40, 40, 100, 100,

Region.Op.REVERSE_DIFFERENCE);

drawBg(canvas);

canvas.restore();

}

5b0de0493a76

Android Canvas的使用
lp598876762的博客
06-29 1433
Canvas 顾名思义，画布，在android的view绘制中应用非常广泛，通过它提供的api我们可以绘制各种图形以及对操作画布，如旋转、平移、裁剪等。 Canvas操作 canvas.translate(float x,float y); 表示平移画布，一般来说，Android的view是从屏幕左上角即（0，0）坐标点开始绘制，调用该api后，画布的起始坐标点不在是（0，0）而变成了参数中的（...
Android开发：Android Studio：自定义View与Canvas教程.pdf
10-24
例如，可以在onDraw()中使用Paint设置颜色，并通过Canvas绘制一个圆形。 在自定义View的过程中，通常需要设置和管理View的布局参数，这可以通过重写onMeasure()方法和使用LayoutParams来完成。onMeasure()方法用于...
Android中Canvas绘图基础详解
11-11
该代码是一个完整的Android工程，详细演示如了如何使用Android中的各种drawXXX方法，以及画笔Paint如何影响绘制的效果。 具体参见博文： http://blog.csdn.net/iispring/article/details/49770651
Android 2D Graphics学习（二）、Canvas篇1、Canvas基本使用
20386053
12-20 348
Canvas的意思是画布，表现在屏幕上就是一块区域，我们可以再上面使用各种API绘制我们想要的东西。可以说，Canvas贯穿整个2D Graphics，android.graphics中的所有类，几乎都于Canvas有直接或间接的联系。所以了解Canvas是学习2D Graphics的基础。Android官方文档对Canvas的简介很好的介绍了Canvas的使用： The Canvas cl...
安卓进阶----Canvas之绘制基本形状
最新发布
2303_76162328的博客
06-01 811
安卓
Android基础入门教程——8.3.16 Canvas API详解(Part 1)
热门推荐
Coder-Pig的猪栏
11-09 3万+
前面我们花了13小节详细地讲解了Android中Paint类大部分常用的API，本节开始我们来讲解 Canvas(画板)的一些常用API，我们在Android基础入门教程——8.3.1 三个绘图工具类详解 中已经列出了我们可供调用的一些方法，我们分下类： drawXxx方法族：以一定的坐标值在当前画图区域画图，另外图层会叠加， 即后面绘画的图层会覆盖前面绘画的图层。 clipXXX方法族：在当前的画图区域裁剪
android中canvas使用基础教程,android的canvas简单使用
weixin_42509196的博客
06-04 693
android的画图和java的画图是差不多的，他用到的的是android.graphics.Canvas。基本的原理就是先得到一个画布(canvas)，然后在来支笔(paint)，这样有纸有笔就可以画了吧。贴代码吧：//map类package margin.Map;import android.content.Context;import android.graphics.BitmapFacto...
Android基础软件源码(Canvas画布).zip
09-23
Android开发涉及到多种核心概念和技术，其中Canvas画布是Android图形用户界面(GUI)编程中一个非常基础且重要的组件。Canvas类似于一个绘图板，允许开发者在屏幕上绘制各种图形、文字和其他视觉元素。 Canvas画布的...
Android中使用Canvas绘制折线图教程
通过上述知识点的介绍，可以了解到Android开发中使用Canvas绘制折线图不仅涉及到Canvas类和Paint类的基本使用，还包括坐标点的处理、自定义View的创建、触摸事件的处理等。掌握这些知识点对于Android图形绘制开发...
Android自定义控件中Canvas画图教程
这样的教程通常会包含一些基础的代码示例，帮助读者更好地理解如何使用Canvas进行绘图，以及如何将这些概念应用到实际的Android开发中。 通过以上知识点，我们可以了解到Canvas提供了一系列的API来实现丰富多样的...
Android Canvas绘制静止时钟教程
在Android中，开发者可以使用Canvas来绘制自定义的图形界面，比如本例中的静止时钟。Canvas支持多种类型的绘制操作，包括绘制位图、画布裁剪、颜色过滤、变换操作等。 知识点四：Canvas的具体应用方法 在Android中...
安卓中Canvas使用方法
liujian8654562的博客
07-02 1465
更多技术内容请移步：我的个人博客一、前言今天是周日，昨天刚刚写完了一篇关于如何搭建LNMP环境，让自己可以DIY有个性的个人主页：http://blog.csdn.net/jiangwei0910410003/article/details/50929955那么今天，我们继续来看一篇关于Android中的UI篇，如何自定义视图View的进阶篇，关于前奏篇之前已经写过了，还没有了解的同学可以去看看：h
画了个Android
杨航的专栏
05-14 2876
<br />画了个Android<br /> <br /> <br />  今晚瞎折腾，闲着没事画了个机器人——android，浪费了一个晚上的时间。画这丫还真不容易，为那些坐标，差点砸了键盘，好在最后画出个有模有样的，心稍安。<br />   下面来看看画这么个机器人需要些什么东西：主要是Canvas类(android.graphics.Canvas)。Canvas类就是表示一块画布，你可以在上面画你想画的东西。当然，你还可以设置画布的属性，如画布的颜色/尺寸等。Canvas提供了如下一些方法：<br /
Android 中的Canvas画图
风平浪静的专栏
08-22 1万+
Android中有一个Canvas类，Canvas类就是表示一块画布，你可以在上面画你想画的东西。当然，你还可以设置画布的属性，如画布的颜色/尺寸等。Canvas提供了如下一些方法：    Canvas():创建一个空的画布，可以使用setBitmap()方法来设置绘制的具体画布；    Canvas(Bitmapbitmap):以bitmap对象创建一个画布，则将内容都绘制在bitm
Android Canvas简单使用
weixin_34242331的博客
06-02 146
转载请注明出处王亟亟的大牛之路 Android中使用图形处理引擎，2D部分是android SDK内部自己提供，3D部分是用Open GL ES 1.0。 今天写的是关于2D图像的一些简单使用。 图形处理来说，我们最常用到的就是在一个View上画一些图片、形状或者自定义的文本内容，这里我们都是使用Canvas来实现的。你可以获取V...
Android——Canvas（画布）的使用
lijieming159的博客
09-18 2504
Canvas的一些基本方法：Canvas():创建一个空的画布，可以使用setBitmap()方法来设置绘制的具体画布；Canvas(Bitmap bitmap):以bitmap对象创建一个画布，则将内容都绘制在bitmap上，bitmap不得为null;Canvas(GL gl):在绘制3D效果时使用，与OpenGL有关；drawColor:设置画布的背景色；setBitmap:设置具体的画布；c
android canvas 使用操作
Small_Wave_Wave的博客
07-16 638
最近在学习自定 View 的内容，发现其实在 onDraw()的时候可以对 Canvas 进行各种各样的操作，比如平移、旋转、缩放、倾斜当然还有切割画布和反向切割画布。下面就来根据实际操作介绍一下。 1.平移 translate //先设置画笔 mPaint.setStrokeWidth(5); mPaint.setStyle(Paint.S...
Android 中Canvas的使用
ds1012960151的专栏
08-18 426
一.Canvas类：  The Canvas Class holds the "draw" call. To draw something .you need 4 basic component .A Bitmap to hlod the pixels, a Canvas to host the draw calls(writing into the Bitmap) . a drawing  p
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值