我们来开发一个生成虎年过年头像的小程序（如何创建新年头像）

在这篇文章中，我们将顺应潮流，制作一个小程序，为虎年春节制作头像。 获取微信头像，选择头像框，组成不同的虎年新年头像。 希望我能帮到你！

农历新年快到了。 今天看到有网友分享网页版虎年头像制作工具。 我认为这非常好。 我打算创建一个小程序来练习，没有主题。 ，然后尝试这个。

首先最终渲染：

先说一下实现过程

第一步：首先渲染当前的微信头像图片来获取其主要代码为： 请注意，默认获取的头像图片不是高分辨率的，因此必须先将其转换为高分辨率图像，以避免生成后模糊。

getUserProfile(e) { console.log(e) let that = wx.getUserProfile({ desc: '仅用于头像生成', success: (res) => { var url = res.userInfo . avatarUrl; while (!isNaN(parseInt(url.substring(url.length - 1) , url.length)))) { url.substring(0, url.length - 1) } url = url.substring(0, url.length - 1) + "/0"; console.log(JSON.stringify(res.userInfo)); ; that.setData({ userInfo: res.userInfo, hasUserInfo: tru)呃。 进行合成。

drawImg() { 它 = 这个; wx.showLoading({ title: '生成头像...', }) let Promise1 = new Promise(function (resolve,reject) { wx.getImageInfo({ src: that.data.userInfo.avatarUrl, success: function (res ) ) { 解析 (res) } }) }); Promise(function (resolve,reject) { wx.getImageInfo({ src: `../../assets/img/mask0${mask_id}.png`, success: function (res) { console.log (res) resolve (res); }) }); omise2 ]).then(res => { console.log(res) var windowWidth = wx.getSystemInfoSync().windowWidth var context = wx.createCanvasContext('myAvatar'); var size = windowW idth /750 * 500 // var size = 500 context.drawImage(res[0].path, 0, 0, size, size ); 上下文.draw(true) 上下文.save(); context.drawImage('../../'+res[1].path, 0, 0, size, size); context.draw(true) context.save(); }) wx.hideLoading() },

第三步：将合成图片下载到本地相册。

canvasToTempFile(){ if(!this.data.userInfo){ wx.showModal({ title: '温馨提醒', content: '点击上方获取微信头像', showCancel: false, }) return } var windowWidth = wx.getSystemInfoSync().windowWidth var size = 500 // var dpr = 750 / windowWidth wx.canvasToTemp FilePath({ x: 0, y: 0, 高度: 大小, 宽度: 大小, CanvasId: 'myAvatar',success: (res) => { wx.saveImageToPhotosAlbum({ filePath: res.tempFilePath, success: result => { wx.h ideLoading(); wx.showModal({ content: '照片已保存到相册，请访问微信进行配置！', showCancel: false, success: function(res) { }, Fil (e) {wx.hideloading(); console.log("err:" + e);

最后是一个小程序。 输入代码，任何人都可以扫码试用：

最后，当前项目现已开源：https://github/hackun666/new-year。 -face

祝大家春节虎年万事如意。

【相关学习推荐：小程序开发教程】

PHP快速学习视频免费教程（从初学者到大师）

如何开始学习PHP？ 这里有简单的 PHP 学习教程（从初学者到专家）。 您可以保存并下载您想学习的朋友。

下载

这几篇文章你可能也喜欢：

• 微信公众平台和小程序有什么区别（微信公众号和小程序的区别）
• 介绍如何在小程序中实现截断瀑布流组件（小程序瀑布流布局）。
• 小程序全局配置详解（详细解析小程序全局配置是什么）
• 我们将集体分享小程序开发的实用知识（小程序开发示例）
• 共享小程序滑动器轮播高度问题的解决方案摘要。

本文由主机参考刊发，转载请注明：我们来开发一个生成虎年过年头像的小程序（如何创建新年头像） https://zhujicankao.com/141751.html