一些canvas的公共方法

/**
 * 绘制文本
 * @param {Object} ctx canvas实例
 * @param {Object} title 文本标题 - string
 * @param {Object} color 文本颜色 - string
 * @param {Object} font	文本字号大小 - int
 * @param {Object} align 文本对齐方式 - string
 * @param {Object} bold 文本是否加粗 - boolean
 * @param {Object} x 文本x轴距离 - int
 * @param {Object} y 文本y轴距离 - int
 */
export function drawText(ctx,title,color,font,align,bold,x,y){
	ctx.beginPath();
	let titleFont = uni.upx2px(font)
	let titleX = uni.upx2px(x)
	let titleY = uni.upx2px(y)
	ctx.setFillStyle(color)//文字颜色
	ctx.setFontSize(titleFont)
	ctx.textAlign = align
	if(bold){
		ctx.font = `normal bold ${titleFont}px serif` //加粗
	}else{
		ctx.font = `normal ${titleFont}px serif` //正常
	}
	ctx.fillText(title,titleX,titleY);
	ctx.stroke();
	ctx.closePath();
}

/**
 * 绘制圆点
 * @param {Object} ctx canvas实例
 * @param {Object} bgColor 圆的颜色 - string
 * @param {Object} x x轴距离 - int
 * @param {Object} y y轴距离 - int
 * @param {Object} r 半径 - int
 */
export function drawArc(ctx,bgColor,x,y,r){
	ctx.beginPath()
	let startX = uni.upx2px(x)
	let starty = uni.upx2px(y)
	let startR = uni.upx2px(r) //圆的半径
	ctx.arc(startX, starty, startR, 0, 2 * Math.PI)
	ctx.fillStyle = bgColor //填充颜色
	ctx.fill()
	ctx.closePath()
}

/**
 * canvas绘制带圆角的长方形或正方形
 * @param {Object} ctx canvas实例
 * @param {int} w 宽
 * @param {int} h 高
 * @param {int} x x轴距离 - int
 * @param {int} y y轴距离 - int
 * @param {int} r 半径 - int
 * @param {string} color 填充颜色
 */
export function shapeBorderRadius(ctx,w,h,x,y,r,color){
	let clipW = uni.upx2px(w) //宽尺寸
	let clipH = uni.upx2px(h) //高尺寸
	let clipX = uni.upx2px(x)
	let clipY = uni.upx2px(y)
	let clipR = uni.upx2px(r) //圆角
	ctx.beginPath();
	//绘制上直线与右上角圆角
	ctx.moveTo(clipX + clipR, clipY);
	ctx.arcTo(clipX + clipW, clipY, clipX + clipW, clipY + clipR, clipR);
	// 右边直线
	ctx.lineTo(clipX + clipW, clipY + clipH - clipR);
	// 右下角圆角
	ctx.arcTo(clipX + clipW , clipY + clipH, clipX + clipW - clipR, clipY + clipH, clipR);
	// 下边直线
	ctx.lineTo(clipX + clipR, clipY + clipH);
	//左下角圆角
	ctx.arcTo(clipX,clipY + clipH,clipX,clipY + clipH - clipR,clipR)
	//左边直线
	ctx.lineTo(clipX, clipY + clipR);
	// 左上角圆角
	ctx.arcTo(clipX,clipY,clipX+clipR,clipY,clipR)
	ctx.fillStyle = color;
	ctx.fill();
	ctx.closePath();
}