小程序畫(huà)布繪制圖像到畫(huà)布CanvasContext.drawImage
CanvasContext.drawImage(string imageResource, number sx, number sy, number sWidth, number sHeight, number dx, number dy, number dWidth, number dHeight)
繪制圖像到畫(huà)布
小程序插件:支持
參數(shù)
string imageResource
所要繪制的圖片資源(網(wǎng)絡(luò)圖片要通過(guò) getImageInfo / downloadFile 先下載)
number sx
需要繪制到畫(huà)布中的,imageResource的矩形(裁剪)選擇框的左上角 x 坐標(biāo)
>number sy
需要繪制到畫(huà)布中的,imageResource的矩形(裁剪)選擇框的左上角 y 坐標(biāo)
number sWidth
需要繪制到畫(huà)布中的,imageResource的矩形(裁剪)選擇框的寬度
number sHeight
需要繪制到畫(huà)布中的,imageResource的矩形(裁剪)選擇框的高度
number dx
imageResource的左上角在目標(biāo) canvas 上 x 軸的位置
number dy
imageResource的左上角在目標(biāo) canvas 上 y 軸的位置
number dWidth
在目標(biāo)畫(huà)布上繪制imageResource的寬度,允許對(duì)繪制的imageResource進(jìn)行縮放
number dHeight
在目標(biāo)畫(huà)布上繪制imageResource的高度,允許對(duì)繪制的imageResource進(jìn)行縮放
示例代碼
有三個(gè)版本的寫(xiě)法:
drawImage(imageResource, dx, dy)
drawImage(imageResource, dx, dy, dWidth, dHeight)
drawImage(imageResource, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight) 從 1.9.0 起支持
const ctx = wx.createCanvasContext('myCanvas')
wx.chooseImage({
success: function(res){
ctx.drawImage(res.tempFilePaths[0], 0, 0, 150, 100)
ctx.draw()
}
})
作者:大學(xué)生新聞網(wǎng) 來(lái)源:大學(xué)生新聞網(wǎng)
發(fā)布時(shí)間:2025-04-15 閱讀:
- 小程序畫(huà)布繪制文本描邊
- CanvasContext.strokeText(string text, number x, number y, number maxWidth)
- 04-15 關(guān)注:0