wewewe
V2EX  ›  编程

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

  •  
  •   wewewe · Sep 26, 2023 · 1856 views
    This topic created in 986 days ago, the information mentioned may be changed or developed.

    截图

    Logo

    上手指南

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

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

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

    开发前的配置要求
    1. 微信版本库 3.0.0
    安装步骤
    1. 克隆或下载本项目到目录中使用微信开发者工具导入即可
    git clone https://github.com/QQOQ/mp-avatar.git
    
    1. 修改根目录下的env.config.js文件,里面配置你的接口地址

    2. 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: 模板列表
    

    特别说明

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

    6 replies    2023-09-27 15:02:41 +08:00
    wonderfulcxm
        1
    wonderfulcxm  
       Sep 26, 2023 via iPhone
    可以加个小熊的模板,估计很受欢迎
    wewewe
        2
    wewewe  
    OP
       Sep 27, 2023
    @wonderfulcxm 什么小熊
    mianlaodie
        3
    mianlaodie  
       Sep 27, 2023 via Android
    @wewewe 黄色小熊
    Mogugugugu
        4
    Mogugugugu  
       Sep 27, 2023
    好家伙、你们是想让开发者进去过中秋啊、
    wewewe
        5
    wewewe  
    OP
       Sep 27, 2023
    @Mogugugugu 👻啥意思这么吓人吗
    XueXianqi
        6
    XueXianqi  
       Sep 27, 2023
    这个 endpoint ,51porn ,666
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   5891 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 57ms · UTC 02:15 · PVG 10:15 · LAX 19:15 · JFK 22:15
    ♥ Do have faith in what you're doing.