@leafer-ui/display 1.0.5 → 1.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leafer-ui/display",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "description": "@leafer-ui/display",
   "author": "Chao (Leafer) Wan",
   "license": "MIT",
@@ -22,14 +22,14 @@
     "leaferjs"
   ],
   "dependencies": {
-    "@leafer/core": "1.0.5",
-    "@leafer-ui/data": "1.0.5",
-    "@leafer-ui/display-module": "1.0.5",
-    "@leafer-ui/decorator": "1.0.5",
-    "@leafer-ui/external": "1.0.5"
+    "@leafer/core": "1.0.7",
+    "@leafer-ui/data": "1.0.7",
+    "@leafer-ui/display-module": "1.0.7",
+    "@leafer-ui/decorator": "1.0.7",
+    "@leafer-ui/external": "1.0.7"
   },
   "devDependencies": {
-    "@leafer/interface": "1.0.5",
-    "@leafer-ui/interface": "1.0.5"
+    "@leafer/interface": "1.0.7",
+    "@leafer-ui/interface": "1.0.7"
   }
 }

package/src/Box.ts

@@ -45,9 +45,7 @@ export class Box extends Group implements IBox {
     @rewrite(rect.__updateRenderSpread)
     public __updateRectRenderSpread(): number { return 0 }
 
-    public __updateRenderSpread(): number {
-        return this.__updateRectRenderSpread() || -1
-    }
+    public __updateRenderSpread(): number { return this.__updateRectRenderSpread() || -1 }
 
 
     @rewrite(rect.__updateBoxBounds)
@@ -78,13 +76,9 @@ export class Box extends Group implements IBox {
 
                 this.__updateNaturalSize()
 
-            } else {
-                this.__updateRectBoxBounds()
-            }
+            } else this.__updateRectBoxBounds()
 
-        } else {
-            this.__updateRectBoxBounds()
-        }
+        } else this.__updateRectBoxBounds()
     }
 
     @rewrite(rect.__updateStrokeBounds)
@@ -99,13 +93,11 @@ export class Box extends Group implements IBox {
             copy(childrenRenderBounds, renderBounds)
             this.__updateRectRenderBounds()
 
-            isOverflow = !includes(renderBounds, childrenRenderBounds) || !this.pathInputed || !this.__.cornerRadius // 路径与圆角直接当溢出处理
-        } else {
-            this.__updateRectRenderBounds()
-        }
+            isOverflow = !includes(renderBounds, childrenRenderBounds)
+            if (isOverflow && this.__.overflow !== 'hide') add(renderBounds, childrenRenderBounds)
+        } else this.__updateRectRenderBounds()
 
-        this.isOverflow !== isOverflow && (this.isOverflow = isOverflow)
-        if (!(this.__.__drawAfterFill = this.__.overflow === 'hide') && isOverflow) add(renderBounds, childrenRenderBounds)
+        !this.isOverflow !== !isOverflow && (this.isOverflow = isOverflow) // 节省赋值
     }
 
     @rewrite(rect.__updateRenderBounds)
@@ -136,18 +128,11 @@ export class Box extends Group implements IBox {
         }
     }
 
