@leafer-draw/miniapp 1.5.3 → 1.6.0
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/miniapp.cjs +68 -71
- package/dist/miniapp.cjs.map +1 -1
- package/dist/miniapp.esm.js +68 -71
- package/dist/miniapp.esm.js.map +1 -1
- package/dist/miniapp.esm.min.js +1 -1
- package/dist/miniapp.esm.min.js.map +1 -1
- package/dist/miniapp.min.cjs +1 -1
- package/dist/miniapp.min.cjs.map +1 -1
- package/dist/miniapp.module.js +260 -165
- package/dist/miniapp.module.js.map +1 -1
- package/dist/miniapp.module.min.js +1 -1
- package/dist/miniapp.module.min.js.map +1 -1
- package/package.json +9 -8
- package/src/core.ts +143 -0
- package/src/index.ts +2 -2
- package/types/index.d.ts +8 -1
package/dist/miniapp.cjs
CHANGED
|
@@ -380,7 +380,6 @@ function updateChange(updateList) {
|
|
|
380
380
|
}
|
|
381
381
|
|
|
382
382
|
const { worldBounds } = core.LeafBoundsHelper;
|
|
383
|
-
const bigBounds = { x: 0, y: 0, width: 100000, height: 100000 };
|
|
384
383
|
class LayoutBlockData {
|
|
385
384
|
constructor(list) {
|
|
386
385
|
this.updatedBounds = new core.Bounds();
|
|
@@ -394,13 +393,7 @@ class LayoutBlockData {
|
|
|
394
393
|
this.beforeBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
395
394
|
}
|
|
396
395
|
setAfter() {
|
|
397
|
-
|
|
398
|
-
if (list.some(leaf => leaf.noBounds)) {
|
|
399
|
-
this.afterBounds.set(bigBounds);
|
|
400
|
-
}
|
|
401
|
-
else {
|
|
402
|
-
this.afterBounds.setListWithFn(list, worldBounds);
|
|
403
|
-
}
|
|
396
|
+
this.afterBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
404
397
|
this.updatedBounds.setList([this.beforeBounds, this.afterBounds]);
|
|
405
398
|
}
|
|
406
399
|
merge(data) {
|
|
@@ -602,6 +595,13 @@ class Renderer {
|
|
|
602
595
|
requestLayout() {
|
|
603
596
|
this.target.emit(core.LayoutEvent.REQUEST);
|
|
604
597
|
}
|
|
598
|
+
checkRender() {
|
|
599
|
+
if (this.running) {
|
|
600
|
+
if (this.changed && this.canvas.view)
|
|
601
|
+
this.render();
|
|
602
|
+
this.target.emit(core.RenderEvent.NEXT);
|
|
603
|
+
}
|
|
604
|
+
}
|
|
605
605
|
render(callback) {
|
|
606
606
|
if (!(this.running && this.canvas.view))
|
|
607
607
|
return this.update();
|
|
@@ -610,8 +610,6 @@ class Renderer {
|
|
|
610
610
|
this.totalBounds = new core.Bounds();
|
|
611
611
|
debug.log(target.innerName, '--->');
|
|
612
612
|
try {
|
|
613
|
-
if (!target.isApp)
|
|
614
|
-
target.app.emit(core.RenderEvent.CHILD_START, target);
|
|
615
613
|
this.emitRender(core.RenderEvent.START);
|
|
616
614
|
this.renderOnce(callback);
|
|
617
615
|
this.emitRender(core.RenderEvent.END, this.totalBounds);
|
|
@@ -679,20 +677,12 @@ class Renderer {
|
|
|
679
677
|
}
|
|
680
678
|
clipRender(block) {
|
|
681
679
|
const t = core.Run.start('PartRender');
|
|
682
|
-
const { canvas } = this;
|
|
683
|
-
const bounds = block.getIntersect(canvas.bounds);
|
|
684
|
-
const includes = block.includes(this.target.__world);
|
|
685
|
-
const realBounds = new core.Bounds(bounds);
|
|
680
|
+
const { canvas } = this, bounds = block.getIntersect(canvas.bounds), realBounds = new core.Bounds(bounds);
|
|
686
681
|
canvas.save();
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
bounds.spread(10 + 1 / this.canvas.pixelRatio).ceil();
|
|
692
|
-
canvas.clearWorld(bounds, true);
|
|
693
|
-
canvas.clipWorld(bounds, true);
|
|
694
|
-
}
|
|
695
|
-
this.__render(bounds, includes, realBounds);
|
|
682
|
+
bounds.spread(Renderer.clipSpread).ceil();
|
|
683
|
+
canvas.clearWorld(bounds, true);
|
|
684
|
+
canvas.clipWorld(bounds, true);
|
|
685
|
+
this.__render(bounds, block.includes(this.target.__world), realBounds);
|
|
696
686
|
canvas.restore();
|
|
697
687
|
core.Run.end(t);
|
|
698
688
|
}
|
|
@@ -706,23 +696,17 @@ class Renderer {
|
|
|
706
696
|
core.Run.end(t);
|
|
707
697
|
}
|
|
708
698
|
__render(bounds, includes, realBounds) {
|
|
709
|
-
const options =
|
|
699
|
+
const { canvas } = this, options = includes ? { includes } : { bounds, includes };
|
|
710
700
|
if (this.needFill)
|
|
711
|
-
|
|
701
|
+
canvas.fillWorld(bounds, this.config.fill);
|
|
712
702
|
if (core.Debug.showRepaint)
|
|
713
|
-
|
|
714
|
-
this.target.__render(
|
|
703
|
+
core.Debug.drawRepaint(canvas, bounds);
|
|
704
|
+
this.target.__render(canvas, options);
|
|
715
705
|
this.renderBounds = realBounds = realBounds || bounds;
|
|
716
706
|
this.renderOptions = options;
|
|
717
707
|
this.totalBounds.isEmpty() ? this.totalBounds = realBounds : this.totalBounds.add(realBounds);
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
if (core.Debug.showBoundsView)
|
|
721
|
-
this.renderBoundsView(options);
|
|
722
|
-
this.canvas.updateRender(realBounds);
|
|
723
|
-
}
|
|
724
|
-
renderHitView(_options) { }
|
|
725
|
-
renderBoundsView(_options) { }
|
|
708
|
+
canvas.updateRender(realBounds);
|
|
709
|
+
}
|
|
726
710
|
addBlock(block) {
|
|
727
711
|
if (!this.updateBlocks)
|
|
728
712
|
this.updateBlocks = [];
|
|
@@ -738,17 +722,24 @@ class Renderer {
|
|
|
738
722
|
}
|
|
739
723
|
}
|
|
740
724
|
__requestRender() {
|
|
725
|
+
const target = this.target;
|
|
726
|
+
if (target.parentApp)
|
|
727
|
+
return target.parentApp.renderer.update(false);
|
|
741
728
|
if (this.requestTime)
|
|
742
729
|
return;
|
|
743
730
|
const requestTime = this.requestTime = Date.now();
|
|
744
731
|
core.Platform.requestRender(() => {
|
|
745
732
|
this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() - requestTime)));
|
|
746
733
|
this.requestTime = 0;
|
|
747
|
-
if (
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
734
|
+
if (target.isApp) {
|
|
735
|
+
target.emit(core.RenderEvent.CHILD_START, target);
|
|
736
|
+
target.children.forEach(leafer => {
|
|
737
|
+
leafer.renderer.FPS = this.FPS;
|
|
738
|
+
leafer.renderer.checkRender();
|
|
739
|
+
});
|
|
740
|
+
target.emit(core.RenderEvent.CHILD_END, target);
|
|
751
741
|
}
|
|
742
|
+
this.checkRender();
|
|
752
743
|
});
|
|
753
744
|
}
|
|
754
745
|
__onResize(e) {
|
|
@@ -806,6 +797,7 @@ class Renderer {
|
|
|
806
797
|
}
|
|
807
798
|
}
|
|
808
799
|
}
|
|
800
|
+
Renderer.clipSpread = 10;
|
|
809
801
|
|
|
810
802
|
Object.assign(core.Creator, {
|
|
811
803
|
watcher: (target, options) => new Watcher(target, options),
|
|
@@ -1168,9 +1160,11 @@ const tempBox = new core.Bounds();
|
|
|
1168
1160
|
const tempPoint = {};
|
|
1169
1161
|
const tempScaleData = {};
|
|
1170
1162
|
function createData(leafPaint, image, paint, box) {
|
|
1171
|
-
const { blendMode, sync } = paint;
|
|
1163
|
+
const { blendMode, changeful, sync } = paint;
|
|
1172
1164
|
if (blendMode)
|
|
1173
1165
|
leafPaint.blendMode = blendMode;
|
|
1166
|
+
if (changeful)
|
|
1167
|
+
leafPaint.changeful = changeful;
|
|
1174
1168
|
if (sync)
|
|
1175
1169
|
leafPaint.sync = sync;
|
|
1176
1170
|
leafPaint.data = getPatternData(paint, box, image);
|
|
@@ -1435,40 +1429,32 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
1435
1429
|
};
|
|
1436
1430
|
|
|
1437
1431
|
const { abs } = Math;
|
|
1438
|
-
function checkImage(ui, canvas, paint,
|
|
1432
|
+
function checkImage(ui, canvas, paint, allowDraw) {
|
|
1439
1433
|
const { scaleX, scaleY } = core.ImageManager.patternLocked ? ui.__world : ui.__nowWorld;
|
|
1440
|
-
const { pixelRatio } = canvas;
|
|
1441
|
-
if (!
|
|
1434
|
+
const { pixelRatio } = canvas, { data } = paint;
|
|
1435
|
+
if (!data || (paint.patternId === scaleX + '-' + scaleY + '-' + pixelRatio && !draw.Export.running)) {
|
|
1442
1436
|
return false;
|
|
1443
1437
|
}
|
|
1444
1438
|
else {
|
|
1445
|
-
|
|
1446
|
-
|
|
1447
|
-
|
|
1448
|
-
let { width, height } = data;
|
|
1449
|
-
width *= abs(scaleX) * pixelRatio;
|
|
1450
|
-
height *= abs(scaleY) * pixelRatio;
|
|
1451
|
-
if (data.scaleX) {
|
|
1452
|
-
width *= data.scaleX;
|
|
1453
|
-
height *= data.scaleY;
|
|
1454
|
-
}
|
|
1455
|
-
allowPaint = (width * height > core.Platform.image.maxCacheSize) || draw.Export.running;
|
|
1439
|
+
if (allowDraw) {
|
|
1440
|
+
if (data.repeat) {
|
|
1441
|
+
allowDraw = false;
|
|
1456
1442
|
}
|
|
1457
1443
|
else {
|
|
1458
|
-
|
|
1444
|
+
if (!(paint.changeful || core.ResizeEvent.isResizing(ui) || draw.Export.running)) {
|
|
1445
|
+
let { width, height } = data;
|
|
1446
|
+
width *= abs(scaleX) * pixelRatio;
|
|
1447
|
+
height *= abs(scaleY) * pixelRatio;
|
|
1448
|
+
if (data.scaleX) {
|
|
1449
|
+
width *= data.scaleX;
|
|
1450
|
+
height *= data.scaleY;
|
|
1451
|
+
}
|
|
1452
|
+
allowDraw = (width * height > core.Platform.image.maxCacheSize);
|
|
1453
|
+
}
|
|
1459
1454
|
}
|
|
1460
1455
|
}
|
|
1461
|
-
if (
|
|
1462
|
-
canvas
|
|
1463
|
-
ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
|
|
1464
|
-
if (paint.blendMode)
|
|
1465
|
-
canvas.blendMode = paint.blendMode;
|
|
1466
|
-
if (data.opacity)
|
|
1467
|
-
canvas.opacity *= data.opacity;
|
|
1468
|
-
if (data.transform)
|
|
1469
|
-
canvas.transform(data.transform);
|
|
1470
|
-
canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
|
|
1471
|
-
canvas.restore();
|
|
1456
|
+
if (allowDraw) {
|
|
1457
|
+
drawImage(ui, canvas, paint, data);
|
|
1472
1458
|
return true;
|
|
1473
1459
|
}
|
|
1474
1460
|
else {
|
|
@@ -1489,13 +1475,26 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1489
1475
|
}
|
|
1490
1476
|
}
|
|
1491
1477
|
}
|
|
1478
|
+
function drawImage(ui, canvas, paint, data) {
|
|
1479
|
+
canvas.save();
|
|
1480
|
+
ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
|
|
1481
|
+
if (paint.blendMode)
|
|
1482
|
+
canvas.blendMode = paint.blendMode;
|
|
1483
|
+
if (data.opacity)
|
|
1484
|
+
canvas.opacity *= data.opacity;
|
|
1485
|
+
if (data.transform)
|
|
1486
|
+
canvas.transform(data.transform);
|
|
1487
|
+
canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
|
|
1488
|
+
canvas.restore();
|
|
1489
|
+
}
|
|
1492
1490
|
|
|
1493
1491
|
function recycleImage(attrName, data) {
|
|
1494
1492
|
const paints = data['_' + attrName];
|
|
1495
1493
|
if (paints instanceof Array) {
|
|
1496
|
-
let image, recycleMap, input, url;
|
|
1494
|
+
let paint, image, recycleMap, input, url;
|
|
1497
1495
|
for (let i = 0, len = paints.length; i < len; i++) {
|
|
1498
|
-
|
|
1496
|
+
paint = paints[i];
|
|
1497
|
+
image = paint.image;
|
|
1499
1498
|
url = image && image.url;
|
|
1500
1499
|
if (url) {
|
|
1501
1500
|
if (!recycleMap)
|
|
@@ -1510,8 +1509,6 @@ function recycleImage(attrName, data) {
|
|
|
1510
1509
|
}
|
|
1511
1510
|
image.unload(paints[i].loadId, !input.some((item) => item.url === url));
|
|
1512
1511
|
}
|
|
1513
|
-
else
|
|
1514
|
-
paints[i].style = null;
|
|
1515
1512
|
}
|
|
1516
1513
|
}
|
|
1517
1514
|
return recycleMap;
|
|
@@ -1690,7 +1687,7 @@ const { toOffsetOutBounds } = core.BoundsHelper;
|
|
|
1690
1687
|
const offsetOutBounds = {};
|
|
1691
1688
|
function innerShadow(ui, current, shape) {
|
|
1692
1689
|
let copyBounds, spreadScale;
|
|
1693
|
-
const { __nowWorld: nowWorld, __layout
|
|
1690
|
+
const { __nowWorld: nowWorld, __layout } = ui;
|
|
1694
1691
|
const { innerShadow } = ui.__;
|
|
1695
1692
|
const { worldCanvas, bounds, shapeBounds, scaleX, scaleY } = shape;
|
|
1696
1693
|
const other = current.getSameCanvas();
|