微信小程序开发

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.begi nPath()+路径(填充)Ctx.fill()+路径(描边)Ctx.stroke()+路径(移点)Ctx.moveTo(x,y)+路径(连线)Ctx.li neTo(x,y)+路径(关闭)Ctx.closePath()3. 圆弧:+

2、画弧Ctx.arc(x,y,r,startA ngle,e ndAn gle)4. 文字：+写字Ctx.fillText( text ,x,y)5. 图片：+图片Ctx.drawImage(img,x,y)第2节:绘图设置：1. 渐变：+渐变(线型)Ctx.createLi nearGradie nt(x1,y1,x2,y3)+渐变仲心)Ctx.createCircularGradie nt(x,y,r)+渐变(实例)Var ctx=wx.createCanvasContext( myCanvaS”;Var grd=ctx.createLi nearGradie nt(O,O,1OO,O);G

3、rd.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)3. 线+线样式(粗细)Ctx.setLi neWidth(width)+线样式(端点)Ctx.setLineCap( bund

4、”)+线样式佼接)Ctx.setLineJoin( found ”)+线样式(斜度)Ctx.setMiteLimit(degree)4. 文本：+文本(字号)Ctx.setFo ntSize(size)+文本(对齐)Ctx.setTextAlign( “enter ”)5. 全局：+透明度(全局)Ctx.setGlobalAlpha(value)第3节：绘图变形：1. 缩放:+缩放Ctx.scale(w,h)2. 旋转：+旋转Ctx.rotate(x,y)3. 位移：+位移Ctx.ta nslate(x,y)第4节:小程序级：1. 创建画布+创建画布(常规)wx.createCa nvasC onten tText(ca nvas-id)+创建画布(舍弃)wx.createC onten tText(ca nvas-id)2. 输出图片+输出图片wx.ca nasToTempFilePath(path)第5节：画布级：1.绘制：+绘制Ctx.dr