From 733ff9d21378356e474c50dde6b3a8adcbc74ba8 Mon Sep 17 00:00:00 2001 From: feipeng Date: Wed, 17 Jul 2019 17:40:47 +0800 Subject: [PATCH 1/2] =?UTF-8?q?image=20=E7=9A=84=20width=20=E5=92=8C=20hei?= =?UTF-8?q?ght=20=E6=94=AF=E6=8C=81=20auto?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- lib/pen.js | 40 ++++++++++++++++++++++++++++++++++------ 1 file changed, 34 insertions(+), 6 deletions(-) diff --git a/lib/pen.js b/lib/pen.js index 5c5bfde..7a5585c 100644 --- a/lib/pen.js +++ b/lib/pen.js @@ -94,9 +94,9 @@ export default class Painter { this.ctx.closePath(); this.ctx.fill(); // 在 ios 的 6.6.6 版本上 clip 有 bug，禁掉此类型上的 clip，也就意味着，在此版本微信的 ios 设备下无法使用 border 属性 - if (!(getApp().systemInfo && - getApp().systemInfo.version <= '6.6.6' && - getApp().systemInfo.platform === 'ios')) { + if (!(getApp().systemInfo + && getApp().systemInfo.version <= '6.6.6' + && getApp().systemInfo.platform === 'ios')) { this.ctx.clip(); } this.ctx.setGlobalAlpha(1); @@ -182,10 +182,38 @@ export default class Painter { break; } case 'image': { - // image 如果未设置长宽，则使用图片本身的长宽 + // image的长宽设置成auto的逻辑处理 const ratio = getApp().systemInfo.pixelRatio ? getApp().systemInfo.pixelRatio : 2; - width = view.css && view.css.width ? view.css.width.toPx() : Math.round(view.sWidth / ratio); - height = view.css && view.css.height ? view.css.height.toPx() : Math.round(view.sHeight / ratio); + if (!view.css) { + width = Math.round(view.sWidth / ratio); + height = Math.round(view.sHeight / ratio); + } else { + if (!view.css.width) { + width = Math.round(view.sWidth / ratio); + if ((!view.css.height) || view.css.height === 'auto') { + height = Math.round(view.sHeight / ratio); + } else { + height = view.css.height.toPx(); + } + } else if (view.css.width === 'auto') { + if ((!view.css.height) || view.css.height === 'auto') { + width = Math.round(view.sWidth / ratio); + height = Math.round(view.sHeight / ratio); + } else { + height = view.css.height.toPx(); + width = view.sWidth / view.sHeight * height; + } + } else { + width = view.css.width.toPx(); + if (!view.css.height) { + height = Math.round(view.sHeight / ratio); + } else if (view.css.height === 'auto') { + height = view.sHeight / view.sWidth * width; + } else { + height = view.css.height.toPx(); + } + } + } break; } default: From e82d27f5e4722a9157ac6469461f933cc795abfc Mon Sep 17 00:00:00 2001 From: feipeng Date: Wed, 17 Jul 2019 20:18:45 +0800 Subject: [PATCH 2/2] =?UTF-8?q?=E5=9B=BE=E7=89=87=E6=94=AF=E6=8C=81width?= =?UTF-8?q?=E5=92=8Cheight=E5=B1=9E=E6=80=A7=E9=BB=98=E8=AE=A4=E8=AE=BE?= =?UTF-8?q?=E4=B8=BAauto?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- lib/pen.js | 44 ++++++++++++++++++-------------------------- 1 file changed, 18 insertions(+), 26 deletions(-) diff --git a/lib/pen.js b/lib/pen.js index 7a5585c..09e4569 100644 --- a/lib/pen.js +++ b/lib/pen.js @@ -184,35 +184,27 @@ export default class Painter { case 'image': { // image的长宽设置成auto的逻辑处理 const ratio = getApp().systemInfo.pixelRatio ? getApp().systemInfo.pixelRatio : 2; - if (!view.css) { + // 有css却未设置width或height，则默认为auto + if (view.css) { + if (!view.css.width) { + view.css.width = 'auto'; + } + if (!view.css.height) { + view.css.height = 'auto'; + } + } + if (!view.css || (view.css.width === 'auto' && view.css.height === 'auto')) { width = Math.round(view.sWidth / ratio); height = Math.round(view.sHeight / ratio); + } else if (view.css.width === 'auto') { + height = view.css.height.toPx(); + width = view.sWidth / view.sHeight * height; + } else if (view.css.height === 'auto') { + width = view.css.width.toPx(); + height = view.sHeight / view.sWidth * width; } else { - if (!view.css.width) { - width = Math.round(view.sWidth / ratio); - if ((!view.css.height) || view.css.height === 'auto') { - height = Math.round(view.sHeight / ratio); - } else { - height = view.css.height.toPx(); - } - } else if (view.css.width === 'auto') { - if ((!view.css.height) || view.css.height === 'auto') { - width = Math.round(view.sWidth / ratio); - height = Math.round(view.sHeight / ratio); - } else { - height = view.css.height.toPx(); - width = view.sWidth / view.sHeight * height; - } - } else { - width = view.css.width.toPx(); - if (!view.css.height) { - height = Math.round(view.sHeight / ratio); - } else if (view.css.height === 'auto') { - height = view.sHeight / view.sWidth * width; - } else { - height = view.css.height.toPx(); - } - } + width = view.css.width.toPx(); + height = view.css.height.toPx(); } break; }