@leafer-ui/node 1.5.3 → 1.6.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/node.cjs +73 -75
- package/dist/node.cjs.map +1 -1
- package/dist/node.esm.js +73 -75
- package/dist/node.esm.js.map +1 -1
- package/dist/node.esm.min.js +1 -1
- package/dist/node.esm.min.js.map +1 -1
- package/dist/node.min.cjs +1 -1
- package/dist/node.min.cjs.map +1 -1
- package/package.json +12 -11
- package/src/core.ts +73 -0
- package/src/index.ts +2 -2
- package/types/index.d.ts +8 -1
package/dist/node.cjs
CHANGED
|
@@ -255,7 +255,6 @@ function updateChange(updateList) {
|
|
|
255
255
|
}
|
|
256
256
|
|
|
257
257
|
const { worldBounds } = core.LeafBoundsHelper;
|
|
258
|
-
const bigBounds = { x: 0, y: 0, width: 100000, height: 100000 };
|
|
259
258
|
class LayoutBlockData {
|
|
260
259
|
constructor(list) {
|
|
261
260
|
this.updatedBounds = new core.Bounds();
|
|
@@ -269,13 +268,7 @@ class LayoutBlockData {
|
|
|
269
268
|
this.beforeBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
270
269
|
}
|
|
271
270
|
setAfter() {
|
|
272
|
-
|
|
273
|
-
if (list.some(leaf => leaf.noBounds)) {
|
|
274
|
-
this.afterBounds.set(bigBounds);
|
|
275
|
-
}
|
|
276
|
-
else {
|
|
277
|
-
this.afterBounds.setListWithFn(list, worldBounds);
|
|
278
|
-
}
|
|
271
|
+
this.afterBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
279
272
|
this.updatedBounds.setList([this.beforeBounds, this.afterBounds]);
|
|
280
273
|
}
|
|
281
274
|
merge(data) {
|
|
@@ -477,6 +470,22 @@ class Renderer {
|
|
|
477
470
|
requestLayout() {
|
|
478
471
|
this.target.emit(core.LayoutEvent.REQUEST);
|
|
479
472
|
}
|
|
473
|
+
checkRender() {
|
|
474
|
+
if (this.running) {
|
|
475
|
+
const { target } = this;
|
|
476
|
+
if (target.isApp) {
|
|
477
|
+
target.emit(core.RenderEvent.CHILD_START, target);
|
|
478
|
+
target.children.forEach(leafer => {
|
|
479
|
+
leafer.renderer.FPS = this.FPS;
|
|
480
|
+
leafer.renderer.checkRender();
|
|
481
|
+
});
|
|
482
|
+
target.emit(core.RenderEvent.CHILD_END, target);
|
|
483
|
+
}
|
|
484
|
+
if (this.changed && this.canvas.view)
|
|
485
|
+
this.render();
|
|
486
|
+
this.target.emit(core.RenderEvent.NEXT);
|
|
487
|
+
}
|
|
488
|
+
}
|
|
480
489
|
render(callback) {
|
|
481
490
|
if (!(this.running && this.canvas.view))
|
|
482
491
|
return this.update();
|
|
@@ -485,8 +494,6 @@ class Renderer {
|
|
|
485
494
|
this.totalBounds = new core.Bounds();
|
|
486
495
|
debug$1.log(target.innerName, '--->');
|
|
487
496
|
try {
|
|
488
|
-
if (!target.isApp)
|
|
489
|
-
target.app.emit(core.RenderEvent.CHILD_START, target);
|
|
490
497
|
this.emitRender(core.RenderEvent.START);
|
|
491
498
|
this.renderOnce(callback);
|
|
492
499
|
this.emitRender(core.RenderEvent.END, this.totalBounds);
|
|
@@ -554,20 +561,12 @@ class Renderer {
|
|
|
554
561
|
}
|
|
555
562
|
clipRender(block) {
|
|
556
563
|
const t = core.Run.start('PartRender');
|
|
557
|
-
const { canvas } = this;
|
|
558
|
-
const bounds = block.getIntersect(canvas.bounds);
|
|
559
|
-
const includes = block.includes(this.target.__world);
|
|
560
|
-
const realBounds = new core.Bounds(bounds);
|
|
564
|
+
const { canvas } = this, bounds = block.getIntersect(canvas.bounds), realBounds = new core.Bounds(bounds);
|
|
561
565
|
canvas.save();
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
bounds.spread(10 + 1 / this.canvas.pixelRatio).ceil();
|
|
567
|
-
canvas.clearWorld(bounds, true);
|
|
568
|
-
canvas.clipWorld(bounds, true);
|
|
569
|
-
}
|
|
570
|
-
this.__render(bounds, includes, realBounds);
|
|
566
|
+
bounds.spread(Renderer.clipSpread).ceil();
|
|
567
|
+
canvas.clearWorld(bounds, true);
|
|
568
|
+
canvas.clipWorld(bounds, true);
|
|
569
|
+
this.__render(bounds, realBounds);
|
|
571
570
|
canvas.restore();
|
|
572
571
|
core.Run.end(t);
|
|
573
572
|
}
|
|
@@ -576,28 +575,22 @@ class Renderer {
|
|
|
576
575
|
const { canvas } = this;
|
|
577
576
|
canvas.save();
|
|
578
577
|
canvas.clear();
|
|
579
|
-
this.__render(canvas.bounds
|
|
578
|
+
this.__render(canvas.bounds);
|
|
580
579
|
canvas.restore();
|
|
581
580
|
core.Run.end(t);
|
|
582
581
|
}
|
|
583
|
-
__render(bounds,
|
|
584
|
-
const
|
|
582
|
+
__render(bounds, realBounds) {
|
|
583
|
+
const { canvas } = this, includes = bounds.includes(this.target.__world), options = includes ? { includes } : { bounds, includes };
|
|
585
584
|
if (this.needFill)
|
|
586
|
-
|
|
585
|
+
canvas.fillWorld(bounds, this.config.fill);
|
|
587
586
|
if (core.Debug.showRepaint)
|
|
588
|
-
|
|
589
|
-
this.target.__render(
|
|
587
|
+
core.Debug.drawRepaint(canvas, bounds);
|
|
588
|
+
this.target.__render(canvas, options);
|
|
590
589
|
this.renderBounds = realBounds = realBounds || bounds;
|
|
591
590
|
this.renderOptions = options;
|
|
592
591
|
this.totalBounds.isEmpty() ? this.totalBounds = realBounds : this.totalBounds.add(realBounds);
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
if (core.Debug.showBoundsView)
|
|
596
|
-
this.renderBoundsView(options);
|
|
597
|
-
this.canvas.updateRender(realBounds);
|
|
598
|
-
}
|
|
599
|
-
renderHitView(_options) { }
|
|
600
|
-
renderBoundsView(_options) { }
|
|
592
|
+
canvas.updateRender(realBounds);
|
|
593
|
+
}
|
|
601
594
|
addBlock(block) {
|
|
602
595
|
if (!this.updateBlocks)
|
|
603
596
|
this.updateBlocks = [];
|
|
@@ -613,17 +606,16 @@ class Renderer {
|
|
|
613
606
|
}
|
|
614
607
|
}
|
|
615
608
|
__requestRender() {
|
|
616
|
-
|
|
609
|
+
const target = this.target;
|
|
610
|
+
if (this.requestTime || !target)
|
|
617
611
|
return;
|
|
612
|
+
if (target.parentApp)
|
|
613
|
+
return target.parentApp.requestRender(false);
|
|
618
614
|
const requestTime = this.requestTime = Date.now();
|
|
619
615
|
core.Platform.requestRender(() => {
|
|
620
616
|
this.FPS = Math.min(60, Math.ceil(1000 / (Date.now() - requestTime)));
|
|
621
617
|
this.requestTime = 0;
|
|
622
|
-
|
|
623
|
-
if (this.changed && this.canvas.view)
|
|
624
|
-
this.render();
|
|
625
|
-
this.target.emit(core.RenderEvent.NEXT);
|
|
626
|
-
}
|
|
618
|
+
this.checkRender();
|
|
627
619
|
});
|
|
628
620
|
}
|
|
629
621
|
__onResize(e) {
|
|
@@ -681,6 +673,7 @@ class Renderer {
|
|
|
681
673
|
}
|
|
682
674
|
}
|
|
683
675
|
}
|
|
676
|
+
Renderer.clipSpread = 10;
|
|
684
677
|
|
|
685
678
|
const { hitRadiusPoint } = core.BoundsHelper;
|
|
686
679
|
class Picker {
|
|
@@ -1200,9 +1193,11 @@ const tempBox = new core.Bounds();
|
|
|
1200
1193
|
const tempPoint = {};
|
|
1201
1194
|
const tempScaleData = {};
|
|
1202
1195
|
function createData(leafPaint, image, paint, box) {
|
|
1203
|
-
const { blendMode, sync } = paint;
|
|
1196
|
+
const { blendMode, changeful, sync } = paint;
|
|
1204
1197
|
if (blendMode)
|
|
1205
1198
|
leafPaint.blendMode = blendMode;
|
|
1199
|
+
if (changeful)
|
|
1200
|
+
leafPaint.changeful = changeful;
|
|
1206
1201
|
if (sync)
|
|
1207
1202
|
leafPaint.sync = sync;
|
|
1208
1203
|
leafPaint.data = getPatternData(paint, box, image);
|
|
@@ -1435,40 +1430,32 @@ function createPattern(ui, paint, pixelRatio) {
|
|
|
1435
1430
|
}
|
|
1436
1431
|
|
|
1437
1432
|
const { abs } = Math;
|
|
1438
|
-
function checkImage(ui, canvas, paint,
|
|
1433
|
+
function checkImage(ui, canvas, paint, allowDraw) {
|
|
1439
1434
|
const { scaleX, scaleY } = core.ImageManager.patternLocked ? ui.__world : ui.__nowWorld;
|
|
1440
|
-
const { pixelRatio } = canvas;
|
|
1441
|
-
if (!
|
|
1435
|
+
const { pixelRatio } = canvas, { data } = paint;
|
|
1436
|
+
if (!data || (paint.patternId === scaleX + '-' + scaleY + '-' + pixelRatio && !draw.Export.running)) {
|
|
1442
1437
|
return false;
|
|
1443
1438
|
}
|
|
1444
1439
|
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;
|
|
1440
|
+
if (allowDraw) {
|
|
1441
|
+
if (data.repeat) {
|
|
1442
|
+
allowDraw = false;
|
|
1456
1443
|
}
|
|
1457
1444
|
else {
|
|
1458
|
-
|
|
1445
|
+
if (!(paint.changeful || core.ResizeEvent.isResizing(ui) || draw.Export.running)) {
|
|
1446
|
+
let { width, height } = data;
|
|
1447
|
+
width *= abs(scaleX) * pixelRatio;
|
|
1448
|
+
height *= abs(scaleY) * pixelRatio;
|
|
1449
|
+
if (data.scaleX) {
|
|
1450
|
+
width *= data.scaleX;
|
|
1451
|
+
height *= data.scaleY;
|
|
1452
|
+
}
|
|
1453
|
+
allowDraw = (width * height > core.Platform.image.maxCacheSize);
|
|
1454
|
+
}
|
|
1459
1455
|
}
|
|
1460
1456
|
}
|
|
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();
|
|
1457
|
+
if (allowDraw) {
|
|
1458
|
+
drawImage(ui, canvas, paint, data);
|
|
1472
1459
|
return true;
|
|
1473
1460
|
}
|
|
1474
1461
|
else {
|
|
@@ -1489,13 +1476,26 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1489
1476
|
}
|
|
1490
1477
|
}
|
|
1491
1478
|
}
|
|
1479
|
+
function drawImage(ui, canvas, paint, data) {
|
|
1480
|
+
canvas.save();
|
|
1481
|
+
ui.windingRule ? canvas.clip(ui.windingRule) : canvas.clip();
|
|
1482
|
+
if (paint.blendMode)
|
|
1483
|
+
canvas.blendMode = paint.blendMode;
|
|
1484
|
+
if (data.opacity)
|
|
1485
|
+
canvas.opacity *= data.opacity;
|
|
1486
|
+
if (data.transform)
|
|
1487
|
+
canvas.transform(data.transform);
|
|
1488
|
+
canvas.drawImage(paint.image.getFull(data.filters), 0, 0, data.width, data.height);
|
|
1489
|
+
canvas.restore();
|
|
1490
|
+
}
|
|
1492
1491
|
|
|
1493
1492
|
function recycleImage(attrName, data) {
|
|
1494
1493
|
const paints = data['_' + attrName];
|
|
1495
1494
|
if (paints instanceof Array) {
|
|
1496
|
-
let image, recycleMap, input, url;
|
|
1495
|
+
let paint, image, recycleMap, input, url;
|
|
1497
1496
|
for (let i = 0, len = paints.length; i < len; i++) {
|
|
1498
|
-
|
|
1497
|
+
paint = paints[i];
|
|
1498
|
+
image = paint.image;
|
|
1499
1499
|
url = image && image.url;
|
|
1500
1500
|
if (url) {
|
|
1501
1501
|
if (!recycleMap)
|
|
@@ -1510,8 +1510,6 @@ function recycleImage(attrName, data) {
|
|
|
1510
1510
|
}
|
|
1511
1511
|
image.unload(paints[i].loadId, !input.some((item) => item.url === url));
|
|
1512
1512
|
}
|
|
1513
|
-
else
|
|
1514
|
-
paints[i].style = null;
|
|
1515
1513
|
}
|
|
1516
1514
|
}
|
|
1517
1515
|
return recycleMap;
|
|
@@ -1690,7 +1688,7 @@ const { toOffsetOutBounds } = core.BoundsHelper;
|
|
|
1690
1688
|
const offsetOutBounds = {};
|
|
1691
1689
|
function innerShadow(ui, current, shape) {
|
|
1692
1690
|
let copyBounds, spreadScale;
|
|
1693
|
-
const { __nowWorld: nowWorld, __layout
|
|
1691
|
+
const { __nowWorld: nowWorld, __layout } = ui;
|
|
1694
1692
|
const { innerShadow } = ui.__;
|
|
1695
1693
|
const { worldCanvas, bounds, shapeBounds, scaleX, scaleY } = shape;
|
|
1696
1694
|
const other = current.getSameCanvas();
|