bindTakePhoto() {
const cameraContext = wx.createCameraContext();
const photoProp = {
quality: 'high'
};
cameraContext.takePhoto(photoProp)
.then((res) => {
this.drawPhoto(res.tempImagePath);
})
.catch((error) => {
logger.error(error)
})
},
async drawPhoto(filePath) {
const ctx = this.canvas.getContext('2d')
const dpr = app.globalData.screenHeight / app.globalData.rpxScreenHeight;
const canvasWidth = this.data.canvasWidth * dpr;
const canvasHeight = this.data.canvasHeight * dpr;
await new Promise((resolve) => {
const photoImage = this.canvas.createImage()
photoImage.onload = () => {
const photoWidth = canvasWidth;
const photoHeight = canvasHeight;
const x = 0;
const y = 0;
const direction = this.data.direction;
if (direction == 'left') {
ctx.translate(0, photoHeight);
ctx.rotate(-Math.PI / 2);
ctx.drawImage(photoImage, x, y, photoHeight, photoWidth);
ctx.rotate(Math.PI / 2);
ctx.translate(0, -photoHeight);
} else if (direction == 'right') {
ctx.translate(photoWidth, 0);
ctx.rotate(Math.PI / 2);
ctx.drawImage(photoImage, x, y, photoHeight, photoWidth);
ctx.rotate(-Math.PI / 2);
ctx.translate(-photoWidth, 0);
} else {
ctx.drawImage(photoImage, x, y, photoWidth, photoHeight);
}
resolve('已画照片')
}
photoImage.onerror = () => {
resolve();
}
photoImage.src = filePath;
})
if (this.data.liveWatermark && this.data.liveWatermarkValue && this.data.liveWatermarkValue != '') {
await new Promise((resolve) => {
const liveWatermarkImage = this.canvas.createImage()
liveWatermarkImage.onload = () => {
const liveWatermarkWidth = dpr * 360;
const liveWatermarkHeight = dpr * 90;
const x = canvasWidth / 2 - liveWatermarkWidth / 2;
const y = canvasHeight / 2 - liveWatermarkHeight / 2;
ctx.drawImage(liveWatermarkImage, x, y, liveWatermarkWidth, liveWatermarkHeight);
resolve('已画现场水印');
}
liveWatermarkImage.onerror = () => {
resolve();
}
liveWatermarkImage.src = this.data.liveWatermarkValue;
})
}
if (this.data.handWriting && this.data.handWriting != '') {
await new Promise((resolve) => {
const handWritingImage = this.canvas.createImage()
handWritingImage.onload = () => {
const handWritingWidth = dpr * 150;
const handWritingHeight = dpr * 150;
const x = canvasWidth - handWritingWidth - 10;
const y = canvasHeight - 10;
ctx.translate(x, y);
ctx.rotate(-Math.PI / 2);
ctx.drawImage(handWritingImage, 0, 0, handWritingWidth, handWritingHeight);
ctx.rotate(Math.PI / 2);
ctx.translate(-x, -y);
resolve('已画手写签名水印');
}
handWritingImage.onerror = () => {
resolve();
}
handWritingImage.src = this.data.handWriting;
})
}
if (this.data.logoEnable && this.data.logo && this.data.logo != '') {
await new Promise((resolve) => {
const logoImage = this.canvas.createImage()
logoImage.onload = () => {
const logoWidth = dpr * 150;
const logoHeight = dpr * 150;
const x = canvasWidth - logoWidth - 10;
const y = 10;
const alpha = 1 - app.globalData.logoTransparency * 5 / 100;
ctx.globalAlpha = alpha;
ctx.drawImage(logoImage, x, y, logoWidth, logoHeight);
ctx.globalAlpha = 1;
resolve('已画水印LOGO');
}
logoImage.onerror = () => {
resolve();
}
logoImage.src = this.data.logo;
})
}
ctx.font = '14px';
ctx.fillStyle = this.data.watermarkFontColor;
const watermarkX = 10;
const watermarkY = canvasHeight - 14;
const lineHeight = 18;
let i = 0;
const remarkArr = this.data.remarkArr;
if (remarkArr && remarkArr.length > 0) {
for (let index = remarkArr.length - 1; index >= 1; index--) {
const element = remarkArr[index];
ctx.fillText(element, watermarkX + 42, watermarkY - (i++) * lineHeight);
}
const firstRemark = remarkArr[0];
ctx.fillText('备注:' + firstRemark, watermarkX, watermarkY - (i++) * lineHeight);
}
if (this.data.weather && this.data.weatherValue) {
ctx.fillText('天气:' + this.data.weatherValue, watermarkX, watermarkY - (i++) * lineHeight);
}
if (this.data.altitude && this.data.altitudeValue) {
ctx.fillText('海拔:' + this.data.altitudeValue, watermarkX, watermarkY - (i++) * lineHeight);
}
if (this.data.currentTime) {
ctx.fillText('时间:' + this.data.currentTime, watermarkX, watermarkY - (i++) * lineHeight);
}
if (this.data.address && this.data.addressValue) {
ctx.fillText('地址:' + this.data.addressValue, watermarkX, watermarkY - (i++) * lineHeight);
}
if (this.data.lonLat && this.data.latitudeValue && this.data.longitudeValue) {
ctx.fillText('纬度:' + this.data.latitudeValue, watermarkX, watermarkY - (i++) * lineHeight);
ctx.fillText('经度:' + this.data.longitudeValue, watermarkX, watermarkY - (i++) * lineHeight);
}
this.savaToTempFile();
},
savaToTempFile() {
let that = this
wx.canvasToTempFilePath({
canvas: this.canvas,
fileType: 'jpg'
}).then(res => {
const filePath = res.tempFilePath
this.setData({
tempImagePath: res.tempFilePath
})
wx.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: function () {
},
})
wx.compressImage({
src: filePath,
quality: 60,
success: image => {
this.setLastPageFlag(true);
this.wmCamera.goFormPage(image.tempFilePath)
},
fail: (err) => {
this.setLastPageFlag(true);
this.wmCamera.goFormPage(image.tempFilePath)
}
})
}).catch(error => {
logger.error(error)
})
},
是不是图片还没加载完成
黑屏是没有授权权限,或者没有更新用户隐私协议吧