微信小程序Canvas绘制图片及竖排文字教程详细解析？

本文共计1768个文字，预计阅读时间需要8分钟。

前言：闲时段抽空设计了一个三国杀手账小程序，需求设计包括：

1.组成武将皮肤图、排序的武将姓名以及小程序代码。

2.提供保存图片到相册的功能，方便用户分享给朋友。

前言

闲暇时间抽个空写了个三国杀武将手册的小程序，中间有个需求设计的是合成武将皮肤图、竖排的武将姓名、以及小程序码，然后提供保存图片到相册，最终让用户可以分享到朋友圈或其他平台。合成图片应该按照 Canvas 的文档来做都没什么问题，主要是有个竖排文字的需求，这里和大家分享一下。

正文

首先放一张最终保存到相册的图片吧~

自我感觉良好，至少达到了我自己的预期吧~~~

下面让我们一步一步来看看如何实现的吧。

整个图片分为三个部分：

• 武将图片
• 小程序码
• 武将文字信息

先来看一下 wxml 里面的代码，主要是放了一个 canvas 标签，控制了一下高度和宽度属性。