applet WeChat
Pembangunan program mini
Bawa anda membangunkan program kecil untuk menjana avatar untuk Tahun Harimau dan Festival Musim Bunga
Bawa anda membangunkan program kecil untuk menjana avatar untuk Tahun Harimau dan Festival Musim Bunga
Jan 28, 2022 am 10:16 AM
Artikel ini akan membawa anda mengikuti arah aliran dan membuat program kecil untuk membuat avatar untuk Tahun Festival Musim Bunga Harimau Dapatkan avatar WeChat dan pilih bingkai avatar untuk mensintesis avatar Tahun Musim Bunga Harimau I harap ia akan membantu semua orang!
Festival Musim Bunga akan datang Hari ini saya melihat seorang netizen berkongsi alat penciptaan avatar Tahun Harimau. Rasanya sangat bagus buat program kecil untuk berlatih, kemudian cuba dengan yang ini.
Mula-mula rendering terakhir:
Mari kita bincangkan proses pelaksanaan
Langkah pertama: dapatkannya pertama Kod utama untuk gambar avatar WeChat semasa adalah seperti berikut Ambil perhatian bahawa gambar avatar yang diperoleh secara lalai bukan definisi tinggi dan perlu ditukar kepada gambar definisi tinggi terlebih dahulu untuk mengelakkan kabur selepas generasi.
getUserProfile(e) {
console.log(e)
let that = this;
wx.getUserProfile({
desc: '僅用于生成頭像使用',
success: (res) => {
var url = res.userInfo.avatarUrl;
while (!isNaN(parseInt(url.substring(url.length - 1, url.length)))) {
url = url.substring(0, url.length - 1)
}
url = url.substring(0, url.length - 1) + "/0";
res.userInfo.avatarUrl = url;
console.log(JSON.stringify(res.userInfo));
that.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
that.drawImg();
}
});
},Langkah 2: Mensintesis avatar Dapatkan fail setempat daripada gambar bahan dan gambar avatar yang diperoleh pada langkah pertama, dan kemudian gunakan komponen cavas program mini untuk mensintesisnya.
drawImg() {
let that = this;
wx.showLoading({
title: '生成頭像中...',
})
let promise1 = new Promise(function (resolve, reject) {
wx.getImageInfo({
src: that.data.userInfo.avatarUrl,
success: function (res) {
resolve(res);
}
})
});
var mask_id = that.data.now_mask;
let promise2 = new Promise(function (resolve, reject) {
wx.getImageInfo({
src: `../../assets/img/mask0${mask_id}.png`,
success: function (res) {
console.log(res)
resolve(res);
}
})
});
Promise.all([
promise1, promise2
]).then(res => {
console.log(res)
var windowWidth = wx.getSystemInfoSync().windowWidth
var context = wx.createCanvasContext('myAvatar');
var size = windowWidth /750 * 500
// var size = 500
context.drawImage(res[0].path, 0, 0, size, size);
context.draw(true)
context.save();
context.drawImage('../../'+res[1].path, 0, 0, size, size);
context.draw(true)
context.save();
})
wx.hideLoading()
},Langkah 3: Muat turun gambar yang disintesis ke album tempatan.
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.canvasToTempFilePath({
x: 0,
y: 0,
height: size,
width: size,
canvasId: 'myAvatar',
success: (res) => {
wx.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: result => {
wx.hideLoading();
wx.showModal({
content: '圖片已保存到相冊,請前往微信去設(shè)置喲!',
showCancel: false,
success: function(res) {
if (res.confirm) {
console.log('用戶點擊確定');
}
}
})
}, fail(e) {
wx.hideLoading();
console.log("err:" + e);
}
})
}
});
},Dengan cara ini, fungsi utama tercapai.
Akhir sekali, letakkan kod program mini, semua orang dialu-alukan untuk mengimbas kod dan mengalaminya:
Akhir sekali, projek semasa telah sumber terbuka: https://github.com/hackun666/new-year-face
Saya ucapkan selamat menyambut Pesta Musim Bunga dan semoga berjaya dalam Tahun Harimau!
Alamat asal: https://juejin.cn/post/7057807283463389191
Pengarang: hackun
[Cadangan pembelajaran berkaitan: 】
Atas ialah kandungan terperinci Bawa anda membangunkan program kecil untuk menjana avatar untuk Tahun Harimau dan Festival Musim Bunga. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Alat AI Hot
Undress AI Tool
Gambar buka pakaian secara percuma
Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik
AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.
Clothoff.io
Penyingkiran pakaian AI
Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!
Artikel Panas
Alat panas
Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma
SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan
Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa
Dreamweaver CS6
Alat pembangunan web visual
SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)
Bangunkan applet WeChat menggunakan Python
Jun 17, 2023 pm 06:34 PM
Dengan populariti teknologi Internet mudah alih dan telefon pintar, WeChat telah menjadi aplikasi yang sangat diperlukan dalam kehidupan orang ramai. Program mini WeChat membenarkan orang ramai menggunakan program mini secara langsung untuk menyelesaikan beberapa keperluan mudah tanpa memuat turun dan memasang aplikasi. Artikel ini akan memperkenalkan cara menggunakan Python untuk membangunkan applet WeChat. 1. Persediaan Sebelum menggunakan Python untuk membangunkan applet WeChat, anda perlu memasang perpustakaan Python yang berkaitan. Adalah disyorkan untuk menggunakan dua perpustakaan wxpy dan itchat di sini. wxpy ialah mesin WeChat
Laksanakan kesan flip kad dalam program mini WeChat
Nov 21, 2023 am 10:55 AM
Melaksanakan kesan flipping kad dalam program mini WeChat Dalam program mini WeChat, melaksanakan kesan flipping kad ialah kesan animasi biasa yang boleh meningkatkan pengalaman pengguna dan daya tarikan interaksi antara muka. Yang berikut akan memperkenalkan secara terperinci cara melaksanakan kesan khas flipping kad dalam applet WeChat dan memberikan contoh kod yang berkaitan. Pertama, anda perlu menentukan dua elemen kad dalam fail susun atur halaman program mini, satu untuk memaparkan kandungan hadapan dan satu untuk memaparkan kandungan belakang Kod sampel khusus adalah seperti berikut: <!--index.wxml-. ->&l
Alipay melancarkan program mini 'Chinese Character Picking-Rare Characters' untuk mengumpul dan menambah pustaka aksara yang jarang ditemui
Oct 31, 2023 pm 09:25 PM
Menurut berita dari laman web ini pada 31 Oktober, pada 27 Mei tahun ini, Ant Group mengumumkan pelancaran "Projek Pemilihan Watak Cina", dan baru-baru ini membawa kemajuan baharu: Alipay melancarkan program mini "Pemilihan Watak Cina-Watak Biasa" untuk mengumpul koleksi daripada masyarakat Watak nadir menambah pustaka aksara jarang dan memberikan pengalaman input yang berbeza untuk aksara jarang untuk membantu memperbaik kaedah input aksara jarang dalam Alipay. Pada masa ini, pengguna boleh memasukkan applet "Watak Tidak Biasa" dengan mencari kata kunci seperti "Pengambilan aksara Cina" dan "aksara jarang". Dalam program mini, pengguna boleh menghantar gambar aksara jarang yang belum dikenali dan dimasukkan oleh sistem Selepas pengesahan, jurutera Alipay akan membuat entri tambahan ke dalam perpustakaan fon. Laman web ini mendapati bahawa pengguna juga boleh mengalami kaedah input pemisahan perkataan terkini dalam program mini Kaedah input ini direka untuk perkataan yang jarang dengan sebutan yang tidak jelas. Pembongkaran pengguna
Bolehkah program kecil menggunakan tindak balas?
Dec 29, 2022 am 11:06 AM
Program mini boleh menggunakan react. Cara menggunakannya: 1. Laksanakan pemapar berdasarkan "react-reconciler" dan jana DSL 2. Buat komponen program mini untuk menghuraikan dan membuat DSL 3. Pasang npm dan laksanakan Build; npm dalam alat; 4. Perkenalkan pakej ke halaman anda sendiri, dan kemudian gunakan API untuk menyelesaikan pembangunan.
Cara uniapp mencapai penukaran pantas antara program mini dan H5
Oct 20, 2023 pm 02:12 PM
Bagaimana uniapp boleh mencapai penukaran pantas antara program mini dan H5 memerlukan contoh kod khusus Dalam beberapa tahun kebelakangan ini, dengan perkembangan Internet mudah alih dan populariti telefon pintar, program mini dan H5 telah menjadi bentuk aplikasi yang sangat diperlukan. Sebagai rangka kerja pembangunan merentas platform, uniapp boleh dengan cepat merealisasikan penukaran antara program kecil dan H5 berdasarkan set kod, meningkatkan kecekapan pembangunan. Artikel ini akan memperkenalkan cara uniapp boleh mencapai penukaran pantas antara program mini dan H5, dan memberikan contoh kod khusus. 1. Pengenalan kepada uniapp unia
Ajar anda cara menggunakan mesej templat akaun awam dalam program mini (dengan idea terperinci)
Nov 04, 2022 pm 04:53 PM
Artikel ini membawakan kepada anda beberapa isu berkaitan tentang program mini WeChat terutamanya cara menggunakan mesej templat akaun dalam program mini. Saya harap ia dapat membantu semua orang.
Tutorial menulis program sembang mudah dalam Python
May 08, 2023 pm 06:37 PM
Idea pelaksanaan x01 Penubuhan pelayan Pertama, pada bahagian pelayan, soket digunakan untuk menerima mesej Setiap kali permintaan soket diterima, utas baharu dibuka untuk menguruskan pengedaran dan penerimaan mesej Pada masa yang sama, terdapat pengendali untuk menguruskan semua Thread, dengan itu merealisasikan pemprosesan pelbagai fungsi ruang sembang Penubuhan pelanggan x02 adalah lebih mudah daripada pelayan Fungsi pelanggan hanya untuk menghantar dan menerima mesej, dan untuk memasukkan aksara tertentu mengikut peraturan tertentu. Ini membolehkan penggunaan fungsi yang berbeza, di sisi pelanggan, anda hanya perlu menggunakan dua utas, satu didedikasikan untuk menerima mesej, dan yang lain didedikasikan untuk menghantar mesej adalah kerana, hanya
Kedudukan geografi dan paparan peta menggunakan PHP dan program mini
Jul 04, 2023 pm 04:01 PM
Kedudukan geolokasi dan paparan peta PHP dan program mini Kedudukan geolokasi dan paparan peta telah menjadi salah satu fungsi yang diperlukan dalam teknologi moden. Dengan populariti peranti mudah alih, permintaan orang ramai untuk kedudukan dan paparan peta juga meningkat. Semasa proses pembangunan, PHP dan applet adalah dua pilihan teknologi biasa. Artikel ini akan memperkenalkan anda kepada kaedah pelaksanaan kedudukan lokasi geografi dan paparan peta dalam program PHP dan mini, serta melampirkan contoh kod yang sepadan. 1. Geolokasi dalam PHP Dalam PHP, kita boleh menggunakan geolokasi pihak ketiga
