开发 小程序做动画效果难？送你一个框架10 分钟就能搞定

　　在小程序中使用 canvas 绘制图案、动画的难度有目共睹。除了本身写法繁琐，小程序的技术特性，也使得小程序无法使用普通 HTML 5 的 canvas 框架，进行图案、动画绘制。

　　而今天，知晓程序就来为你推荐一款框架。这款框架专为小程序设计，它可以让你在小程序里，更轻松地完成图案绘制，还能使用事件响应。

　　但是它过于底层，且 API 粗糙，导致开发者很难使用它来做较为复杂的图形。而且它的即时绘制无记忆特性，使得它内部的图形并不支持动画更不支持一切交互事件。

　　而且，由于小程序由 JS core 支持，并没有window对象，并且 canvas 的 API 与标准的 canvas 的 API 有所出入，所以市面上绝大部分 canvas 库，都与小程序无缘。

　　而 wxDraw 也就应运而生，专门用于处理小程序上 canvas 图形创建、图形动画，以及相关交互问题。

　　缓动动画支持 wxDraw 支持链式调用动画(就像 jQuery 的 animate 一样)，并且支持几乎所有的缓动函数。绘制图形目前，wxDraw 框架支持rect、circle、polygon、ellipse、line等图形，如果想要自己创建自定义图形，还可以使用cshape图形，或是使用text做出文字形状的图形。

　　let circle = new Shape(circle, { x: 100, y: 100, r: 40, sA: Math.PI/4, fillStyle: #C0D860, strokeStyle: #CC333F, rotate: 20, lineWidth: 0, needGra: line, gra: [[0, #00A0B0], [0.2, #6A4A3C], [0.4, #CC333F], [0.6, #EB6841], [1, #EDC951]]}, fill, true)