leafer-draw 2.0.9 → 2.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/web.cjs +26 -16
- package/dist/web.esm.js +26 -16
- package/dist/web.esm.min.js +1 -1
- package/dist/web.esm.min.js.map +1 -1
- package/dist/web.js +51 -28
- package/dist/web.min.cjs +1 -1
- package/dist/web.min.cjs.map +1 -1
- package/dist/web.min.js +1 -1
- package/dist/web.min.js.map +1 -1
- package/dist/web.module.js +51 -28
- package/dist/web.module.min.js +1 -1
- package/dist/web.module.min.js.map +1 -1
- package/package.json +3 -3
package/dist/web.module.js
CHANGED
|
@@ -3082,7 +3082,7 @@ const PathConvert = {
|
|
|
3082
3082
|
case M$4:
|
|
3083
3083
|
x = old[i + 1];
|
|
3084
3084
|
y = old[i + 2];
|
|
3085
|
-
data.push(M$4, x, y);
|
|
3085
|
+
data.push(lastCommand === command ? L$5 : M$4, x, y);
|
|
3086
3086
|
i += 3;
|
|
3087
3087
|
break;
|
|
3088
3088
|
|
|
@@ -6075,12 +6075,13 @@ const LeafBounds = {
|
|
|
6075
6075
|
if (this.__hasWorldEvent) BoundsEvent.emitWorld(this);
|
|
6076
6076
|
},
|
|
6077
6077
|
__updateLocalBounds() {
|
|
6078
|
-
const layout = this.__layout;
|
|
6078
|
+
const layout = this.__layout, data = this.__;
|
|
6079
6079
|
if (layout.boxChanged) {
|
|
6080
|
-
if (!
|
|
6080
|
+
if (!data.__pathInputed) this.__updatePath();
|
|
6081
6081
|
this.__updateRenderPath();
|
|
6082
6082
|
this.__updateBoxBounds();
|
|
6083
6083
|
layout.resized = "inner";
|
|
6084
|
+
if (data.__strokeGeometry) data.__strokeGeometry = undefined;
|
|
6084
6085
|
}
|
|
6085
6086
|
if (layout.localBoxChanged) {
|
|
6086
6087
|
if (this.__local) this.__updateLocalBoxBounds();
|
|
@@ -6103,6 +6104,7 @@ const LeafBounds = {
|
|
|
6103
6104
|
if (layout.renderSpread || layout.strokeSpread !== layout.strokeBoxSpread) layout.renderChanged = true;
|
|
6104
6105
|
if (this.parent) this.parent.__layout.strokeChange();
|
|
6105
6106
|
layout.resized = "inner";
|
|
6107
|
+
if (data.__strokeGeometry) data.__strokeGeometry = undefined;
|
|
6106
6108
|
}
|
|
6107
6109
|
if (layout.renderChanged) {
|
|
6108
6110
|
layout.renderSpread = this.__updateRenderSpread();
|
|
@@ -7079,7 +7081,7 @@ class LeafLevelList {
|
|
|
7079
7081
|
}
|
|
7080
7082
|
}
|
|
7081
7083
|
|
|
7082
|
-
const version = "2.
|
|
7084
|
+
const version = "2.1.1";
|
|
7083
7085
|
|
|
7084
7086
|
const debug$4 = Debug.get("LeaferCanvas");
|
|
7085
7087
|
|
|
@@ -8079,8 +8081,8 @@ class UIData extends LeafData {
|
|
|
8079
8081
|
return this.__getRealStrokeWidth();
|
|
8080
8082
|
}
|
|
8081
8083
|
get __maxStrokeWidth() {
|
|
8082
|
-
const t = this;
|
|
8083
|
-
return t.__hasMultiStrokeStyle ? Math.max(t.__hasMultiStrokeStyle,
|
|
8084
|
+
const t = this, strokeWidth = t.__hasStrokeSides || t.strokeWidth;
|
|
8085
|
+
return t.__hasMultiStrokeStyle ? Math.max(t.__hasMultiStrokeStyle, strokeWidth) : strokeWidth;
|
|
8084
8086
|
}
|
|
8085
8087
|
get __hasMultiPaint() {
|
|
8086
8088
|
const t = this;
|
|
@@ -8148,7 +8150,7 @@ class UIData extends LeafData {
|
|
|
8148
8150
|
const isStr = isString(value);
|
|
8149
8151
|
if (isStr || value && isObject(value[0])) {
|
|
8150
8152
|
this.__setInput("path", value);
|
|
8151
|
-
this._path = isStr ? parse(value) : objectToCanvasData(value);
|
|
8153
|
+
this._path = isStr ? parse(value, this.__useArrow) : objectToCanvasData(value);
|
|
8152
8154
|
} else {
|
|
8153
8155
|
if (this.__input) this.__removeInput("path");
|
|
8154
8156
|
this._path = value;
|
|
@@ -8181,6 +8183,10 @@ class UIData extends LeafData {
|
|
|
8181
8183
|
}
|
|
8182
8184
|
return strokeWidth;
|
|
8183
8185
|
}
|
|
8186
|
+
__checkComplex() {
|
|
8187
|
+
const t = this;
|
|
8188
|
+
stintSet$3(t, "__complex", t.__isFills || t.__isStrokes || t.cornerRadius || t.__useEffect);
|
|
8189
|
+
}
|
|
8184
8190
|
__setPaint(attrName, value) {
|
|
8185
8191
|
this.__setInput(attrName, value);
|
|
8186
8192
|
const layout = this.__leaf.__layout;
|
|
@@ -8259,7 +8265,11 @@ class EllipseData extends UIData {
|
|
|
8259
8265
|
}
|
|
8260
8266
|
}
|
|
8261
8267
|
|
|
8262
|
-
class PolygonData extends
|
|
8268
|
+
class PolygonData extends UIData {
|
|
8269
|
+
get __usePathBox() {
|
|
8270
|
+
return this.points || this.__pathInputed;
|
|
8271
|
+
}
|
|
8272
|
+
}
|
|
8263
8273
|
|
|
8264
8274
|
class StarData extends UIData {
|
|
8265
8275
|
get __boxStroke() {
|
|
@@ -8370,7 +8380,7 @@ const UIBounds = {
|
|
|
8370
8380
|
if ((data.stroke || data.hitStroke === "all") && strokeWidth && strokeAlign !== "inside") {
|
|
8371
8381
|
boxSpread = spread = strokeAlign === "center" ? strokeWidth / 2 : strokeWidth;
|
|
8372
8382
|
if (!data.__boxStroke || data.__useArrow) {
|
|
8373
|
-
const miterLimitAddWidth = data.__isLinePath ? 0 : 10 * spread;
|
|
8383
|
+
const miterLimitAddWidth = data.__isLinePath ? 0 : (data.strokeJoin === "miter" ? 10 : 1) * spread;
|
|
8374
8384
|
const storkeCapAddWidth = data.strokeCap === "none" ? 0 : strokeWidth;
|
|
8375
8385
|
spread += Math.max(miterLimitAddWidth, storkeCapAddWidth);
|
|
8376
8386
|
}
|
|
@@ -8415,7 +8425,7 @@ const UIRender = {
|
|
|
8415
8425
|
data.__useEffect = !!(shadow || otherEffect);
|
|
8416
8426
|
}
|
|
8417
8427
|
data.__checkSingle();
|
|
8418
|
-
|
|
8428
|
+
data.__checkComplex();
|
|
8419
8429
|
},
|
|
8420
8430
|
__drawFast(canvas, options) {
|
|
8421
8431
|
drawFast(this, canvas, options);
|
|
@@ -9674,7 +9684,7 @@ __decorate([ resizeType() ], Canvas.prototype, "contextSettings", void 0);
|
|
|
9674
9684
|
|
|
9675
9685
|
Canvas = __decorate([ registerUI() ], Canvas);
|
|
9676
9686
|
|
|
9677
|
-
const {copyAndSpread: copyAndSpread$1, includes: includes,
|
|
9687
|
+
const {copyAndSpread: copyAndSpread$1, includes: includes, setList: setList} = BoundsHelper, {stintSet: stintSet$1} = DataHelper;
|
|
9678
9688
|
|
|
9679
9689
|
let Text = class Text extends UI {
|
|
9680
9690
|
get __tag() {
|
|
@@ -9702,9 +9712,10 @@ let Text = class Text extends UI {
|
|
|
9702
9712
|
const {fontSize: fontSize, italic: italic, padding: padding, __autoWidth: autoWidth, __autoHeight: autoHeight} = data;
|
|
9703
9713
|
this.__updateTextDrawData();
|
|
9704
9714
|
const {bounds: contentBounds} = data.__textDrawData;
|
|
9715
|
+
console.log(contentBounds);
|
|
9705
9716
|
const b = layout.boxBounds;
|
|
9706
9717
|
layout.contentBounds = contentBounds;
|
|
9707
|
-
if (data.__lineHeight < fontSize)
|
|
9718
|
+
if (data.__lineHeight < fontSize) layout.renderChanged = true;
|
|
9708
9719
|
if (autoWidth || autoHeight) {
|
|
9709
9720
|
b.x = autoWidth ? contentBounds.x : 0;
|
|
9710
9721
|
b.y = autoHeight ? contentBounds.y : 0;
|
|
@@ -9724,6 +9735,8 @@ let Text = class Text extends UI {
|
|
|
9724
9735
|
__updateRenderSpread() {
|
|
9725
9736
|
let spread = super.__updateRenderSpread();
|
|
9726
9737
|
if (!spread) spread = this.isOverflow ? 1 : 0;
|
|
9738
|
+
const {__lineHeight: __lineHeight, fontSize: fontSize} = this.__;
|
|
9739
|
+
if (__lineHeight < fontSize) spread = FourNumberHelper.max(spread, (fontSize - __lineHeight) / 2);
|
|
9727
9740
|
return spread;
|
|
9728
9741
|
}
|
|
9729
9742
|
__updateRenderBounds() {
|
|
@@ -10181,8 +10194,8 @@ function compute(attrName, ui) {
|
|
|
10181
10194
|
}
|
|
10182
10195
|
}
|
|
10183
10196
|
}
|
|
10184
|
-
data["_" + attrName] = leafPaints.length ? leafPaints : undefined;
|
|
10185
10197
|
if (leafPaints.length) {
|
|
10198
|
+
data["_" + attrName] = leafPaints;
|
|
10186
10199
|
if (leafPaints.every(item => item.isTransparent)) {
|
|
10187
10200
|
if (leafPaints.some(item => item.image)) isAlphaPixel = true;
|
|
10188
10201
|
isTransparent = true;
|
|
@@ -10197,6 +10210,7 @@ function compute(attrName, ui) {
|
|
|
10197
10210
|
}
|
|
10198
10211
|
} else {
|
|
10199
10212
|
data.__removePaint(attrName, false);
|
|
10213
|
+
data["_" + attrName] = "";
|
|
10200
10214
|
}
|
|
10201
10215
|
}
|
|
10202
10216
|
|
|
@@ -10346,11 +10360,12 @@ function checkSizeAndCreateData(ui, attrName, paint, image, leafPaint, boxBounds
|
|
|
10346
10360
|
needUpdate = false;
|
|
10347
10361
|
}
|
|
10348
10362
|
}
|
|
10363
|
+
if (paint.mode === "brush") PaintImage.brush(leafPaint);
|
|
10349
10364
|
if (!leafPaint.data) {
|
|
10350
10365
|
PaintImage.createData(leafPaint, image, paint, boxBounds);
|
|
10351
|
-
const {transform: transform} = leafPaint.data, {opacity: opacity
|
|
10352
|
-
const clip = transform && !transform.onlyScale || data.path || data.cornerRadius;
|
|
10353
|
-
if (clip || opacity && opacity < 1 || blendMode) leafPaint.complex = clip ? 2 : true;
|
|
10366
|
+
const {transform: transform} = leafPaint.data, {opacity: opacity} = paint;
|
|
10367
|
+
const clip = (transform && !transform.onlyScale || data.path || data.cornerRadius) && !leafPaint.brush;
|
|
10368
|
+
if (clip || opacity && opacity < 1 || paint.blendMode) leafPaint.complex = clip ? 2 : true;
|
|
10354
10369
|
}
|
|
10355
10370
|
if (paint.filter) PaintImage.applyFilter(leafPaint, image, paint.filter, ui);
|
|
10356
10371
|
return needUpdate;
|
|
@@ -10440,6 +10455,7 @@ function getPatternData(paint, box, image) {
|
|
|
10440
10455
|
break;
|
|
10441
10456
|
|
|
10442
10457
|
case "repeat":
|
|
10458
|
+
case "brush":
|
|
10443
10459
|
if (!sameBox || scaleX || rotation || skew) PaintImage.repeatMode(data, box, width, height, tempImage.x, tempImage.y, scaleX, scaleY, rotation, skew, align, paint.freeTransform);
|
|
10444
10460
|
if (!repeat) data.repeat = "repeat";
|
|
10445
10461
|
const count = isObject(repeat);
|
|
@@ -10580,7 +10596,7 @@ function createPattern(paint, ui, canvas, renderOptions) {
|
|
|
10580
10596
|
let {scaleX: scaleX, scaleY: scaleY} = PaintImage.getImageRenderScaleData(paint, ui, canvas, renderOptions), id = paint.film ? paint.nowIndex : scaleX + "-" + scaleY;
|
|
10581
10597
|
if (paint.patternId !== id && !ui.destroyed) {
|
|
10582
10598
|
if (!(Platform.image.isLarge(paint.image, scaleX, scaleY) && !paint.data.repeat)) {
|
|
10583
|
-
const {image: image, data: data} = paint, {opacity: opacity} = paint.originPaint, {transform: transform, gap: gap} = data, fixScale = PaintImage.getPatternFixScale(paint, scaleX, scaleY);
|
|
10599
|
+
const {image: image, brush: brush, data: data} = paint, {opacity: opacity} = paint.originPaint, {transform: transform, gap: gap} = data, fixScale = PaintImage.getPatternFixScale(paint, scaleX, scaleY);
|
|
10584
10600
|
let imageMatrix, xGap, yGap, {width: width, height: height} = image;
|
|
10585
10601
|
if (fixScale) scaleX *= fixScale, scaleY *= fixScale;
|
|
10586
10602
|
width *= scaleX;
|
|
@@ -10588,6 +10604,10 @@ function createPattern(paint, ui, canvas, renderOptions) {
|
|
|
10588
10604
|
if (gap) {
|
|
10589
10605
|
xGap = gap.x * scaleX / abs$1(data.scaleX || 1);
|
|
10590
10606
|
yGap = gap.y * scaleY / abs$1(data.scaleY || 1);
|
|
10607
|
+
if (brush) {
|
|
10608
|
+
const brushScale = PaintImage.getBrushScale(paint, ui);
|
|
10609
|
+
xGap /= brushScale, yGap /= brushScale;
|
|
10610
|
+
}
|
|
10591
10611
|
}
|
|
10592
10612
|
if (transform || scaleX !== 1 || scaleY !== 1) {
|
|
10593
10613
|
scaleX *= getFloorScale(width + (xGap || 0));
|
|
@@ -10597,7 +10617,7 @@ function createPattern(paint, ui, canvas, renderOptions) {
|
|
|
10597
10617
|
scale(imageMatrix, 1 / scaleX, 1 / scaleY);
|
|
10598
10618
|
}
|
|
10599
10619
|
const imageCanvas = image.getCanvas(width, height, opacity, undefined, xGap, yGap, ui.leafer && ui.leafer.config.smooth, data.interlace);
|
|
10600
|
-
const pattern = image.getPattern(imageCanvas, data.repeat || (Platform.origin.noRepeat || "no-repeat"), imageMatrix, paint);
|
|
10620
|
+
const pattern = brush ? imageCanvas : image.getPattern(imageCanvas, data.repeat || (Platform.origin.noRepeat || "no-repeat"), imageMatrix, paint);
|
|
10601
10621
|
paint.style = pattern;
|
|
10602
10622
|
paint.patternId = id;
|
|
10603
10623
|
}
|
|
@@ -10618,9 +10638,9 @@ function getPatternFixScale(paint, imageScaleX, imageScaleY) {
|
|
|
10618
10638
|
|
|
10619
10639
|
function checkImage(paint, drawImage, ui, canvas, renderOptions) {
|
|
10620
10640
|
const {scaleX: scaleX, scaleY: scaleY} = PaintImage.getImageRenderScaleData(paint, ui, canvas, renderOptions), id = paint.film ? paint.nowIndex : scaleX + "-" + scaleY;
|
|
10621
|
-
const {image: image, data: data, originPaint: originPaint} = paint, {exporting: exporting, snapshot: snapshot} = renderOptions;
|
|
10641
|
+
const {image: image, brush: brush, data: data, originPaint: originPaint} = paint, {exporting: exporting, snapshot: snapshot} = renderOptions;
|
|
10622
10642
|
if (!data || paint.patternId === id && !exporting || snapshot) {
|
|
10623
|
-
return false;
|
|
10643
|
+
if (!(brush && paint.style)) return false;
|
|
10624
10644
|
} else {
|
|
10625
10645
|
if (drawImage) {
|
|
10626
10646
|
if (data.repeat) {
|
|
@@ -10634,18 +10654,18 @@ function checkImage(paint, drawImage, ui, canvas, renderOptions) {
|
|
|
10634
10654
|
canvas.fillStyle = paint.style || "#000";
|
|
10635
10655
|
canvas.fill();
|
|
10636
10656
|
}
|
|
10637
|
-
PaintImage.drawImage(paint, scaleX, scaleY, ui, canvas, renderOptions);
|
|
10638
|
-
return true;
|
|
10639
10657
|
} else {
|
|
10640
10658
|
if (!paint.style || originPaint.sync || exporting) PaintImage.createPattern(paint, ui, canvas, renderOptions); else PaintImage.createPatternTask(paint, ui, canvas, renderOptions);
|
|
10641
|
-
return false;
|
|
10659
|
+
if (!(brush && paint.style)) return false;
|
|
10642
10660
|
}
|
|
10643
10661
|
}
|
|
10662
|
+
PaintImage.drawImage(paint, scaleX, scaleY, ui, canvas, renderOptions);
|
|
10663
|
+
return true;
|
|
10644
10664
|
}
|
|
10645
10665
|
|
|
10646
10666
|
function drawImage(paint, imageScaleX, imageScaleY, ui, canvas, _renderOptions) {
|
|
10647
|
-
const {data: data, image: image, complex: complex} = paint;
|
|
10648
|
-
let {width: width, height: height} = image;
|
|
10667
|
+
const {data: data, image: image, brush: brush, complex: complex} = paint;
|
|
10668
|
+
let {width: width, height: height} = image, view = brush || image;
|
|
10649
10669
|
if (complex) {
|
|
10650
10670
|
const {blendMode: blendMode, opacity: opacity} = paint.originPaint, {transform: transform} = data;
|
|
10651
10671
|
canvas.save();
|
|
@@ -10653,16 +10673,17 @@ function drawImage(paint, imageScaleX, imageScaleY, ui, canvas, _renderOptions)
|
|
|
10653
10673
|
blendMode && (canvas.blendMode = blendMode);
|
|
10654
10674
|
opacity && (canvas.opacity *= opacity);
|
|
10655
10675
|
transform && canvas.transform(transform);
|
|
10656
|
-
|
|
10676
|
+
view.render(canvas, 0, 0, width, height, ui, paint, imageScaleX, imageScaleY);
|
|
10657
10677
|
canvas.restore();
|
|
10658
10678
|
} else {
|
|
10659
10679
|
if (data.scaleX) width *= data.scaleX, height *= data.scaleY;
|
|
10660
|
-
|
|
10680
|
+
view.render(canvas, 0, 0, width, height, ui, paint, imageScaleX, imageScaleY);
|
|
10661
10681
|
}
|
|
10662
10682
|
}
|
|
10663
10683
|
|
|
10664
10684
|
function getImageRenderScaleData(paint, ui, canvas, _renderOptions) {
|
|
10665
10685
|
const scaleData = ui.getRenderScaleData(true, paint.originPaint.scaleFixed), {data: data} = paint;
|
|
10686
|
+
if (paint.brush) PaintImage.addBrushScale(scaleData, paint, ui);
|
|
10666
10687
|
if (canvas) {
|
|
10667
10688
|
const {pixelRatio: pixelRatio} = canvas;
|
|
10668
10689
|
scaleData.scaleX *= pixelRatio;
|
|
@@ -10679,6 +10700,7 @@ function recycleImage(attrName, data) {
|
|
|
10679
10700
|
const paints = data["_" + attrName];
|
|
10680
10701
|
if (isArray(paints)) {
|
|
10681
10702
|
let paint, image, recycleMap, input, url;
|
|
10703
|
+
const ui = data.__leaf;
|
|
10682
10704
|
for (let i = 0, len = paints.length; i < len; i++) {
|
|
10683
10705
|
paint = paints[i];
|
|
10684
10706
|
image = paint.image;
|
|
@@ -10687,7 +10709,8 @@ function recycleImage(attrName, data) {
|
|
|
10687
10709
|
if (!recycleMap) recycleMap = {};
|
|
10688
10710
|
recycleMap[url] = true;
|
|
10689
10711
|
ImageManager.recyclePaint(paint);
|
|
10690
|
-
if (
|
|
10712
|
+
if (paint.brush) PaintImage.recycleBrush(paint, ui);
|
|
10713
|
+
if (data.__willDestroy && image.parent) PaintImage.recycleFilter(image, ui);
|
|
10691
10714
|
if (image.loading) {
|
|
10692
10715
|
if (!input) {
|
|
10693
10716
|
input = data.__input && data.__input[attrName] || [];
|