canvas常用方法

简介: 牙叔教程 简单易懂

牙叔教程 简单易懂


画笔常用方法

let paint=new Paint();
paint.setColor(Color.GRAY);
paint.setStyle(Paint.Style.STROKE);
paint.setStyle(Paint.Style.FILL);
paint.setStrokeWidth(20);
paint.setTextSize(10);
paint.setTextAlign(Paint.Align.CENTER);
paint.setXfermode(null);
// 方法 指定参数类型
p["setShadowLayer(float,float,float,int)"](100, 0, 0, new java.lang.Long(Color.RED));
p["setShadowLayer(float,float,float,int)"](100, 0, 0, $colors.RED);
// 构造函数 指定参数类型
let radialGradient = new RadialGradient["(float,float,float,int[],float[],android.graphics.Shader$TileMode)"](
  centerX,
  centerY,
  radius,
  radialColors,
  positionList,
  Shader.TileMode.REPEAT
);


文字宽高

fontMetrics = paint.getFontMetrics();
let contentHeight = fontMetrics.bottom - fontMetrics.top;
let textBound = new android.graphics.Rect();
let content = "公众号: 牙叔教程";
textPaint.getTextBounds(content, 0, content.length, textBound);
log(textBound.height());
let rect = new android.graphics.Rect();
paint.getTextBounds("1", 0, 1, rect);
textHeight = rect.height();


圆角矩形path

// 添加统一圆角的圆角矩形,
// rect:矩形区域,
// rx:椭圆圆角的横轴半径,
// ry:椭圆圆角的纵轴半径,
// dir:线的闭合方向(CW顺时针方向 | CCW逆时针方向)
mPath.addRoundRect(
  new RectF(0, 0, mRectF.right - 0, mRectF.bottom - 0),
  rx,
  y,
  Path.Direction.CW
);


圆形path

let path = new Path();
// float x:圆心X轴坐标
// float y:圆心Y轴坐标
// float radius:圆半径
// Path.Direction有两个值:
// Path.Direction.CCW:是counter-clockwise缩写,指创建逆时针方向的矩形路径;
// Path.Direction.CW:是clockwise的缩写,指创建顺时针方向的矩形路径;
path.addCircle(x, y, radius, dir);


直线path

let path = new Path();
path.moveTo(x0, y0);
path.lineTo(x1, y1);
path.lineTo(x2, y2);
path.close();


清空画板

canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
canvas.drawColor(android.graphics.Color.TRANSPARENT, android.graphics.PorterDuff.Mode.CLEAR);


画红色

canvas.drawColor(Color.RED);


画圆

// x, y, radius
// public void drawCircle (float cx, float cy, float radius, Paint paint)
canvas.drawCircle(500,500,500, paint);


画字

// drawText(String text, float x, float y, Paint paint)
canvas.drawText('公众号: 牙叔教程', x, y, paint);


移动坐标原点

canvas.translate(x, y);


画线

canvas.drawLine(x1, y1, x2, y2, paint);


裁剪path

let path = new Path();
path.addRect(rect, Path.Direction.CW);
canvas.clipPath(path);


ValueAnimator

var valueAnimator = android.animation.ValueAnimator.ofFloat(circle.y - radius - 66, circle.y + radius + 66);
valueAnimator.setDuration(4000);
valueAnimator.addUpdateListener(
  new android.animation.ValueAnimator.AnimatorUpdateListener({
    onAnimationUpdate: function (valueAnimator) {
      line.y = valueAnimator.getAnimatedValue();
    },
  })
);
valueAnimator.setRepeatCount(android.animation.ValueAnimator.INFINITE);
valueAnimator.start();


名人名言


思路是最重要的, 其他的百度, bing, stackoverflow, github, 安卓文档, autojs文档, 最后才是群里问问
--- 牙叔教程


声明


部分内容来自网络
本教程仅用于学习, 禁止用于其他用途

相关文章
|
11天前
|
XML 存储 前端开发
canvas与svg的区别
canvas与svg的区别
20 4
|
11天前
|
XML 前端开发 JavaScript
Canvas 和 SVG 的区别
Canvas 和 SVG 的区别
15 0
|
16天前
|
XML 移动开发 前端开发
Canvas和SVG的区别
Canvas和SVG的区别
28 0
|
2月前
|
移动开发 前端开发 JavaScript
|
5月前
|
XML 存储 前端开发
canvas和svg的区别
canvas和svg的区别
|
5月前
|
XML 前端开发 JavaScript
canvas和svg有什么区别
canvas和svg的区别
|
11月前
|
XML 前端开发 JavaScript
canvas 和 svg 的区别是什么
canvas 和 svg 的区别是什么
75 0
|
5月前
|
前端开发 算法 计算机视觉
用canvas消除锯齿的方式
用canvas消除锯齿的方式
207 0
|
5月前
|
XML 移动开发 前端开发
Canvas和SVG有什么区别?
Canvas和SVG有什么区别?
57 1