-    public __drawAfterFill(canvas: ILeaferCanvas, options: IRenderOptions): void {
-        const { length } = this.children
-        if (this.isOverflow) {
-            canvas.save()
-            canvas.clip()
-            if (length) this.__renderGroup(canvas, options)
-            canvas.restore()
-        } else {
-            if (length) this.__renderGroup(canvas, options)
-        }
+    // in __drawAfterFill()
+    public __drawContent(canvas: ILeaferCanvas, options: IRenderOptions): void {
+        this.__renderGroup(canvas, options)
 
-        if (this.__.stroke && length) {
+        if (this.__.__hasStroke) { // 还原绘制路径
             canvas.setWorld(this.__nowWorld)
             this.__drawRenderPath(canvas)
         }

package/src/Canvas.ts

@@ -43,7 +43,6 @@ export class Canvas extends Rect implements ICanvas {
         super(data)
         this.canvas = Creator.canvas(this.__ as ILeaferCanvasConfig)
         this.context = this.canvas.context
-        this.__.__isCanvas = this.__.__drawAfterFill = true
         if (data && data.url) this.drawImage(data.url)
     }
 
@@ -57,9 +56,7 @@ export class Canvas extends Rect implements ICanvas {
     }
 
     public draw(ui: IUI, offset?: IPointData, scale?: number | IPointData, rotation?: number): void {
-        ui.__layout.update()
-
-        const matrix = new Matrix(ui.__world).invert()
+        const matrix = new Matrix(ui.worldTransform).invert()
 
         const m = new Matrix()
         if (offset) m.translate(offset.x, offset.y)
@@ -75,16 +72,10 @@ export class Canvas extends Rect implements ICanvas {
         this.forceRender()
     }
 
-    public __drawAfterFill(canvas: ILeaferCanvas, _options: IRenderOptions): void {
-        const { width, height, cornerRadius } = this.__, { view } = this.canvas
-        if (cornerRadius || this.pathInputed) {
-            canvas.save()
-            canvas.clip()
-            canvas.drawImage(view, 0, 0, view.width, view.height, 0, 0, width, height)
-            canvas.restore()
-        } else {
-            canvas.drawImage(view, 0, 0, view.width, view.height, 0, 0, width, height)
-        }
+    // in __drawAfterFill()
+    public __drawContent(canvas: ILeaferCanvas, _options: IRenderOptions): void {
+        const { width, height } = this.__, { view } = this.canvas
+        canvas.drawImage(view, 0, 0, view.width, view.height, 0, 0, width, height)
     }
 
     public __updateSize(): void {

package/src/Group.ts

@@ -1,5 +1,5 @@
 import { IJSONOptions, IPickOptions, IPickResult, IPointData } from '@leafer/interface'
-import { Branch, useModule, dataProcessor, registerUI, UICreator } from '@leafer/core'
+import { Branch, useModule, dataProcessor, registerUI } from '@leafer/core'
 
 import { IGroup, IGroupData, IGroupInputData, IUI, IUIInputData, IUIJSONData, IFindCondition, IFindUIMethod } from '@leafer-ui/interface'
 import { GroupData } from '@leafer-ui/data'
@@ -39,27 +39,16 @@ export class Group extends UI implements IGroup {   // tip: rewrited Box
     public set(data: IUIInputData, isTemp?: boolean): void {
         if (data.children) {
             const { children } = data
-            delete data.children
 
-            if (!this.children) {
-                this.__setBranch()
-            } else {
-                this.clear()
-            }
+            delete data.children
+            this.children ? this.clear() : this.__setBranch()
 
             super.set(data, isTemp)
 
-            let child: IUI
-            children.forEach(childData => {
-                child = (childData as IUI).__ ? childData as IUI : UICreator.get(childData.tag, childData) as IUI
-                this.add(child)
-            })
-
+            children.forEach(child => this.add(child))
             data.children = children
 
-        } else {
-            super.set(data, isTemp)
-        }
+        } else super.set(data, isTemp)
     }
 
     public toJSON(options?: IJSONOptions): IUIJSONData {
@@ -76,21 +65,21 @@ export class Group extends UI implements IGroup {   // tip: rewrited Box
 
     // add
 
-    public addAt(child: IUI | IUIInputData, index: number): void {
+    public addAt(child: IUI | IUI[] | IUIInputData | IUIInputData[], index: number): void {
         this.add(child, index)
     }
 
-    public addAfter(child: IUI | IUIInputData, after: IUI): void {
+    public addAfter(child: IUI | IUI[] | IUIInputData | IUIInputData[], after: IUI): void {
         this.add(child, this.children.indexOf(after) + 1)
     }
 
-    public addBefore(child: IUI | IUIInputData, before: IUI): void {
+    public addBefore(child: IUI | IUI[] | IUIInputData | IUIInputData[], before: IUI): void {
         this.add(child, this.children.indexOf(before))
     }
 
     // Branch rewrite
 
-    public add(_child: IUI | IUIInputData, _index?: number): void { }
+    public add(_child: IUI | IUI[] | IUIInputData | IUIInputData[], _index?: number): void { }
 
     public addMany(..._children: IUI[] | IUIInputData[]): void { }
 
@@ -100,4 +89,4 @@ export class Group extends UI implements IGroup {   // tip: rewrited Box
 
     public clear(): void { }
 
-}
+}

package/src/Line.ts

@@ -28,7 +28,7 @@ export class Line extends UI implements ILine { // tip: rewrited Polygon
     declare public height?: INumber
 
     @pathType()
-    public points?: number[]
+    public points?: number[] | IPointData[]
 
     @pathType(0)
     public curve?: boolean | number
@@ -79,17 +79,13 @@ export class Line extends UI implements ILine { // tip: rewrited Polygon
         if (!this.pathInputed && data.points && data.curve) {
             drawPoints(data.__pathForRender = [], data.points, data.curve, data.closed)
             if (data.__useArrow) PathArrow.addArrows(this, false)
-        } else {
-            super.__updateRenderPath()
-        }
+        } else super.__updateRenderPath()
     }
 
     public __updateBoxBounds(): void {
         if (this.points) {
             toBounds(this.__.__pathForRender, this.__layout.boxBounds)
-        } else {
-            super.__updateBoxBounds()
-        }
+        } else super.__updateBoxBounds()
     }
 
 }

package/src/Path.ts

@@ -19,7 +19,6 @@ export class Path extends UI implements IPath {
 
     constructor(data?: IPathInputData) {
         super(data)
-        this.__.__pathInputed = 2
     }
 
 }

package/src/Polygon.ts

@@ -1,4 +1,4 @@
-import { INumber } from '@leafer/interface'
+import { INumber, IPointData } from '@leafer/interface'
 import { PathCommandDataHelper, dataProcessor, pathType, registerUI, rewrite, rewriteAble } from '@leafer/core'
 
 import { IPolygon, IPolygonData, IPolygonInputData } from '@leafer-ui/interface'
@@ -25,7 +25,7 @@ export class Polygon extends UI implements IPolygon {
     public sides?: INumber
 
     @pathType()
-    public points?: number[]
+    public points?: number[] | IPointData[]
 
     @pathType(0)
     public curve?: boolean | number

package/src/Text.ts

@@ -2,9 +2,9 @@ import { ILeaferCanvas, IPathDrawer, IPathCommandData, IBoolean, INumber, IStrin
 import { BoundsHelper, boundsType, surfaceType, dataProcessor, registerUI, affectStrokeBoundsType, dataType, hitType, MathHelper } from '@leafer/core'
 
 import { IFill, IText, IFontWeight, ITextCase, ITextDecoration, ITextData, ITextInputData, ITextAlign, IVerticalAlign, ITextDrawData, IOverflow, IStrokeAlign, IHitType, ITextWrap } from '@leafer-ui/interface'
-import { TextData, UnitConvert } from '@leafer-ui/data'
+import { TextData } from '@leafer-ui/data'
 
-import { TextConvert } from '@leafer-ui/external'
+import { TextConvert, UnitConvert } from '@leafer-ui/external'
 
 import { UI } from './UI'
 
@@ -86,8 +86,6 @@ export class Text extends UI implements IText {
     @boundsType('show')
     public textOverflow?: IOverflow | string
 
-    public get editInner(): string { return 'TextEditor' }
-
     public get textDrawData(): ITextDrawData {
         this.__layout.update()
         return this.__.__textDrawData
@@ -139,7 +137,7 @@ export class Text extends UI implements IText {
         data.__lineHeight = UnitConvert.number(lineHeight, fontSize)
         data.__letterSpacing = UnitConvert.number(letterSpacing, fontSize)
         data.__padding = padding ? MathHelper.fourNumber(padding) : undefined
-        data.__baseLine = data.__lineHeight - (data.__lineHeight - fontSize * 0.7) / 2
+        data.__baseLine = data.__lineHeight - (data.__lineHeight - fontSize * 0.7) / 2 // 基线位置
         data.__font = `${italic ? 'italic ' : ''}${textCase === 'small-caps' ? 'small-caps ' : ''}${fontWeight !== 'normal' ? fontWeight + ' ' : ''}${fontSize}px ${fontFamily}`
         data.__clipText = textOverflow !== 'show' && !data.__autoSize
 
@@ -172,16 +170,14 @@ export class Text extends UI implements IText {
             super.__updateBoxBounds()
         }
 
-        if (italic) b.width += fontSize * 0.16
+        if (italic) b.width += fontSize * 0.16 // 倾斜会导致文本的bounds增大
 
         const contentBounds = includes(b, bounds) ? b : bounds
         if (!isSame(contentBounds, layout.contentBounds)) {
             layout.contentBounds = contentBounds
             layout.renderChanged = true
             setList(data.__textBoxBounds = {} as IBoundsData, [b, bounds])
-        } else {
-            data.__textBoxBounds = contentBounds
-        }
+        } else data.__textBoxBounds = contentBounds
 
     }
 

package/src/UI.ts

@@ -1,4 +1,4 @@
-import { ILeaferCanvas, IPathDrawer, IPathCommandData, IHitType, INumber, IBoolean, IString, IPathString, IExportFileType, IPointData, ICursorType, IMaskType, IEraserType, IValue, IWindingRule, IPathCreator, IFourNumber, IBoundsData, IFlowType, IGap, IFlowWrap, IAxis, IConstraint, IAutoBoxData, IFlowBoxType, IPointGap, IFlowAlign, IFlowAxisAlign, IFindCondition, IAutoSize, IRangeSize, IAlign, IUnitPointData, IObject, IScaleData, IUnitData } from '@leafer/interface'
+import { ILeaferCanvas, IPathDrawer, IPathCommandData, IHitType, INumber, IBoolean, IString, IPathString, IExportFileType, IPointData, ICursorType, IMaskType, IEraserType, IValue, IWindingRule, IPathCreator, IFourNumber, IBoundsData, IFlowType, IGap, IFlowWrap, IAxis, IConstraint, IAutoBoxData, IFlowBoxType, IPointGap, IFlowAlign, IFlowAxisAlign, IFindCondition, IAutoSize, IRangeSize, IAlign, IUnitPointData, IObject, IScaleData, IUnitData, IPathCommandObject } from '@leafer/interface'
 import { Leaf, PathDrawer, surfaceType, dataType, positionType, boundsType, pathType, scaleType, rotationType, opacityType, visibleType, sortType, maskType, dataProcessor, registerUI, useModule, rewrite, rewriteAble, UICreator, PathCorner, hitType, strokeType, PathConvert, eraserType, cursorType, autoLayoutType, pen, naturalBoundsType, pathInputType, MathHelper, needPlugin } from '@leafer/core'
 
 import { IUI, IShadowEffect, IBlurEffect, IStrokeAlign, IStrokeJoin, IStrokeCap, IBlendMode, IDashPatternString, IShadowString, IGrayscaleEffect, IUIData, IGroup, IStrokeWidthString, ICornerRadiusString, IUIInputData, IExportOptions, IExportResult, IFill, IStroke, IArrowType, IFindUIMethod, ILeafer, IEditorConfig, IEditorConfigFunction, IEditToolFunction, IKeyframe, IAnimation, IAnimate, IStates, IStateName, ITransition, IAnimateType } from '@leafer-ui/interface'
@@ -138,7 +138,7 @@ export class UI extends Leaf implements IUI { // tip: rewrited Box
 
     // path
     @pathInputType()
-    public path?: IPathCommandData | IPathString
+    public path?: IPathCommandData | IPathCommandObject[] | IPathString
 
     @pathType()
     public windingRule?: IWindingRule
@@ -352,13 +352,13 @@ export class UI extends Leaf implements IUI { // tip: rewrited Box
     }
 
 
-    // editor
+    //  @leafer-in/editor rewrite
 
     public get editConfig(): IEditorConfig { return undefined }
 
-    public get editOuter(): string { return this.__.__isLinePath ? 'LineEditTool' : 'EditTool' }
+    public get editOuter(): string { return '' }
 
-    public get editInner(): string { return 'PathEditor' }
+    public get editInner(): string { return '' }
 
 
     constructor(data?: IUIInputData) {
@@ -377,9 +377,7 @@ export class UI extends Leaf implements IUI { // tip: rewrited Box
             this.lockNormalStyle = true
             Object.assign(this, data)
             this.lockNormalStyle = false
-        } else {
-            Object.assign(this, data)
-        }
+        } else Object.assign(this, data)
     }
 
     public get(name?: string | string[] | IUIInputData): IUIInputData | IValue {

package/types/index.d.ts

@@ -1,4 +1,4 @@
-import { IString, INumber, IBoolean, IMaskType, IEraserType, IAlign, IUnitPointData, IPathCommandData, IPathString, IWindingRule, IFlowType, IFourNumber, IGap, IPointGap, IFlowAlign, IFlowAxisAlign, IFlowWrap, IFlowBoxType, IAutoSize, IAutoBoxData, IConstraint, IRangeSize, IAxis, IBoundsData, IHitType, ICursorType, IUnitData, IObject, IPointData, IPathCreator, IValue, IFindCondition, ILeaferCanvas, IPathDrawer, IExportFileType, IJSONOptions, IPickOptions, IPickResult, IRenderer, IWatcher, ILayouter, ISelector, IInteraction, ICanvasManager, IHitCanvasManager, ILeaferConfig, IAutoBounds, IBounds, IEventListenerId, ITimer, IControl, ILeaferType, IScreenSizeData, IResizeEvent, IZoomType, IClientPointData, IRenderOptions, ILeaferImage, ICanvasContext2DSettings, ICanvasContext2D } from '@leafer/interface';
+import { IString, INumber, IBoolean, IMaskType, IEraserType, IAlign, IUnitPointData, IPathCommandData, IPathCommandObject, IPathString, IWindingRule, IFlowType, IFourNumber, IGap, IPointGap, IFlowAlign, IFlowAxisAlign, IFlowWrap, IFlowBoxType, IAutoSize, IAutoBoxData, IConstraint, IRangeSize, IAxis, IBoundsData, IHitType, ICursorType, IUnitData, IObject, IPointData, IPathCreator, IValue, IFindCondition, ILeaferCanvas, IPathDrawer, IExportFileType, IJSONOptions, IPickOptions, IPickResult, IRenderer, IWatcher, ILayouter, ISelector, IInteraction, ICanvasManager, IHitCanvasManager, ILeaferConfig, IAutoBounds, IBounds, IEventListenerId, ITimer, IControl, ILeaferType, IScreenSizeData, IResizeEvent, IZoomType, IClientPointData, IRenderOptions, ILeaferImage, ICanvasContext2DSettings, ICanvasContext2D } from '@leafer/interface';
 import { Leaf, LeafList } from '@leafer/core';
 import { IUI, IUIData, IUIInputData, ILeafer, IGroup, IBlendMode, IFill, IStroke, IStrokeAlign, IStrokeWidthString, IStrokeCap, IStrokeJoin, IDashPatternString, IArrowType, ICornerRadiusString, IShadowEffect, IShadowString, IBlurEffect, IGrayscaleEffect, IAnimation, ITransition, IStates, IStateName, IAnimate, IEditorConfig, IFindUIMethod, IKeyframe, IAnimateType, IExportOptions, IExportResult, IEditorConfigFunction, IEditToolFunction, IGroupData, IGroupInputData, IUIJSONData, IFindCondition as IFindCondition$1, ILeaferData, IApp, IEditorBase, IFunction, ILeaferInputData, IBox, IBoxData, IOverflow, IBoxInputData, IFrame, IFrameData, IFrameInputData, IRect, IRectData, IRectInputData, IEllipse, IEllipseData, IEllipseInputData, IPolygon, IPolygonData, IPolygonInputData, IStar, IStarData, IStarInputData, ILine, ILineData, ILineInputData, IImage, IImageData, IImageInputData, ICanvas, ICanvasData, ICanvasInputData, IText, ITextData, IHitType as IHitType$1, IFontWeight, ITextCase, ITextDecoration, ITextAlign, IVerticalAlign, ITextWrap, ITextDrawData, ITextInputData, IPath, IPathData, IPathInputData, IPen, IPenData, IPathCommandData as IPathCommandData$1, IPenInputData } from '@leafer-ui/interface';
 
@@ -39,7 +39,7 @@ declare class UI extends Leaf implements IUI {
     around?: IAlign | IUnitPointData;
     lazy?: IBoolean;
     pixelRatio?: INumber;
-    path?: IPathCommandData | IPathString;
+    path?: IPathCommandData | IPathCommandObject[] | IPathString;
     windingRule?: IWindingRule;
     closed?: boolean;
     flow?: IFlowType;
@@ -153,10 +153,10 @@ declare class Group extends UI implements IGroup {
     set(data: IUIInputData, isTemp?: boolean): void;
     toJSON(options?: IJSONOptions): IUIJSONData;
     pick(_hitPoint: IPointData, _options?: IPickOptions): IPickResult;
-    addAt(child: IUI | IUIInputData, index: number): void;
-    addAfter(child: IUI | IUIInputData, after: IUI): void;
-    addBefore(child: IUI | IUIInputData, before: IUI): void;
-    add(_child: IUI | IUIInputData, _index?: number): void;
+    addAt(child: IUI | IUI[] | IUIInputData | IUIInputData[], index: number): void;
+    addAfter(child: IUI | IUI[] | IUIInputData | IUIInputData[], after: IUI): void;
+    addBefore(child: IUI | IUI[] | IUIInputData | IUIInputData[], before: IUI): void;
+    add(_child: IUI | IUI[] | IUIInputData | IUIInputData[], _index?: number): void;
     addMany(..._children: IUI[] | IUIInputData[]): void;
     remove(_child?: IUI | number | string | IFindCondition$1 | IFindUIMethod, _destroy?: boolean): void;
     removeAll(_destroy?: boolean): void;
@@ -276,7 +276,7 @@ declare class Box extends Group implements IBox {
     __renderRect(_canvas: ILeaferCanvas, _options: IRenderOptions): void;
     __renderGroup(_canvas: ILeaferCanvas, _options: IRenderOptions): void;
     __render(canvas: ILeaferCanvas, options: IRenderOptions): void;
-    __drawAfterFill(canvas: ILeaferCanvas, options: IRenderOptions): void;
+    __drawContent(canvas: ILeaferCanvas, options: IRenderOptions): void;
 }
 
 declare class Frame extends Box implements IFrame {
@@ -308,7 +308,7 @@ declare class Polygon extends UI implements IPolygon {
     get __tag(): string;
     __: IPolygonData;
     sides?: INumber;
-    points?: number[];
+    points?: number[] | IPointData[];
     curve?: boolean | number;
     constructor(data?: IPolygonInputData);
     __updatePath(): void;
@@ -330,7 +330,7 @@ declare class Line extends UI implements ILine {
     __: ILineData;
     strokeAlign?: IStrokeAlign;
     height?: INumber;
-    points?: number[];
+    points?: number[] | IPointData[];
     curve?: boolean | number;
     closed?: boolean;
     get toPoint(): IPointData;
@@ -368,7 +368,7 @@ declare class Canvas extends Rect implements ICanvas {
     drawImage(url: string): void;
     draw(ui: IUI, offset?: IPointData, scale?: number | IPointData, rotation?: number): void;
     paint(): void;
-    __drawAfterFill(canvas: ILeaferCanvas, _options: IRenderOptions): void;
+    __drawContent(canvas: ILeaferCanvas, _options: IRenderOptions): void;
     __updateSize(): void;
     destroy(): void;
 }
@@ -398,7 +398,6 @@ declare class Text extends UI implements IText {
     autoSizeAlign?: IBoolean;
     textWrap?: ITextWrap;
     textOverflow?: IOverflow | string;
-    get editInner(): string;
     get textDrawData(): ITextDrawData;
     constructor(data?: ITextInputData);
     __drawHitPath(canvas: ILeaferCanvas): void;