@leafer-ui/miniapp 1.0.0-rc.6 → 1.0.0-rc.8
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.esm.js +174 -100
- package/dist/miniapp.esm.min.js +1 -1
- package/dist/miniapp.module.js +1724 -1117
- package/dist/miniapp.module.min.js +1 -1
- package/package.json +6 -6
package/dist/miniapp.esm.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { LeafList, DataHelper, RenderEvent, ChildEvent, WatchEvent, PropertyEvent, LeafHelper, BranchHelper, Bounds, LeafBoundsHelper,
|
|
1
|
+
import { LeafList, DataHelper, RenderEvent, ChildEvent, WatchEvent, PropertyEvent, LeafHelper, BranchHelper, Bounds, LeafBoundsHelper, Debug, LeafLevelList, LayoutEvent, Run, ImageManager, Platform, AnimateEvent, ResizeEvent, BoundsHelper, Creator, LeaferCanvasBase, canvasPatch, canvasSizeAttrs, InteractionHelper, InteractionBase, LeaferImage, FileHelper, MatrixHelper, ImageEvent, PointHelper, Direction4, TaskProcessor } from '@leafer/core';
|
|
2
2
|
export * from '@leafer/core';
|
|
3
3
|
export { LeaferImage } from '@leafer/core';
|
|
4
|
-
import { ColorConvert as ColorConvert$1, ImageManager as ImageManager$1, Paint, Effect, TextConvert as TextConvert$1, Export as Export$
|
|
4
|
+
import { ColorConvert as ColorConvert$1, ImageManager as ImageManager$1, Paint, Effect, TextConvert as TextConvert$1, Export as Export$2, Platform as Platform$1 } from '@leafer-ui/core';
|
|
5
5
|
export * from '@leafer-ui/core';
|
|
6
6
|
|
|
7
7
|
class Watcher {
|
|
@@ -10,7 +10,7 @@ class Watcher {
|
|
|
10
10
|
if (this.hasRemove) {
|
|
11
11
|
const updatedList = new LeafList();
|
|
12
12
|
this.__updatedList.list.forEach(item => { if (item.leafer)
|
|
13
|
-
updatedList.
|
|
13
|
+
updatedList.add(item); });
|
|
14
14
|
return updatedList;
|
|
15
15
|
}
|
|
16
16
|
else {
|
|
@@ -45,7 +45,7 @@ class Watcher {
|
|
|
45
45
|
this.target.emit(RenderEvent.REQUEST);
|
|
46
46
|
}
|
|
47
47
|
__onAttrChange(event) {
|
|
48
|
-
this.__updatedList.
|
|
48
|
+
this.__updatedList.add(event.target);
|
|
49
49
|
this.update();
|
|
50
50
|
}
|
|
51
51
|
__onChildEvent(event) {
|
|
@@ -55,12 +55,12 @@ class Watcher {
|
|
|
55
55
|
}
|
|
56
56
|
else {
|
|
57
57
|
this.hasRemove = true;
|
|
58
|
-
this.__updatedList.
|
|
58
|
+
this.__updatedList.add(event.parent);
|
|
59
59
|
}
|
|
60
60
|
this.update();
|
|
61
61
|
}
|
|
62
62
|
__pushChild(child) {
|
|
63
|
-
this.__updatedList.
|
|
63
|
+
this.__updatedList.add(child);
|
|
64
64
|
if (child.isBranch)
|
|
65
65
|
this.__loopChildren(child);
|
|
66
66
|
}
|
|
@@ -99,7 +99,7 @@ class Watcher {
|
|
|
99
99
|
}
|
|
100
100
|
}
|
|
101
101
|
|
|
102
|
-
const {
|
|
102
|
+
const { updateAllMatrix: updateAllMatrix$1, updateBounds: updateOneBounds, updateAllWorldOpacity } = LeafHelper;
|
|
103
103
|
const { pushAllChildBranch, pushAllParent } = BranchHelper;
|
|
104
104
|
function updateMatrix(updateList, levelList) {
|
|
105
105
|
let layout;
|
|
@@ -107,14 +107,14 @@ function updateMatrix(updateList, levelList) {
|
|
|
107
107
|
layout = leaf.__layout;
|
|
108
108
|
if (levelList.without(leaf) && !layout.proxyZoom) {
|
|
109
109
|
if (layout.matrixChanged) {
|
|
110
|
-
|
|
111
|
-
levelList.
|
|
110
|
+
updateAllMatrix$1(leaf, true);
|
|
111
|
+
levelList.add(leaf);
|
|
112
112
|
if (leaf.isBranch)
|
|
113
113
|
pushAllChildBranch(leaf, levelList);
|
|
114
114
|
pushAllParent(leaf, levelList);
|
|
115
115
|
}
|
|
116
116
|
else if (layout.boundsChanged) {
|
|
117
|
-
levelList.
|
|
117
|
+
levelList.add(leaf);
|
|
118
118
|
if (leaf.isBranch)
|
|
119
119
|
leaf.__tempNumber = 0;
|
|
120
120
|
pushAllParent(leaf, levelList);
|
|
@@ -123,20 +123,21 @@ function updateMatrix(updateList, levelList) {
|
|
|
123
123
|
});
|
|
124
124
|
}
|
|
125
125
|
function updateBounds(boundsList) {
|
|
126
|
-
let
|
|
126
|
+
let list, branch, children;
|
|
127
127
|
boundsList.sort(true);
|
|
128
128
|
boundsList.levels.forEach(level => {
|
|
129
|
-
|
|
130
|
-
for (let i = 0, len =
|
|
131
|
-
branch =
|
|
129
|
+
list = boundsList.levelMap[level];
|
|
130
|
+
for (let i = 0, len = list.length; i < len; i++) {
|
|
131
|
+
branch = list[i];
|
|
132
132
|
if (branch.isBranch && branch.__tempNumber) {
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
133
|
+
children = branch.children;
|
|
134
|
+
for (let j = 0, jLen = children.length; j < jLen; j++) {
|
|
135
|
+
if (!children[j].isBranch) {
|
|
136
|
+
updateOneBounds(children[j]);
|
|
136
137
|
}
|
|
137
138
|
}
|
|
138
139
|
}
|
|
139
|
-
branch
|
|
140
|
+
updateOneBounds(branch);
|
|
140
141
|
}
|
|
141
142
|
});
|
|
142
143
|
}
|
|
@@ -149,7 +150,7 @@ function updateChange(updateList) {
|
|
|
149
150
|
}
|
|
150
151
|
|
|
151
152
|
const { worldBounds } = LeafBoundsHelper;
|
|
152
|
-
const {
|
|
153
|
+
const bigBounds = { x: 0, y: 0, width: 100000, height: 100000 };
|
|
153
154
|
class LayoutBlockData {
|
|
154
155
|
constructor(list) {
|
|
155
156
|
this.updatedBounds = new Bounds();
|
|
@@ -160,14 +161,20 @@ class LayoutBlockData {
|
|
|
160
161
|
this.updatedList = list;
|
|
161
162
|
}
|
|
162
163
|
setBefore() {
|
|
163
|
-
|
|
164
|
+
this.beforeBounds.setListWithFn(this.updatedList.list, worldBounds);
|
|
164
165
|
}
|
|
165
166
|
setAfter() {
|
|
166
|
-
|
|
167
|
-
|
|
167
|
+
const { list } = this.updatedList;
|
|
168
|
+
if (list.some(leaf => leaf.noBounds)) {
|
|
169
|
+
this.afterBounds.set(bigBounds);
|
|
170
|
+
}
|
|
171
|
+
else {
|
|
172
|
+
this.afterBounds.setListWithFn(list, worldBounds);
|
|
173
|
+
}
|
|
174
|
+
this.updatedBounds.setList([this.beforeBounds, this.afterBounds]);
|
|
168
175
|
}
|
|
169
176
|
merge(data) {
|
|
170
|
-
this.updatedList.
|
|
177
|
+
this.updatedList.addList(data.updatedList.list);
|
|
171
178
|
this.beforeBounds.add(data.beforeBounds);
|
|
172
179
|
this.afterBounds.add(data.afterBounds);
|
|
173
180
|
this.updatedBounds.add(data.updatedBounds);
|
|
@@ -177,8 +184,7 @@ class LayoutBlockData {
|
|
|
177
184
|
}
|
|
178
185
|
}
|
|
179
186
|
|
|
180
|
-
const {
|
|
181
|
-
const { pushAllBranchStack, updateWorldBoundsByBranchStack } = BranchHelper;
|
|
187
|
+
const { updateAllMatrix, updateAllChange } = LeafHelper;
|
|
182
188
|
const debug$1 = Debug.get('Layouter');
|
|
183
189
|
class Layouter {
|
|
184
190
|
constructor(target, userConfig) {
|
|
@@ -255,12 +261,15 @@ class Layouter {
|
|
|
255
261
|
const { target, __updatedList: updateList } = this;
|
|
256
262
|
const { BEFORE, LAYOUT, AFTER } = LayoutEvent;
|
|
257
263
|
const blocks = this.getBlocks(updateList);
|
|
258
|
-
blocks.forEach(item =>
|
|
264
|
+
blocks.forEach(item => item.setBefore());
|
|
259
265
|
target.emitEvent(new LayoutEvent(BEFORE, blocks, this.times));
|
|
266
|
+
this.extraBlock = null;
|
|
260
267
|
updateList.sort();
|
|
261
268
|
updateMatrix(updateList, this.__levelList);
|
|
262
269
|
updateBounds(this.__levelList);
|
|
263
270
|
updateChange(updateList);
|
|
271
|
+
if (this.extraBlock)
|
|
272
|
+
blocks.push(this.extraBlock);
|
|
264
273
|
blocks.forEach(item => item.setAfter());
|
|
265
274
|
target.emitEvent(new LayoutEvent(LAYOUT, blocks, this.times));
|
|
266
275
|
target.emitEvent(new LayoutEvent(AFTER, blocks, this.times));
|
|
@@ -283,17 +292,20 @@ class Layouter {
|
|
|
283
292
|
Run.end(t);
|
|
284
293
|
}
|
|
285
294
|
static fullLayout(target) {
|
|
286
|
-
|
|
295
|
+
updateAllMatrix(target, true);
|
|
287
296
|
if (target.isBranch) {
|
|
288
|
-
|
|
289
|
-
pushAllBranchStack(target, branchStack);
|
|
290
|
-
updateWorldBoundsByBranchStack(branchStack);
|
|
297
|
+
BranchHelper.updateBounds(target);
|
|
291
298
|
}
|
|
292
299
|
else {
|
|
293
|
-
|
|
300
|
+
LeafHelper.updateBounds(target);
|
|
294
301
|
}
|
|
295
302
|
updateAllChange(target);
|
|
296
303
|
}
|
|
304
|
+
addExtra(leaf) {
|
|
305
|
+
const block = this.extraBlock || (this.extraBlock = new LayoutBlockData([]));
|
|
306
|
+
block.updatedList.add(leaf);
|
|
307
|
+
block.beforeBounds.add(leaf.__world);
|
|
308
|
+
}
|
|
297
309
|
createBlock(data) {
|
|
298
310
|
return new LayoutBlockData(data);
|
|
299
311
|
}
|
|
@@ -321,8 +333,7 @@ class Layouter {
|
|
|
321
333
|
if (this.target) {
|
|
322
334
|
this.stop();
|
|
323
335
|
this.__removeListenEvents();
|
|
324
|
-
this.target = null;
|
|
325
|
-
this.config = null;
|
|
336
|
+
this.target = this.config = null;
|
|
326
337
|
}
|
|
327
338
|
}
|
|
328
339
|
}
|
|
@@ -433,7 +444,7 @@ class Renderer {
|
|
|
433
444
|
const { canvas } = this;
|
|
434
445
|
const bounds = block.getIntersect(canvas.bounds);
|
|
435
446
|
const includes = block.includes(this.target.__world);
|
|
436
|
-
const realBounds = new Bounds(
|
|
447
|
+
const realBounds = new Bounds(bounds);
|
|
437
448
|
canvas.save();
|
|
438
449
|
if (includes && !Debug.showRepaint) {
|
|
439
450
|
canvas.clear();
|
|
@@ -483,7 +494,7 @@ class Renderer {
|
|
|
483
494
|
const { updateBlocks: list } = this;
|
|
484
495
|
if (list) {
|
|
485
496
|
const bounds = new Bounds();
|
|
486
|
-
bounds.
|
|
497
|
+
bounds.setList(list);
|
|
487
498
|
list.length = 0;
|
|
488
499
|
list.push(bounds);
|
|
489
500
|
}
|
|
@@ -523,7 +534,7 @@ class Renderer {
|
|
|
523
534
|
empty = (!leaf.__world.width || !leaf.__world.height);
|
|
524
535
|
if (empty) {
|
|
525
536
|
if (!leaf.isLeafer)
|
|
526
|
-
debug.
|
|
537
|
+
debug.tip(leaf.innerName, ': empty');
|
|
527
538
|
empty = (!leaf.isBranch || leaf.isBranchLeaf);
|
|
528
539
|
}
|
|
529
540
|
return empty;
|
|
@@ -557,6 +568,14 @@ class Renderer {
|
|
|
557
568
|
}
|
|
558
569
|
}
|
|
559
570
|
|
|
571
|
+
var AnswerType;
|
|
572
|
+
(function (AnswerType) {
|
|
573
|
+
AnswerType[AnswerType["No"] = 0] = "No";
|
|
574
|
+
AnswerType[AnswerType["Yes"] = 1] = "Yes";
|
|
575
|
+
AnswerType[AnswerType["NoAndSkip"] = 2] = "NoAndSkip";
|
|
576
|
+
AnswerType[AnswerType["YesAndSkip"] = 3] = "YesAndSkip";
|
|
577
|
+
})(AnswerType || (AnswerType = {}));
|
|
578
|
+
|
|
560
579
|
const { hitRadiusPoint } = BoundsHelper;
|
|
561
580
|
class Pather {
|
|
562
581
|
constructor(target, selector) {
|
|
@@ -601,10 +620,10 @@ class Pather {
|
|
|
601
620
|
getPath(leaf) {
|
|
602
621
|
const path = new LeafList();
|
|
603
622
|
while (leaf) {
|
|
604
|
-
path.
|
|
623
|
+
path.add(leaf);
|
|
605
624
|
leaf = leaf.parent;
|
|
606
625
|
}
|
|
607
|
-
path.
|
|
626
|
+
path.add(this.target);
|
|
608
627
|
return path;
|
|
609
628
|
}
|
|
610
629
|
getHitablePath(leaf) {
|
|
@@ -614,7 +633,7 @@ class Pather {
|
|
|
614
633
|
item = path.list[i];
|
|
615
634
|
if (!item.__.hittable)
|
|
616
635
|
break;
|
|
617
|
-
hittablePath.
|
|
636
|
+
hittablePath.addAt(item, 0);
|
|
618
637
|
if (!item.__.hitChildren)
|
|
619
638
|
break;
|
|
620
639
|
}
|
|
@@ -633,7 +652,7 @@ class Pather {
|
|
|
633
652
|
leaf = path.list[j];
|
|
634
653
|
if (nextPath && nextPath.has(leaf))
|
|
635
654
|
break;
|
|
636
|
-
throughPath.
|
|
655
|
+
throughPath.add(leaf);
|
|
637
656
|
}
|
|
638
657
|
}
|
|
639
658
|
return throughPath;
|
|
@@ -675,14 +694,15 @@ class Pather {
|
|
|
675
694
|
}
|
|
676
695
|
}
|
|
677
696
|
|
|
697
|
+
const { Yes, NoAndSkip, YesAndSkip } = AnswerType;
|
|
678
698
|
class Selector {
|
|
679
699
|
constructor(target, userConfig) {
|
|
680
700
|
this.config = {};
|
|
681
701
|
this.innerIdMap = {};
|
|
682
702
|
this.idMap = {};
|
|
683
703
|
this.methods = {
|
|
684
|
-
id: (leaf, name) => leaf.id === name ? this.idMap[name] = leaf : 0,
|
|
685
|
-
innerId: (leaf, innerId) => leaf.innerId === innerId ? this.innerIdMap[innerId] = leaf : 0,
|
|
704
|
+
id: (leaf, name) => leaf.id === name ? (this.idMap[name] = leaf, 1) : 0,
|
|
705
|
+
innerId: (leaf, innerId) => leaf.innerId === innerId ? (this.innerIdMap[innerId] = leaf, 1) : 0,
|
|
686
706
|
className: (leaf, name) => leaf.className === name ? 1 : 0,
|
|
687
707
|
tag: (leaf, name) => leaf.__tag === name ? 1 : 0
|
|
688
708
|
};
|
|
@@ -692,11 +712,6 @@ class Selector {
|
|
|
692
712
|
this.pather = new Pather(target, this);
|
|
693
713
|
this.__listenEvents();
|
|
694
714
|
}
|
|
695
|
-
getByPoint(hitPoint, hitRadius, options) {
|
|
696
|
-
if (Platform.name === 'node')
|
|
697
|
-
this.target.emit(LayoutEvent.CHECK_UPDATE);
|
|
698
|
-
return this.pather.getByPoint(hitPoint, hitRadius, options);
|
|
699
|
-
}
|
|
700
715
|
getBy(condition, branch, one, options) {
|
|
701
716
|
switch (typeof condition) {
|
|
702
717
|
case 'number':
|
|
@@ -716,6 +731,11 @@ class Selector {
|
|
|
716
731
|
return this.getByMethod(condition, branch, one, options);
|
|
717
732
|
}
|
|
718
733
|
}
|
|
734
|
+
getByPoint(hitPoint, hitRadius, options) {
|
|
735
|
+
if (Platform.name === 'node')
|
|
736
|
+
this.target.emit(LayoutEvent.CHECK_UPDATE);
|
|
737
|
+
return this.pather.getByPoint(hitPoint, hitRadius, options);
|
|
738
|
+
}
|
|
719
739
|
getByInnerId(innerId, branch) {
|
|
720
740
|
const cache = this.innerIdMap[innerId];
|
|
721
741
|
if (cache)
|
|
@@ -742,10 +762,11 @@ class Selector {
|
|
|
742
762
|
return list || this.findLeaf;
|
|
743
763
|
}
|
|
744
764
|
eachFind(children, method, list, options) {
|
|
745
|
-
let child;
|
|
765
|
+
let child, result;
|
|
746
766
|
for (let i = 0, len = children.length; i < len; i++) {
|
|
747
767
|
child = children[i];
|
|
748
|
-
|
|
768
|
+
result = method(child, options);
|
|
769
|
+
if (result === Yes || result === YesAndSkip) {
|
|
749
770
|
if (list) {
|
|
750
771
|
list.push(child);
|
|
751
772
|
}
|
|
@@ -754,7 +775,7 @@ class Selector {
|
|
|
754
775
|
return;
|
|
755
776
|
}
|
|
756
777
|
}
|
|
757
|
-
if (child.isBranch)
|
|
778
|
+
if (child.isBranch && result < NoAndSkip)
|
|
758
779
|
this.eachFind(child.children, method, list, options);
|
|
759
780
|
}
|
|
760
781
|
}
|
|
@@ -1119,9 +1140,8 @@ function useCanvas(_canvasType, app) {
|
|
|
1119
1140
|
Platform.name = 'miniapp';
|
|
1120
1141
|
Platform.requestRender = function (render) { Platform.canvas.view.requestAnimationFrame(render); };
|
|
1121
1142
|
Platform.devicePixelRatio = wx.getSystemInfoSync().pixelRatio;
|
|
1122
|
-
Platform.realtimeLayout = true;
|
|
1123
1143
|
|
|
1124
|
-
const { get: get$4, rotateOfOuter: rotateOfOuter$2, translate: translate$1, scaleOfOuter: scaleOfOuter$2, scale: scaleHelper
|
|
1144
|
+
const { get: get$4, rotateOfOuter: rotateOfOuter$2, translate: translate$1, scaleOfOuter: scaleOfOuter$2, scale: scaleHelper, rotate } = MatrixHelper;
|
|
1125
1145
|
function fillOrFitMode(data, mode, box, width, height, rotation) {
|
|
1126
1146
|
const transform = get$4();
|
|
1127
1147
|
const swap = rotation && rotation !== 180;
|
|
@@ -1131,7 +1151,7 @@ function fillOrFitMode(data, mode, box, width, height, rotation) {
|
|
|
1131
1151
|
const x = box.x + (box.width - width * scale) / 2;
|
|
1132
1152
|
const y = box.y + (box.height - height * scale) / 2;
|
|
1133
1153
|
translate$1(transform, x, y);
|
|
1134
|
-
scaleHelper
|
|
1154
|
+
scaleHelper(transform, scale);
|
|
1135
1155
|
if (rotation)
|
|
1136
1156
|
rotateOfOuter$2(transform, { x: box.x + box.width / 2, y: box.y + box.height / 2 }, rotation);
|
|
1137
1157
|
data.scaleX = data.scaleY = scale;
|
|
@@ -1143,7 +1163,7 @@ function clipMode(data, box, offset, scale, rotation) {
|
|
|
1143
1163
|
if (offset)
|
|
1144
1164
|
translate$1(transform, offset.x, offset.y);
|
|
1145
1165
|
if (scale) {
|
|
1146
|
-
typeof scale === 'number' ? scaleHelper
|
|
1166
|
+
typeof scale === 'number' ? scaleHelper(transform, scale) : scaleHelper(transform, scale.x, scale.y);
|
|
1147
1167
|
data.scaleX = transform.a;
|
|
1148
1168
|
data.scaleY = transform.d;
|
|
1149
1169
|
}
|
|
@@ -1178,7 +1198,7 @@ function repeatMode(data, box, width, height, scale, rotation) {
|
|
|
1178
1198
|
const { get: get$3, translate } = MatrixHelper;
|
|
1179
1199
|
function createData(leafPaint, image, paint, box) {
|
|
1180
1200
|
let { width, height } = image;
|
|
1181
|
-
const { opacity, mode, offset, scale, rotation, blendMode } = paint;
|
|
1201
|
+
const { opacity, mode, offset, scale, rotation, blendMode, repeat } = paint;
|
|
1182
1202
|
const sameBox = box.width === width && box.height === height;
|
|
1183
1203
|
if (blendMode)
|
|
1184
1204
|
leafPaint.blendMode = blendMode;
|
|
@@ -1199,6 +1219,8 @@ function createData(leafPaint, image, paint, box) {
|
|
|
1199
1219
|
case 'repeat':
|
|
1200
1220
|
if (!sameBox || scale || rotation)
|
|
1201
1221
|
repeatMode(data, box, width, height, scale, rotation);
|
|
1222
|
+
if (!repeat)
|
|
1223
|
+
data.repeat = 'repeat';
|
|
1202
1224
|
break;
|
|
1203
1225
|
case 'fit':
|
|
1204
1226
|
case 'cover':
|
|
@@ -1210,6 +1232,8 @@ function createData(leafPaint, image, paint, box) {
|
|
|
1210
1232
|
data.height = height;
|
|
1211
1233
|
if (opacity)
|
|
1212
1234
|
data.opacity = opacity;
|
|
1235
|
+
if (repeat)
|
|
1236
|
+
data.repeat = typeof repeat === 'string' ? (repeat === 'x' ? 'repeat-x' : 'repeat-y') : 'repeat';
|
|
1213
1237
|
}
|
|
1214
1238
|
|
|
1215
1239
|
function image(ui, attrName, attrValue, box, firstUse) {
|
|
@@ -1257,6 +1281,10 @@ function hasNaturalSize(ui, attrName, image) {
|
|
|
1257
1281
|
d.__naturalHeight = image.height;
|
|
1258
1282
|
if (!d.__getInput('width') || !d.__getInput('height')) {
|
|
1259
1283
|
ui.forceUpdate('width');
|
|
1284
|
+
if (ui.__proxyData) {
|
|
1285
|
+
ui.setProxyAttr('width', ui.__.width);
|
|
1286
|
+
ui.setProxyAttr('height', ui.__.height);
|
|
1287
|
+
}
|
|
1260
1288
|
return false;
|
|
1261
1289
|
}
|
|
1262
1290
|
}
|
|
@@ -1299,22 +1327,21 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
1299
1327
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
1300
1328
|
};
|
|
1301
1329
|
|
|
1302
|
-
const
|
|
1330
|
+
const Export$1 = {};
|
|
1331
|
+
|
|
1332
|
+
const { get: get$2, scale, copy: copy$1 } = MatrixHelper;
|
|
1303
1333
|
function createPattern(ui, paint, pixelRatio) {
|
|
1304
1334
|
let { scaleX, scaleY } = ui.__world;
|
|
1305
1335
|
const id = scaleX + '-' + scaleY;
|
|
1306
1336
|
if (paint.patternId !== id && !ui.destroyed) {
|
|
1307
|
-
paint.patternId = id;
|
|
1308
1337
|
scaleX = Math.abs(scaleX);
|
|
1309
1338
|
scaleY = Math.abs(scaleY);
|
|
1310
1339
|
const { image, data } = paint;
|
|
1311
|
-
|
|
1312
|
-
const maxHeight = image.isSVG ? 4096 : Math.min(image.height, 4096);
|
|
1313
|
-
let scale, matrix, { width, height, scaleX: sx, scaleY: sy, opacity, transform, mode } = data;
|
|
1340
|
+
let imageScale, imageMatrix, { width, height, scaleX: sx, scaleY: sy, opacity, transform, repeat } = data;
|
|
1314
1341
|
if (sx) {
|
|
1315
|
-
|
|
1316
|
-
copy$1(
|
|
1317
|
-
|
|
1342
|
+
imageMatrix = get$2();
|
|
1343
|
+
copy$1(imageMatrix, transform);
|
|
1344
|
+
scale(imageMatrix, 1 / sx, 1 / sy);
|
|
1318
1345
|
scaleX *= sx;
|
|
1319
1346
|
scaleY *= sy;
|
|
1320
1347
|
}
|
|
@@ -1322,38 +1349,49 @@ function createPattern(ui, paint, pixelRatio) {
|
|
|
1322
1349
|
scaleY *= pixelRatio;
|
|
1323
1350
|
width *= scaleX;
|
|
1324
1351
|
height *= scaleY;
|
|
1325
|
-
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
|
|
1330
|
-
|
|
1331
|
-
|
|
1332
|
-
|
|
1352
|
+
const size = width * height;
|
|
1353
|
+
if (!repeat) {
|
|
1354
|
+
if (size > Platform.image.maxCacheSize)
|
|
1355
|
+
return false;
|
|
1356
|
+
}
|
|
1357
|
+
let maxSize = Platform.image.maxPatternSize;
|
|
1358
|
+
if (!image.isSVG) {
|
|
1359
|
+
const imageSize = image.width * image.height;
|
|
1360
|
+
if (maxSize > imageSize)
|
|
1361
|
+
maxSize = imageSize;
|
|
1362
|
+
}
|
|
1363
|
+
if (size > maxSize)
|
|
1364
|
+
imageScale = Math.sqrt(size / maxSize);
|
|
1365
|
+
if (imageScale) {
|
|
1366
|
+
scaleX /= imageScale;
|
|
1367
|
+
scaleY /= imageScale;
|
|
1368
|
+
width /= imageScale;
|
|
1369
|
+
height /= imageScale;
|
|
1333
1370
|
}
|
|
1334
1371
|
if (sx) {
|
|
1335
1372
|
scaleX /= sx;
|
|
1336
1373
|
scaleY /= sy;
|
|
1337
1374
|
}
|
|
1338
1375
|
if (transform || scaleX !== 1 || scaleY !== 1) {
|
|
1339
|
-
if (!
|
|
1340
|
-
|
|
1376
|
+
if (!imageMatrix) {
|
|
1377
|
+
imageMatrix = get$2();
|
|
1341
1378
|
if (transform)
|
|
1342
|
-
copy$1(
|
|
1379
|
+
copy$1(imageMatrix, transform);
|
|
1343
1380
|
}
|
|
1344
|
-
|
|
1381
|
+
scale(imageMatrix, 1 / scaleX, 1 / scaleY);
|
|
1345
1382
|
}
|
|
1346
|
-
const
|
|
1383
|
+
const pattern = Platform.canvas.createPattern(image.getCanvas(width < 1 ? 1 : width, height < 1 ? 1 : height, opacity), repeat || (Platform.origin.noRepeat || 'no-repeat'));
|
|
1347
1384
|
try {
|
|
1348
1385
|
if (paint.transform)
|
|
1349
1386
|
paint.transform = null;
|
|
1350
|
-
if (
|
|
1351
|
-
|
|
1387
|
+
if (imageMatrix)
|
|
1388
|
+
pattern.setTransform ? pattern.setTransform(imageMatrix) : paint.transform = imageMatrix;
|
|
1352
1389
|
}
|
|
1353
1390
|
catch (_a) {
|
|
1354
|
-
paint.transform =
|
|
1391
|
+
paint.transform = imageMatrix;
|
|
1355
1392
|
}
|
|
1356
|
-
paint.style =
|
|
1393
|
+
paint.style = pattern;
|
|
1394
|
+
paint.patternId = id;
|
|
1357
1395
|
return true;
|
|
1358
1396
|
}
|
|
1359
1397
|
else {
|
|
@@ -1361,18 +1399,24 @@ function createPattern(ui, paint, pixelRatio) {
|
|
|
1361
1399
|
}
|
|
1362
1400
|
}
|
|
1363
1401
|
|
|
1402
|
+
const { abs } = Math;
|
|
1364
1403
|
function checkImage(ui, canvas, paint, allowPaint) {
|
|
1365
1404
|
const { scaleX, scaleY } = ui.__world;
|
|
1366
1405
|
if (!paint.data || paint.patternId === scaleX + '-' + scaleY) {
|
|
1367
1406
|
return false;
|
|
1368
1407
|
}
|
|
1369
1408
|
else {
|
|
1409
|
+
const { data } = paint;
|
|
1370
1410
|
if (allowPaint) {
|
|
1371
|
-
if (
|
|
1372
|
-
let { width, height } =
|
|
1373
|
-
width *= scaleX * canvas.pixelRatio;
|
|
1374
|
-
height *= scaleY * canvas.pixelRatio;
|
|
1375
|
-
|
|
1411
|
+
if (!data.repeat) {
|
|
1412
|
+
let { width, height } = data;
|
|
1413
|
+
width *= abs(scaleX) * canvas.pixelRatio;
|
|
1414
|
+
height *= abs(scaleY) * canvas.pixelRatio;
|
|
1415
|
+
if (data.scaleX) {
|
|
1416
|
+
width *= data.scaleX;
|
|
1417
|
+
height *= data.scaleY;
|
|
1418
|
+
}
|
|
1419
|
+
allowPaint = width * height > Platform.image.maxCacheSize;
|
|
1376
1420
|
}
|
|
1377
1421
|
else {
|
|
1378
1422
|
allowPaint = false;
|
|
@@ -1381,7 +1425,6 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1381
1425
|
if (allowPaint) {
|
|
1382
1426
|
canvas.save();
|
|
1383
1427
|
canvas.clip();
|
|
1384
|
-
const { data } = paint;
|
|
1385
1428
|
if (paint.blendMode)
|
|
1386
1429
|
canvas.blendMode = paint.blendMode;
|
|
1387
1430
|
if (data.opacity)
|
|
@@ -1393,7 +1436,7 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1393
1436
|
return true;
|
|
1394
1437
|
}
|
|
1395
1438
|
else {
|
|
1396
|
-
if (!paint.style) {
|
|
1439
|
+
if (!paint.style || Export$1.running) {
|
|
1397
1440
|
createPattern(ui, paint, canvas.pixelRatio);
|
|
1398
1441
|
}
|
|
1399
1442
|
else {
|
|
@@ -1412,7 +1455,7 @@ function checkImage(ui, canvas, paint, allowPaint) {
|
|
|
1412
1455
|
}
|
|
1413
1456
|
|
|
1414
1457
|
function recycleImage(attrName, data) {
|
|
1415
|
-
const paints =
|
|
1458
|
+
const paints = data['_' + attrName];
|
|
1416
1459
|
if (paints instanceof Array) {
|
|
1417
1460
|
let image, recycleMap, input, url;
|
|
1418
1461
|
for (let i = 0, len = paints.length; i < len; i++) {
|
|
@@ -1516,7 +1559,7 @@ function drawAlignStroke(align, stroke, isStrokes, ui, canvas, renderOptions) {
|
|
|
1516
1559
|
out.blendMode = align === 'outside' ? 'destination-out' : 'destination-in';
|
|
1517
1560
|
fillText(ui, out);
|
|
1518
1561
|
out.blendMode = 'normal';
|
|
1519
|
-
if (ui.
|
|
1562
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1520
1563
|
canvas.copyWorldByReset(out);
|
|
1521
1564
|
}
|
|
1522
1565
|
else {
|
|
@@ -1589,7 +1632,7 @@ function stroke(stroke, ui, canvas, renderOptions) {
|
|
|
1589
1632
|
out.stroke();
|
|
1590
1633
|
options.windingRule ? out.clip(options.windingRule) : out.clip();
|
|
1591
1634
|
out.clearWorld(ui.__layout.renderBounds);
|
|
1592
|
-
if (ui.
|
|
1635
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1593
1636
|
canvas.copyWorldByReset(out);
|
|
1594
1637
|
}
|
|
1595
1638
|
else {
|
|
@@ -1629,7 +1672,7 @@ function strokes(strokes, ui, canvas, renderOptions) {
|
|
|
1629
1672
|
drawStrokesStyle(strokes, false, ui, out);
|
|
1630
1673
|
options.windingRule ? out.clip(options.windingRule) : out.clip();
|
|
1631
1674
|
out.clearWorld(renderBounds);
|
|
1632
|
-
if (ui.
|
|
1675
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1633
1676
|
canvas.copyWorldByReset(out);
|
|
1634
1677
|
}
|
|
1635
1678
|
else {
|
|
@@ -1853,7 +1896,7 @@ function shadow(ui, current, shape, renderOptions) {
|
|
|
1853
1896
|
}
|
|
1854
1897
|
worldCanvas ? other.copyWorld(worldCanvas, __world, __world, 'destination-out') : other.copyWorld(shape.canvas, shapeBounds, bounds, 'destination-out');
|
|
1855
1898
|
}
|
|
1856
|
-
if (ui.
|
|
1899
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1857
1900
|
current.copyWorldByReset(other, copyBounds, __world, item.blendMode);
|
|
1858
1901
|
}
|
|
1859
1902
|
else {
|
|
@@ -1917,7 +1960,7 @@ function innerShadow(ui, current, shape, renderOptions) {
|
|
|
1917
1960
|
copyBounds = bounds;
|
|
1918
1961
|
}
|
|
1919
1962
|
other.fillWorld(copyBounds, item.color, 'source-in');
|
|
1920
|
-
if (ui.
|
|
1963
|
+
if (ui.__worldFlipped || renderOptions.matrix) {
|
|
1921
1964
|
current.copyWorldByReset(other, copyBounds, __world, item.blendMode);
|
|
1922
1965
|
}
|
|
1923
1966
|
else {
|
|
@@ -2365,6 +2408,7 @@ function decorationText(drawData, style) {
|
|
|
2365
2408
|
}
|
|
2366
2409
|
}
|
|
2367
2410
|
|
|
2411
|
+
const { top, right, bottom, left } = Direction4;
|
|
2368
2412
|
const TextConvert = {
|
|
2369
2413
|
getDrawData(content, style) {
|
|
2370
2414
|
if (typeof content !== 'string')
|
|
@@ -2372,16 +2416,15 @@ const TextConvert = {
|
|
|
2372
2416
|
let x = 0, y = 0;
|
|
2373
2417
|
let width = style.__getInput('width') || 0;
|
|
2374
2418
|
let height = style.__getInput('height') || 0;
|
|
2375
|
-
const { textDecoration, __font, padding } = style;
|
|
2419
|
+
const { textDecoration, __font, __padding: padding } = style;
|
|
2376
2420
|
if (padding) {
|
|
2377
|
-
const [top, right, bottom, left] = MathHelper.fourNumber(padding);
|
|
2378
2421
|
if (width) {
|
|
2379
|
-
x = left;
|
|
2380
|
-
width -= (right + left);
|
|
2422
|
+
x = padding[left];
|
|
2423
|
+
width -= (padding[right] + padding[left]);
|
|
2381
2424
|
}
|
|
2382
2425
|
if (height) {
|
|
2383
|
-
y = top;
|
|
2384
|
-
height -= (top + bottom);
|
|
2426
|
+
y = padding[top];
|
|
2427
|
+
height -= (padding[top] + padding[bottom]);
|
|
2385
2428
|
}
|
|
2386
2429
|
}
|
|
2387
2430
|
const drawData = {
|
|
@@ -2391,6 +2434,8 @@ const TextConvert = {
|
|
|
2391
2434
|
font: Platform.canvas.font = __font
|
|
2392
2435
|
};
|
|
2393
2436
|
createRows(drawData, content, style);
|
|
2437
|
+
if (padding)
|
|
2438
|
+
padAutoText(padding, drawData, style, width, height);
|
|
2394
2439
|
layoutText(drawData, style);
|
|
2395
2440
|
layoutChar(drawData, style, width);
|
|
2396
2441
|
if (drawData.overflow)
|
|
@@ -2400,6 +2445,32 @@ const TextConvert = {
|
|
|
2400
2445
|
return drawData;
|
|
2401
2446
|
}
|
|
2402
2447
|
};
|
|
2448
|
+
function padAutoText(padding, drawData, style, width, height) {
|
|
2449
|
+
if (!width) {
|
|
2450
|
+
switch (style.textAlign) {
|
|
2451
|
+
case 'left':
|
|
2452
|
+
offsetText(drawData, 'x', padding[left]);
|
|
2453
|
+
break;
|
|
2454
|
+
case 'right':
|
|
2455
|
+
offsetText(drawData, 'x', -padding[right]);
|
|
2456
|
+
}
|
|
2457
|
+
}
|
|
2458
|
+
if (!height) {
|
|
2459
|
+
switch (style.verticalAlign) {
|
|
2460
|
+
case 'top':
|
|
2461
|
+
offsetText(drawData, 'y', padding[top]);
|
|
2462
|
+
break;
|
|
2463
|
+
case 'bottom':
|
|
2464
|
+
offsetText(drawData, 'y', -padding[bottom]);
|
|
2465
|
+
}
|
|
2466
|
+
}
|
|
2467
|
+
}
|
|
2468
|
+
function offsetText(drawData, attrName, value) {
|
|
2469
|
+
const { bounds, rows } = drawData;
|
|
2470
|
+
bounds[attrName] += value;
|
|
2471
|
+
for (let i = 0; i < rows.length; i++)
|
|
2472
|
+
rows[i][attrName] += value;
|
|
2473
|
+
}
|
|
2403
2474
|
|
|
2404
2475
|
const ColorConvert = {
|
|
2405
2476
|
string(color, opacity) {
|
|
@@ -2415,6 +2486,7 @@ const ColorConvert = {
|
|
|
2415
2486
|
|
|
2416
2487
|
const Export = {
|
|
2417
2488
|
export(leaf, filename, options) {
|
|
2489
|
+
Export.running = true;
|
|
2418
2490
|
return addTask((success) => new Promise((resolve) => {
|
|
2419
2491
|
const { leafer } = leaf;
|
|
2420
2492
|
if (leafer) {
|
|
@@ -2452,6 +2524,7 @@ const Export = {
|
|
|
2452
2524
|
}
|
|
2453
2525
|
success({ data });
|
|
2454
2526
|
resolve();
|
|
2527
|
+
Export.running = false;
|
|
2455
2528
|
if (unreal)
|
|
2456
2529
|
canvas.recycle();
|
|
2457
2530
|
}));
|
|
@@ -2459,6 +2532,7 @@ const Export = {
|
|
|
2459
2532
|
else {
|
|
2460
2533
|
success({ data: false });
|
|
2461
2534
|
resolve();
|
|
2535
|
+
Export.running = false;
|
|
2462
2536
|
}
|
|
2463
2537
|
}));
|
|
2464
2538
|
}
|
|
@@ -2476,7 +2550,7 @@ Object.assign(Paint, UIPaint);
|
|
|
2476
2550
|
Object.assign(Effect, UIEffect);
|
|
2477
2551
|
Object.assign(TextConvert$1, TextConvert);
|
|
2478
2552
|
Object.assign(ColorConvert$1, ColorConvert);
|
|
2479
|
-
Object.assign(Export$
|
|
2553
|
+
Object.assign(Export$2, Export);
|
|
2480
2554
|
|
|
2481
2555
|
try {
|
|
2482
2556
|
useCanvas('wx', wx);
|