资源描述：
《微信小程序开发(七).docx》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。
1、微信小程序开发(七)第七章绘图API第1节:绘图内容:1.矩形:+矩形(路径)Ctx.rect(x1,y1,x2,y2)+矩形(内实)Ctx.fillRect(x1,y1,x2,y2)+矩形(内空)Ctx.strokeRect(x1,y1,x2,y2)+矩形(清空)Ctx.clearRrct(x1,y1,x2,y2)2.路径:+路径(开始)Ctx.beginPath()+路径(填充)Ctx.fill()+路径(描边)Ctx.stroke()+路径(移点)Ctx.moveTo(x,y)+路径(连线)Ctx.lineTo(x,y)+路径(关闭)C
2、tx.closePath()3.圆弧:+画弧Ctx.arc(x,y,r,startAngle,endAngle)1.文字:+写字Ctx.fillText(‘text’,x,y)2.图片:+图片Ctx.drawImage(img,x,y)第2节:绘图设置:1.渐变:+渐变(线型)Ctx.createLinearGradient(x1,y1,x2,y3)+渐变(中心)Ctx.createCircularGradient(x,y,r)+渐变(实例)Varctx=wx.createCanvasContext(“myCanvas”);Vargrd=ct
3、x.createLinearGradient(0,0,100,0);Grd.addColorStop(0,”red”);Grd.addColorStop(1,“white”);Ctx.setFillStyle(grd);Ctx.fillRect(5,5,120,25);2.内边外:内:填充样式;边:边框样式;外:阴影样式+样式(填充)Ctx.setFillStyle(style)+样式(边框)Ctx.setStrokeStyle(style)+样式(阴影)Ctx.setShadow(offsetX,offsetY,blur,color)1.线
4、+线样式(粗细)Ctx.setLineWidth(width)+线样式(端点)Ctx.setLineCap(“round”)+线样式(交接)Ctx.setLineJoin(“round”)+线样式(斜度)Ctx.setMiteLimit(degree)2.文本:+文本(字号)Ctx.setFontSize(size)+文本(对齐)Ctx.setTextAlign(“center”)3.全局:+透明度(全局)Ctx.setGlobalAlpha(value)第3节:绘图变形:1.缩放:+缩放Ctx.scale(w,h)2.旋转:+旋转Ctx.r
5、otate(x,y)3.位移:+位移Ctx.tanslate(x,y)第4节:小程序级:1.创建画布+创建画布(常规)wx.createCanvasContentText(canvas-id)+创建画布(舍弃)wx.createContentText(canvas-id)2.输出图片+输出图片wx.canasToTempFilePath(path)第5节:画布级:1.绘制:+绘制Ctx.draw()2.保存与恢复:+保存Ctx.save()+恢复Ctx.restore()3.清除绘图:+清除Ctx.clearAction()
