LemonYan

TypeScript 是 JavaScript 的一个超集，主要提供了类型系统和对 ES6 的支持，由 Microsoft 开发，可以编译成纯 JavaScript。 JavaScript的类型分为两种：原始数据类型和对象类型。 原始数据类型包括：boolean、number、…

小程序官方文档并没有提供相关文档，只是在开发工具模块提了一下，网上这方面的资料也比较少。 打开微信开发者工具，新建项目，语言选择TypeScript。 会发现创建的TS项目模板和JS创建的项目模板不同。 查看项目文件，每个JS文件对应一个TS文件，项目开发中，只需要关注TS文件…

columns：集成column-width和column-count两个属性，用于实现元素多列布局效果。 columns是一个复合属性，列宽和列数，可以同时定义多列的列数和每列的列宽。 多列布局列宽column-width属性类似于给列定义一个最小宽度。 auto：默认值，如…

在CSS3中，把@keyframes称为关键帧。 由@keyframes开头，后面紧跟着“动画名称”加上一对花括号“{...}”，括号中是不同时间段样式规则。 一个@keyframes中的样式规则是由多个百分比构成的，如0%~100%。可以使用“from”、“to”代表一个动画…

CSS3变形是一些效果的集合，比如平移、旋转、缩放和倾斜效果，每个效果都称为变形函数（Transform Function）。 CSS变形允许动态的控制元素，可以在屏幕周围移动，缩小，旋转，或结合所有这些产生复杂的动画效果。 transform属性让元素在一个坐标系统中变形，包…

缩写语法：border:border-width border-style border-color缩写后的每个属性值之间使用空格隔开，且不分先后顺序。 box-shadow用来定义元素的盒子阴影。 box-shadow属性可以使用一个或多个投影，如果使用多个投影必须使用逗号隔…

图形的基本元素是路径。路径是通过不同颜色和宽度的线段或曲线相连形成的不同形状的点的集合。一个路径，甚至一个子路径，都是闭合的。使用路径绘制图形需要一些额外的步骤： 绘制圆弧或者圆，使用arc()方法。

在了解变形之前，先介绍两个在绘制复杂图形时必不可少的方法。 用这个连续矩形的例子来描述 canvas 的状态栈是如何工作的。 translate 方法用来移动 canvas 和它的原点到一个不同的位置。 rotate 方法用于以原点为中心旋转 canvas。 缩放用来增减图形在…

渐变Gradients以下有两种不同的方式来设置Canvas渐变：上色：示例：线性渐变示例：径向渐变参考：路径-CanvasAPI|MDN