由于像素只能是整數,所以這樣繪制出來的圖片可能底部會有1px的空白,所以在設置高度的時候可以再減掉 1px,這不會影響視覺效果。
繪制背景圖
如果是網絡圖片,繪制背景圖之前一定要先下載該圖片,可通過 wx.getImageInfo
或 wx. downloadFile
下載圖片,下載成功后將其塞進臨時地址,然后使用 wx canvas 的 drawImage
繪制。注意圖片的格式不能是 gif。
繪制二維碼
繪制二維碼換了好幾個庫,每個在安卓下面生成的二維碼都會頻現失敗。查了好些資料,說是安卓繪制的時候要設置個 setTimeout,于是最終選擇了weapp-qrcode,修改了其繪制的函數,增加了setTimeout(還真別說,加上二維碼繪制就成功了)。
ctx.draw(false, function (e) { setTimeout(() => { // 修改增加的 options.callback && options.callback(e) }, 20); })
另:目前這些繪制小程序二維碼的庫都是在一個單獨的新 canvas 中完成的,只要對源碼稍作修改,就可以提供另一個接口,直接在一個現有的 canvas (表示 canvas 中一開始繪制了其他內容) 中繪制。
如果二維碼掃不出來,則表示二維碼繪制出了問題。但安卓微信 6.7.2 版本本身有個 bug,二維碼本身是沒有問題,它卻不能識別。不過升級下微信版本就好了。
保存圖片
saveImageToPhotosAlbum
接口保存圖片 saveImageToPhotosAlbum
接口保存圖片性能注意
經實踐測試整個繪制過程其實還是很快的,但是如果有保存臨時文件操作( wx.canvasToTempFilePath
),那么這個操作一般得占一半時間左右。除此之外,有個 measureText api,用來測量文字的長度,這個在實現自動換行的時候用得到,但是比較耗性能。
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com