国庆到了，写一个国庆头像生成小程序

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 415 天前的主题，其中的信息可能已经有所发展或是发生改变。

截图

上手指南

该小程序使用了微信的 Skyline 渲染引擎，效率更高体验更好，可以实现类似于 flutter Hero 动画（见上图效果）。头像生成使用的是 Snapshot 进行合成，这个东西很方便，不用使用 canvas 进行繁琐的绘制处理，只要把布局写好就行，类似 html2canvas 。

官方onChooseAvatar接口获取头像的接口实在太模糊没法使用，因此换成了wx.chooseMedia

注意：由于使用了一些新特效所以项目无法在 WebView 下运行，需使用 Skyline 引擎，如果考虑到用户兼容性的慎用。

开发前的配置要求

微信版本库 3.0.0

安装步骤

克隆或下载本项目到目录中使用微信开发者工具导入即可

git clone https://github.com/QQOQ/mp-avatar.git

修改根目录下的env.config.js文件，里面配置你的接口地址
在app.js处有一个请求素材的接口，可以修改此处为你的接口，返回格式如下：

{
    "default_template": "https://51porn.oss-cn-hangzhou.aliyuncs.com/hat5.png",
    "default_avatar": "https://51porn.oss-cn-hangzhou.aliyuncs.com/demo.jpg",
    "template_list": [
        "https://51porn.oss-cn-hangzhou.aliyuncs.com/hat0.png",
        "https://51porn.oss-cn-hangzhou.aliyuncs.com/hat1.png"
    ]
}

default_template: 默认模板
default_avatar: 默认头像
template_list: 模板列表

特别说明

该项目素材均来自于互联网，如有侵权请联系本人删除。

头像

接口

skyline

使用

6 条回复 • 2023-09-27 15:02:41 +08:00

wonderfulcxm

2023-09-26 20:18:28 +08:00 via iPhone

可以加个小熊的模板，估计很受欢迎

wewewe

2023-09-27 00:09:31 +08:00

@wonderfulcxm 什么小熊

mianlaodie

2023-09-27 08:19:54 +08:00 via Android

@wewewe 黄色小熊

Mogugugugu

2023-09-27 08:58:54 +08:00

好家伙、你们是想让开发者进去过中秋啊、

wewewe

2023-09-27 10:03:15 +08:00

@Mogugugugu 👻啥意思这么吓人吗

XueXianqi

2023-09-27 15:02:41 +08:00

这个 endpoint ，51porn ，666