open/PainterCore
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

format and fix bugs

Browse Source
This commit is contained in:
CPPAlien 2019-12-10 11:40:30 +08:00
parent 5f84e5943e
commit 7dac57c93b
1 changed files with 54 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
lib/pen.js
View File

@ -85,7 +85,13 @@ export default class Painter {
} }
} }
_border({ borderRadius = 0, width, height, borderWidth = 0, borderStyle = 'solid' }) { _border({
borderRadius = 0,
width,
height,
borderWidth = 0,
borderStyle = 'solid'
}) {
let r1 = 0, let r1 = 0,
r2 = 0, r2 = 0,
r3 = 0, r3 = 0,
@ -144,7 +150,12 @@ export default class Painter {
// globalAlpha 在 1.9.90 起支持，低版本下无效，但把 fillStyle 设为了 white，相对默认的 black 要好点 // globalAlpha 在 1.9.90 起支持，低版本下无效，但把 fillStyle 设为了 white，相对默认的 black 要好点
this.ctx.globalAlpha = 0; this.ctx.globalAlpha = 0;
this.ctx.fillStyle = 'white'; this.ctx.fillStyle = 'white';
this._border({ borderRadius, width, height, borderStyle }) this._border({
borderRadius,
width,
height,
borderStyle
})
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 &&
@ -175,7 +186,13 @@ export default class Painter {
this.ctx.save(); this.ctx.save();
this._preProcess(view, true); this._preProcess(view, true);
this.ctx.strokeStyle = (borderColor || 'black'); this.ctx.strokeStyle = (borderColor || 'black');
this._border({ borderRadius, width, height, borderWidth, borderStyle }) this._border({
borderRadius,
width,
height,
borderWidth,
borderStyle
})
this.ctx.stroke(); this.ctx.stroke();
this.ctx.restore(); this.ctx.restore();
} }
@ -196,7 +213,9 @@ export default class Painter {
} }
const fontWeight = view.css.fontWeight === 'bold' ? 'bold' : 'normal'; const fontWeight = view.css.fontWeight === 'bold' ? 'bold' : 'normal';
const textStyle = view.css.textStyle === 'italic' ? 'italic' : 'normal'; const textStyle = view.css.textStyle === 'italic' ? 'italic' : 'normal';
const fontSize = view.css.fontSize ? view.css.fontSize.toPx() : '20rpx'.toPx(); if (!view.css.fontSize) {
view.css.fontSize = '20rpx';
}
this.ctx.font = `${textStyle} ${fontWeight} ${view.css.fontSize.toPx()}px ${view.css.fontFamily ? view.css.fontFamily : 'sans-serif'}`; this.ctx.font = `${textStyle} ${fontWeight} ${view.css.fontSize.toPx()}px ${view.css.fontFamily ? view.css.fontFamily : 'sans-serif'}`;
// 计算行数 // 计算行数
let lines = 0; let lines = 0;
@ -335,11 +354,11 @@ export default class Painter {
left = x - width left = x - width
} }
var top = y; var top = y;
if (verticalAlign === 'center') { if (verticalAlign === 'center') {
top = y - height / 2; top = y - height / 2;
} else if (verticalAlign === 'bottom') { } else if (verticalAlign === 'bottom') {
top = y - height top = y - height
} }
view.rect = { view.rect = {
left: left, left: left,
top: top, top: top,
@ -348,7 +367,7 @@ export default class Painter {
x: view.css && view.css.right ? x - width : x, x: view.css && view.css.right ? x - width : x,
y: y y: y
}; };
view.rect.left = view.rect.left - paddings[3]; view.rect.left = view.rect.left - paddings[3];
view.rect.top = view.rect.top - paddings[0]; view.rect.top = view.rect.top - paddings[0];
view.rect.right = view.rect.right + paddings[1]; view.rect.right = view.rect.right + paddings[1];
@ -547,7 +566,7 @@ export default class Painter {
} }
let lineIndex = 0; let lineIndex = 0;
for (let j = 0; j < textArray.length; ++j) { for (let j = 0; j < textArray.length; ++j) {
const preLineLength = Math.floor(textArray[j].length / linesArray[j]); const preLineLength = Math.ceil(textArray[j].length / linesArray[j]);
let start = 0; let start = 0;
let alreadyCount = 0; let alreadyCount = 0;
for (let i = 0; i < linesArray[j]; ++i) { for (let i = 0; i < linesArray[j]; ++i) {
@ -638,7 +657,17 @@ export default class Painter {
this.ctx.stroke(); this.ctx.stroke();
} }
if (!this.isMoving) { if (!this.isMoving) {
this.callbackInfo.lineArray ? this.callbackInfo.lineArray.push({ text, x, y, measuredWith }) : this.callbackInfo.lineArray = [{ text, x, y, measuredWith }] this.callbackInfo.lineArray ? this.callbackInfo.lineArray.push({
text,
x,
y,
measuredWith
}) : this.callbackInfo.lineArray = [{
text,
x,
y,
measuredWith
}]
} }
} }
} }
@ -658,8 +687,18 @@ export default class Painter {
} else { } else {
this.ctx.fillStyle = view.css.color; this.ctx.fillStyle = view.css.color;
} }
const { borderRadius, borderStyle, borderWidth } = view.css const {
this._border({ borderRadius, width, height, borderWidth, borderStyle }) borderRadius,
borderStyle,
borderWidth
} = view.css
this._border({
borderRadius,
width,
height,
borderWidth,
borderStyle
})
this.ctx.fill(); this.ctx.fill();
this.ctx.restore(); this.ctx.restore();
this._doBorder(view, width, height); this._doBorder(view, width, height);
@ -685,4 +724,4 @@ export default class Painter {
_getAngle(angle) { _getAngle(angle) {
return Number(angle) * Math.PI / 180; return Number(angle) * Math.PI / 180;
} }
} }