Android Canvas 是 Android 系统中一个非常重要的绘图工具,它允许我们在 Android 应用程序中创建自定义的 2D 和 3D 绘图。本文将介绍 Android Canvas 的各种用法,包括平移缩放、画圆写字、抛物效果、.rotate、绘制 Z 轴、地球代码、绘制 XYZ 轴、画圆 Path 写字等方面。
一、android Canvas 平移缩放
平移和缩放是 Android 中画图的基本操作,下面我们来看看如何使用 Android Canvas 进行平移和缩放操作。
1、平移操作
我们可以使用 canvas.translate(dx, dy) 方法来对画布进行平移操作。
canvas.drawText("Hello, world!", 50, 50, mPaint); // 绘制文本
canvas.translate(100, 100); // 平移画布
canvas.drawText("Hello, world!", 50, 50, mPaint); // 绘制文本
上面的代码将会在画布上分别绘制两行文本,第一行文本在 (50, 50) 处绘制,第二行文本会在画布上向右平移 100,向下平移 100 后绘制(也就是在 (150, 150) 处绘制)。
2、缩放操作
另外,我们可以使用 canvas.scale(sx, sy) 来对画布进行缩放操作。
canvas.drawText("Hello, world!", 50, 50, mPaint); // 绘制文本
canvas.scale(2f, 2f); // 缩放画布
canvas.drawText("Hello, world!", 50, 50, mPaint); // 绘制文本
上面的代码将会绘制两行文本,第一行文本在 (50, 50) 处绘制,第二行文本会在画布上将字体放大 2 倍后绘制。
二、android Canvas 画圆写字
Android Canvas 可以非常轻松地绘制一些 2D 图形,本小节介绍如何使用 Android Canvas 绘制圆形和绘制文字。
1、绘制圆形
使用 canvas.drawCircle(x, y, radius, paint) 方法来绘制一个圆形:
canvas.drawCircle(100, 100, 50, mPaint); // 绘制一个半径为 50 的圆形
上面的代码将在画布上绘制一个坐标为 (100, 100) 的圆形,半径为 50,使用当前画笔(mPaint)进行绘制。
2、绘制文字
使用 canvas.drawText(text, x, y, paint) 方法来绘制文字。
canvas.drawText("Hello, world!", 100, 100, mPaint); // 在坐标 (100, 100) 处绘制 "Hello, world!" 文字
上面的代码将在画布上绘制一行文字 "Hello, world!",坐标为 (100, 100),使用当前画笔(mPaint)进行绘制。
三、android Canvas 抛物效果
抛物线是计算机绘图中经常使用的一个曲线,可以模拟仿真很多物理场景,下面我们来看看如何使用 Android Canvas 实现抛物效果。
private int mRadius = 20; // 小球半径
private int mDeltaX = 5; // 每次水平移动的距离
private int mDeltaY = 5; // 每次垂直移动的距离
private int mScreenWidth; // 屏幕宽度
private int mScreenHeight; // 屏幕高度
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawColor(Color.WHITE);
int x = getWidth() / 2;
int y = getHeight() / 2;
canvas.drawCircle(x, y, mRadius, mPaint);
// 计算小球下一次的位置
mDeltaY += 1;
x += mDeltaX;
y += mDeltaY;
// 判断是否撞击到边界
if (x <= mRadius || x >= mScreenWidth - mRadius) {
mDeltaX = -mDeltaX;
}
if (y <= mRadius || y >= mScreenHeight - mRadius) {
mDeltaY = -mDeltaY;
}
postInvalidateDelayed(10); // 刷新界面
}
上面代码实现了一个小球抛物的动画效果,启动该 View 后,小球会按照一定的速度移动并弹跳,直到撞到屏幕边界才会回弹。
四、android Canvas 的.rotate
Canvas 的 .rotate(float degrees, float px, float py) 方法可以对绘图进行旋转操作,其中 (px, py) 表示旋转的中心点。
canvas.drawRect(0, 0, 200, 200, mPaint); // 绘制一个矩形
canvas.translate(100, 100); // 将原点移动到 (100, 100)
canvas.rotate(45); // 以 (100, 100) 为中心点进行旋转
canvas.drawRect(0, 0, 200, 200, mPaint); // 绘制一个旋转后的矩形
上面的代码将会绘制两个矩形,第一个矩形将被绘制在画布的左上角位置,红色边框;第二个矩形在进行了画布平移操作后,进行了一次 45 度的旋转,并且以 (100, 100) 为中心点进行旋转操作。
五、android Canvas 缩放
Android Canvas 可以非常轻松地进行缩放操作,只需要对主函数进行的画布平移和旋转操作进行函数调用即可。
canvas.drawRect(0, 0, 200, 200, mPaint); // 绘制一个矩形
canvas.scale(0.5f, 0.5f); // 将画布缩小为原来的一半
canvas.drawRect(0, 0, 200, 200, mPaint); // 绘制一个缩小后的矩形
上面的代码将绘制两个矩形,第一个矩形位于画布的左上角,红色边框;第二个矩形进行了画布的缩放操作,缩小了一半。
六、android Canvas 绘制 Z 轴
在 3D 应用程序开发中,我们经常需要在屏幕上绘制一些 3D 图像,本小节将介绍如何使用 Android Canvas 绘制出 3D 空间中的 Z 轴。
Path path = new Path();
path.moveTo(0, 0);
path.lineTo(0, 200);
path.lineTo(20, 180);
path.lineTo(0, 200);
path.lineTo(-20, 180);
canvas.drawPath(path, mPaint);
上面的代码使用 canvas.drawPath() 方法来绘制 Z 轴,具体做法是先绘制垂直线段,然后绘制两条斜线段。
七、android Canvas 地球代码
下面提供一个 Android Canvas 绘制地球的实例代码,该代码使用 Bitmap、Matrix、Canvas 和 Paint 等多种 Android 绘图工具来完成,您可以将其复制到 Android 应用程序中进行测试。
public class EarthView extends View {
private Bitmap mBgBitmap;
private Bitmap mEarthBitmap;
private Matrix mMatrix;
private Paint mPaint;
public EarthView(Context context) {
super(context);
init();
}
public EarthView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
private void init() {
mBgBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.bg_stars);
mEarthBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_earth);
mMatrix = new Matrix();
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
// 绘制背景
canvas.drawBitmap(mBgBitmap, null, new RectF(0, 0, getWidth(), getHeight()), mPaint);
// 计算旋转角度
float degrees = (float) ((System.currentTimeMillis() / 10) % 360);
mMatrix.setRotate(degrees, mEarthBitmap.getWidth() / 2f, mEarthBitmap.getHeight() / 2f);
// 绘制地球
canvas.save();
canvas.translate(getWidth() / 2, getHeight() / 2);
canvas.drawBitmap(mEarthBitmap, mMatrix, mPaint);
canvas.restore();
invalidate(); // 刷新画面
}
}
上面的代码实现了一个类似于地球自转效果,并在背景上绘制了一张星空背景。
八、android Canvas 绘制 XYZ 轴
下面的代码会绘制出一个全方位的 XYZ 坐标系,使用了 Line 和 Path 两种对象来绘制。该做法较为简单,使用者可以根据实际需求进行更改。
canvas.drawLine(0, 0, 500, 0, paint); // X 轴
canvas.drawLine(0, 0, 0, 500, paint); // Y 轴
canvas.save();
canvas.translate(0, 500);
canvas.rotate(-90);
Path path = new Path();
path.moveTo(0, 0);
path.lineTo(20, 0);
path.lineTo(10, -20);
path.close();
canvas.drawPath(path, paint); // Z 轴
canvas.restore();
九、android Canvas 画圆 Path 写字
有时候我们也可以使用 Path 来帮助我们实现更加复杂的图案和文字等,下面的代码将绘制一个大圆饼图,并在圆心区域显示一段描述文字。
Path path = new Path();
path.addArc(new RectF(100, 100, 400, 400), -180, 180);
path.lineTo(250, 250);
path.close();
canvas.drawPath(path, paint); // 绘制扇形
canvas.drawTextOnPath("This is a message to show on the circle", path, 0, 0, mPaint); // 圆形中心文字
上面的代码绘制了一个具有描述文字的大圆饼图,并且使用了 Path 对象来绘制扇形。
本文介绍了 Android Canvas 的各种使用方法,包括平移缩放、画圆写字、抛物效果、.rotate、绘制 Z 轴、地球代码、绘制 XYZ 轴、画圆 Path 写字等方面,对于 Android 应用程序开发者而言,熟练掌握 Android Canvas 的使用是非常重要的。