添加全 view 的相对布局解决方案

This commit is contained in:
CPPAlien 2019-11-06 16:41:28 +08:00
parent 0d89fe6cb7
commit 9afbf37957

View File

@ -5,8 +5,8 @@ export default class Painter {
constructor(ctx, data) { constructor(ctx, data) {
this.ctx = ctx; this.ctx = ctx;
this.data = data; this.data = data;
this.globalTextWidth = {}; this.globalWidth = {};
this.globalTextHeight = {}; this.globalHeight = {};
} }
paint(callback) { paint(callback) {
@ -95,9 +95,9 @@ export default class Painter {
this.ctx.closePath(); this.ctx.closePath();
this.ctx.fill(); this.ctx.fill();
// 在 ios 的 6.6.6 版本上 clip 有 bug禁掉此类型上的 clip也就意味着在此版本微信的 ios 设备下无法使用 border 属性 // 在 ios 的 6.6.6 版本上 clip 有 bug禁掉此类型上的 clip也就意味着在此版本微信的 ios 设备下无法使用 border 属性
if (!(getApp().systemInfo if (!(getApp().systemInfo &&
&& getApp().systemInfo.version <= '6.6.6' getApp().systemInfo.version <= '6.6.6' &&
&& getApp().systemInfo.platform === 'ios')) { getApp().systemInfo.platform === 'ios')) {
this.ctx.clip(); this.ctx.clip();
} }
this.ctx.setGlobalAlpha(1); this.ctx.setGlobalAlpha(1);
@ -226,14 +226,14 @@ export default class Painter {
// 可以用数组方式,把文字长度计算进去 // 可以用数组方式,把文字长度计算进去
// [right, 文字id, 乘数(默认 1] // [right, 文字id, 乘数(默认 1]
const rights = view.css.right; const rights = view.css.right;
x = this.style.width - rights[0].toPx(true) - this.globalTextWidth[rights[1]] * (rights[2] || 1); x = this.style.width - rights[0].toPx(true) - this.globalWidth[rights[1]] * (rights[2] || 1);
} }
} else if (view.css && view.css.left) { } else if (view.css && view.css.left) {
if (typeof view.css.left === 'string') { if (typeof view.css.left === 'string') {
x = view.css.left.toPx(true); x = view.css.left.toPx(true);
} else { } else {
const lefts = view.css.left; const lefts = view.css.left;
x = lefts[0].toPx(true) + this.globalTextWidth[lefts[1]] * (lefts[2] || 1); x = lefts[0].toPx(true) + this.globalWidth[lefts[1]] * (lefts[2] || 1);
} }
} else { } else {
x = 0; x = 0;
@ -248,7 +248,7 @@ export default class Painter {
y = view.css.top.toPx(true); y = view.css.top.toPx(true);
} else { } else {
const tops = view.css.top; const tops = view.css.top;
y = tops[0].toPx(true) + this.globalTextHeight[tops[1]] * (tops[2] || 1); y = tops[0].toPx(true) + this.globalHeight[tops[1]] * (tops[2] || 1);
} }
} else { } else {
y = 0 y = 0
@ -274,7 +274,10 @@ export default class Painter {
this._doClip(view.css.borderRadius, width, height); this._doClip(view.css.borderRadius, width, height);
} }
this._doShadow(view); this._doShadow(view);
if (view.id) {
this.globalWidth[view.id] = width;
this.globalHeight[view.id] = height;
}
return { return {
width: width, width: width,
height: height, height: height,
@ -408,8 +411,7 @@ export default class Painter {
for (let i = 0; i < textArray.length; ++i) { for (let i = 0; i < textArray.length; ++i) {
textWidth = this.ctx.measureText(textArray[i]).width > textWidth ? this.ctx.measureText(textArray[i]).width : textWidth; textWidth = this.ctx.measureText(textArray[i]).width > textWidth ? this.ctx.measureText(textArray[i]).width : textWidth;
} }
this.globalTextWidth[view.id] = width ? (textWidth < width ? textWidth : width) : textWidth; this.globalWidth[view.id] = width ? (textWidth < width ? textWidth : width) : textWidth;
this.globalTextHeight[view.id] = height;
} }
let lineIndex = 0; let lineIndex = 0;
for (let j = 0; j < textArray.length; ++j) { for (let j = 0; j < textArray.length; ++j) {