小程序七十二变之 canvas 绘制国旗头像

昨天朋友圈被「请给我一面国旗@微信官方」刷屏，虽然知道是假的，但是从另一个角度来看，弄清楚如何实现更有趣。

1

canvas

这就不得不提到小程序中的 APIcanvas，H5 中也是有 canvas 的，不过之前也一直没有机会用，这次正好乘机试试水。

晚上回家看了下官方文档，网上搜了一些类似的功能实现，最后写好了一个 demo，基本上是能初步绘制国旗头像了。

当然以后如果想要绘制其他带挂件的头像，只需要更改挂件素材即可，提前预约帮你们定做今年的圣诞帽。

2

代码来了

实现过程主要分为以下几个步骤：

1、新建 canvas 画板

2、绘制头像当做背景（demo 目前是自行上传头像制作）

3、绘制国旗边框

4、保存到手机相册（需授权）

废话不多说，直接上代码：

3

最后

demo 写完了，以小程序的尿性，怎么会没有坑呢？发现真相的我眼泪差点掉下来，而且这个坑不是一般的坑，弄了老半天都没解决，先睡觉，明天还得上班。

具体是啥坑留言区揭晓，感兴趣的欢迎来留言讨论如何解决，到发文为止依旧是个巨坑。