...
|
...
|
@@ -2,7 +2,8 @@ let app = getApp(); |
|
|
const windowWidth = app.globalData.systemInfo.windowWidth;
|
|
|
const windowHeight = app.globalData.systemInfo.windowHeight;
|
|
|
const screenHeight = app.globalData.systemInfo.screenHeight;
|
|
|
const scale = windowWidth / 375;
|
|
|
// const scale = windowWidth / 375;
|
|
|
const scale = 0.7
|
|
|
|
|
|
var Point = function(x, y) {
|
|
|
return {
|
...
|
...
|
@@ -20,10 +21,28 @@ Page({ |
|
|
windowWidth,
|
|
|
windowHeight,
|
|
|
scale,
|
|
|
product_name: '',
|
|
|
default_image: '',
|
|
|
product_qrCode: ''
|
|
|
},
|
|
|
|
|
|
onLoad(options) {
|
|
|
|
|
|
let product_name = decodeURIComponent(options.product_name ? options.product_name : '');
|
|
|
let default_image = decodeURIComponent(options.default_image ? options.default_image : '');
|
|
|
let product_qrCode = decodeURIComponent(options.product_qrCode ? options.product_qrCode : '');
|
|
|
|
|
|
this.setData({
|
|
|
product_name,
|
|
|
default_image,
|
|
|
product_qrCode
|
|
|
});
|
|
|
|
|
|
this.creatSnapshoot();
|
|
|
},
|
|
|
|
|
|
creatSnapshoot() {
|
|
|
this.creatProductDetailSnapShoot();
|
|
|
},
|
|
|
|
|
|
saveToAlbum() {
|
...
|
...
|
@@ -109,17 +128,9 @@ Page({ |
|
|
|
|
|
creatProductDetailSnapShoot() {
|
|
|
let that = this;
|
|
|
let product = that.properties.shareData;
|
|
|
let pCtx = wx.createCanvasContext('productDetailCanvas', this);
|
|
|
|
|
|
pCtx.setFillStyle('white');
|
|
|
pCtx.fillRect(0, 0, windowWidth, screenHeight);
|
|
|
pCtx.drawImage('./images/snapshoot_share_bg@2x.png', 0, 0, windowWidth, 186 * scale);
|
|
|
pCtx.setFillStyle('white');
|
|
|
pCtx.setShadow(-5, -2, 40, 'darkgray');
|
|
|
pCtx.fillRect(27 * scale, 60 * scale, 320 * scale, 430 * scale);
|
|
|
|
|
|
let defaultImage = product.default_image;
|
|
|
let defaultImage = this.data.default_image;
|
|
|
|
|
|
if (defaultImage && defaultImage.indexOf('https://') === -1) {
|
|
|
defaultImage = defaultImage.replace('http://', 'https://');
|
...
|
...
|
@@ -129,22 +140,16 @@ Page({ |
|
|
src: defaultImage,
|
|
|
success: function(res) {
|
|
|
pCtx.drawImage(res.path, 27 * scale, 60 * scale, 320 * scale, 430 * scale);
|
|
|
pCtx.setFillStyle('rgba(0,0,0,0.8)');
|
|
|
pCtx.fillRect(27 * scale, 370 * scale, 320 * scale, 120 * scale);
|
|
|
pCtx.setFillStyle('white');
|
|
|
that.drawLongText(product.product_name, pCtx, 187.5 * scale, 402 * scale, 'white', 14, 20);
|
|
|
pCtx.setFillStyle('black');
|
|
|
that.drawLongText(that.data.product_name, pCtx, 187.5 * scale, 402 * scale, 'white', 14, 20);
|
|
|
pCtx.setTextAlign('center');
|
|
|
pCtx.setFontSize(18 * scale);
|
|
|
pCtx.fillText(product.product_price, 187.5 * scale, 458.5 * scale);
|
|
|
pCtx.draw(true);
|
|
|
}
|
|
|
});
|
|
|
|
|
|
pCtx.setShadow(0, 0, 0, 'white');
|
|
|
pCtx.drawImage('./images/share-logo@2x.png', 132 * scale, 505 * scale, 111 * scale, 20 * scale);
|
|
|
|
|
|
wx.getImageInfo({
|
|
|
src: product.product_qrCode,
|
|
|
src: this.data.product_qrCode,
|
|
|
success: function(res) {
|
|
|
pCtx.drawImage(res.path, 148.5 * scale, 539.5 * scale, 78 * scale, 78 * scale);
|
|
|
pCtx.draw(true);
|
...
|
...
|
@@ -158,7 +163,7 @@ Page({ |
|
|
pCtx.drawImage('./images/snapshoot_tip_ic@2x.png', 127 * scale, 645.5 * scale, 9 * scale, 9 * scale);
|
|
|
pCtx.setFillStyle('#b0b0b0');
|
|
|
pCtx.setFontSize(9);
|
|
|
pCtx.fillText('实际价格以页面展示为准', 187.5 * scale, 652.5 * scale);
|
|
|
pCtx.fillText('或者在各大应用市场搜索 Yoho!Buy有货 下载App', 187.5 * scale, 652.5 * scale);
|
|
|
pCtx.draw();
|
|
|
},
|
|
|
|
...
|
...
|
|