网友真实露脸自拍10p,成人国产精品秘?久久久按摩,国产精品久久久久久无码不卡,成人免费区一区二区三区

小程序模板網(wǎng)

我要圣誕帽

發(fā)布時間:2018-05-17 08:42 所屬欄目:小程序開發(fā)教程
我要圣誕帽
采用微信小程序編寫 實現(xiàn)了為圖片帶帽子的功能
程序結(jié)構(gòu)如下
  • image (在此放置所有圣誕帽的素材)
  • pages (包含了index imageeditor combine文件夾,每個文件夾中都有四個文件,后綴名分別為 .js .json .wxss .wxml)
    • index (第一步:選擇底圖,程序設(shè)計三個底圖來源 即微信頭像、相機(jī)、相冊)
    • imageeditor(第二步:實現(xiàn)選擇圣誕帽 并通過移動和旋轉(zhuǎn)調(diào)整圣誕帽的大小和位置)
    • combine(第三步:將底圖和調(diào)整后的圣誕帽合成新的圖片 并保存至微信相冊)
  • app.js
  • app.json
  • app.wxss
  • project.config.json
核心算法介紹
  • 核心算法1:怎么實現(xiàn) 帽子的實時轉(zhuǎn)動
    • 當(dāng)touchstart時,保存此時的touch起始點(diǎn),并以此時的底圖和帽子位置作為旋轉(zhuǎn)角度和縮放比例值計算的參考點(diǎn)
    • 當(dāng)touchmove時,根據(jù)起始點(diǎn) 和 臨時的終止點(diǎn) 計算在x/y方向上的移動距離,計算參考點(diǎn)分別 加上這個距離,得到移動后的位置,通過移動前后的位置 計算移動前后位置的變動 計算旋轉(zhuǎn)角和縮放比例
    • 當(dāng)touchend時,重置底圖和帽子的位置及旋轉(zhuǎn)角和縮放比例
  • 核心算法2:怎么實現(xiàn) 合成圖片(利用canvas)
    • 首先繪制底圖(根據(jù)屏幕大小、圖片大小計算左上角和右下角坐標(biāo))
    • 繪制帽子(計算最終帽子的大小及中心位置 旋轉(zhuǎn)角度,移動畫布原點(diǎn)到帽子的中心位置,旋轉(zhuǎn)畫布 并繪制帽子)


易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開源 碼云倉庫:starfork
本文地址:http://www.xiuhaier.com/wxmini/doc/course/24444.html 復(fù)制鏈接 如需定制請聯(lián)系易優(yōu)客服咨詢:800182392 點(diǎn)擊咨詢
QQ在線咨詢
AI智能客服 ×