@leafer/layouter 1.0.0-alpha.9 → 1.0.0-beta

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leafer/layouter",
-  "version": "1.0.0-alpha.9",
+  "version": "1.0.0-beta",
   "description": "@leafer/canvas",
   "author": "Chao (Leafer) Wan",
   "license": "MIT",
@@ -19,14 +19,14 @@
     "leaferjs"
   ],
   "dependencies": {
-    "@leafer/event": "1.0.0-alpha.9",
-    "@leafer/math": "1.0.0-alpha.9",
-    "@leafer/list": "1.0.0-alpha.9",
-    "@leafer/data": "1.0.0-alpha.9",
-    "@leafer/helper": "1.0.0-alpha.9",
-    "@leafer/debug": "1.0.0-alpha.9"
+    "@leafer/event": "1.0.0-beta",
+    "@leafer/math": "1.0.0-beta",
+    "@leafer/list": "1.0.0-beta",
+    "@leafer/data": "1.0.0-beta",
+    "@leafer/helper": "1.0.0-beta",
+    "@leafer/debug": "1.0.0-beta"
   },
   "devDependencies": {
-    "@leafer/interface": "1.0.0-alpha.9"
+    "@leafer/interface": "1.0.0-beta"
   }
 }

package/src/LayoutBlockData.ts

@@ -26,7 +26,7 @@ export class LayoutBlockData implements ILayoutBlockData {
 
     public setAfter(): void {
         setByListWithHandle(this.afterBounds, this.updatedList.list, worldBounds)
-        this.__computeChange()
+        this.updatedBounds.setByList([this.beforeBounds, this.afterBounds])
     }
 
     public merge(data: ILayoutBlockData): void {
@@ -36,17 +36,8 @@ export class LayoutBlockData implements ILayoutBlockData {
         this.updatedBounds.add(data.updatedBounds)
     }
 
-    protected __computeChange(): void {
-        const { updatedBounds: changedBounds } = this
-        changedBounds.setByList([this.beforeBounds, this.afterBounds])
-        if (!changedBounds.isEmpty()) {
-            changedBounds.spread(2)
-            changedBounds.ceil()
-        }
-    }
-
     public destroy(): void {
-        this.updatedList = undefined
+        this.updatedList = null
     }
 
 }

package/src/Layouter.ts

@@ -1,9 +1,9 @@
 import { ILayouter, ILeaf, ILayoutBlockData, IEventListenerId, ILayouterConfig, ILeafList } from '@leafer/interface'
-import { LayoutEvent, RenderEvent, WatchEvent } from '@leafer/event'
+import { LayoutEvent, WatchEvent } from '@leafer/event'
 import { LeafLevelList, LeafList } from '@leafer/list'
 import { BranchHelper, LeafHelper } from '@leafer/helper'
 import { DataHelper } from '@leafer/data'
-import { Run } from '@leafer/debug'
+import { Run, Debug } from '@leafer/debug'
 
 import { updateBounds, updateMatrix, updateChange } from './LayouterHelper'
 import { LayoutBlockData } from './LayoutBlockData'
@@ -12,33 +12,36 @@ import { LayoutBlockData } from './LayoutBlockData'
 const { updateAllWorldMatrix, updateAllChange } = LeafHelper
 const { pushAllBranchStack, updateWorldBoundsByBranchStack } = BranchHelper
 
+const debug = Debug.get('Layouter')
+
 export class Layouter implements ILayouter {
 
     public target: ILeaf
     public layoutedBlocks: ILayoutBlockData[]
+
     public totalTimes: number = 0
     public times: number
-    public changed: boolean = true
-
-    public config: ILayouterConfig = {
-        partLayout: {
-            maxTimes: 3
-        }
-    }
 
+    public disabled: boolean
     public running: boolean
+    public layouting: boolean
+
+    public waitAgain: boolean
 
-    protected updateList: ILeafList
-    protected levelList: LeafLevelList = new LeafLevelList()
-    protected eventIds: IEventListenerId[]
+    public config: ILayouterConfig = {}
+
+    protected __updateList: ILeafList
+    protected __levelList: LeafLevelList = new LeafLevelList()
+    protected __eventIds: IEventListenerId[]
 
     constructor(target: ILeaf, userConfig?: ILayouterConfig) {
         this.target = target
         if (userConfig) this.config = DataHelper.default(userConfig, this.config)
-        this.listenEvents()
+        this.__listenEvents()
     }
 
     public start(): void {
+        if (this.disabled) return
         this.running = true
     }
 
@@ -46,107 +49,125 @@ export class Layouter implements ILayouter {
         this.running = false
     }
 
-    protected listenEvents(): void {
-        const { target } = this
-        this.eventIds = [
-            target.on__(LayoutEvent.REQUEST, this.layout, this),
-            target.on__(LayoutEvent.AGAIN, this.layoutOnce, this),
-            target.on__(WatchEvent.DATA, this.onReceiveWatchData, this),
-            target.on__(RenderEvent.REQUEST, this.onChange, this),
-        ]
-    }
-
-    protected removeListenEvents(): void {
-        this.target.off__(this.eventIds)
-    }
-
-    protected onReceiveWatchData(event: WatchEvent): void {
-        this.updateList = event.data.updatedList
-    }
-
-    protected onChange(): void {
-        this.changed = true
+    public disable(): void {
+        this.stop()
+        this.__removeListenEvents()
+        this.disabled = true
     }
 
     public layout(): void {
         if (!this.running) return
         const { target } = this
-        const { START, LAYOUT, END } = LayoutEvent
         this.times = 0
-        this.changed = false
-        target.emit(START)
-        this.layoutOnce()
-        target.emitEvent(new LayoutEvent(LAYOUT, this.layoutedBlocks))
-        target.emitEvent(new LayoutEvent(END, this.layoutedBlocks))
-        this.layoutedBlocks = undefined
+
+        try {
+            target.emit(LayoutEvent.START)
+            this.layoutOnce()
+            target.emitEvent(new LayoutEvent(LayoutEvent.END, this.layoutedBlocks, this.times))
+        } catch (e) {
+            debug.error(e)
+        }
+
+        this.layoutedBlocks = null
+    }
+
+    public layoutAgain(): void {
+        if (this.layouting) {
+            this.waitAgain = true
+        } else {
+            this.layoutOnce()
+        }
     }
 
     public layoutOnce(): void {
 
-        this.totalTimes++
+        if (this.layouting) return debug.warn('layouting')
+        if (this.times > 3) return debug.warn('layout max times')
+
         this.times++
+        this.totalTimes++
+
+        this.layouting = true
 
         this.target.emit(WatchEvent.REQUEST)
+
         if (this.totalTimes > 1) {
             this.partLayout()
         } else {
             this.fullLayout()
         }
+
+        this.layouting = false
+
+        if (this.waitAgain) {
+            this.waitAgain = false
+            this.layoutOnce()
+        }
+
     }
 
     public partLayout(): void {
-        if (!this.updateList?.length) return
+        if (!this.__updateList?.length) return
 
-        const t = Run.start('part layout')
-        const { target, updateList } = this
-        const { BEFORE_ONCE, ONCE, AFTER_ONCE } = LayoutEvent
+        const t = Run.start('PartLayout')
+        const { target, __updateList: updateList } = this
+        const { BEFORE, LAYOUT, AFTER } = LayoutEvent
 
         const blocks = this.getBlocks(updateList)
         blocks.forEach(item => { item.setBefore() })
-        target.emitEvent(new LayoutEvent(BEFORE_ONCE, blocks))
+        target.emitEvent(new LayoutEvent(BEFORE, blocks, this.times))
 
         updateList.sort()
-        updateMatrix(updateList, this.levelList)
-        updateBounds(this.levelList)
+        updateMatrix(updateList, this.__levelList)
+        updateBounds(this.__levelList)
         updateChange(updateList)
 
-        blocks.forEach(item => { item.setAfter() })
-        target.emitEvent(new LayoutEvent(ONCE, blocks))
-        target.emitEvent(new LayoutEvent(AFTER_ONCE, blocks))
+        blocks.forEach(item => item.setAfter())
+
+        target.emitEvent(new LayoutEvent(LAYOUT, blocks, this.times))
+        target.emitEvent(new LayoutEvent(AFTER, blocks, this.times))
 
-        this.setBlocks(blocks)
+        this.addBlocks(blocks)
 
-        this.levelList.reset()
-        this.updateList = undefined
+        this.__levelList.reset()
+        this.__updateList = null
         Run.end(t)
 
-        this.__checkAgain()
     }
 
     public fullLayout(): void {
-        const t = Run.start('full layout')
+        const t = Run.start('FullLayout')
 
         const { target } = this
-        const { BEFORE_ONCE, ONCE, AFTER_ONCE } = LayoutEvent
+        const { BEFORE, LAYOUT, AFTER } = LayoutEvent
 
         const blocks = this.getBlocks(new LeafList(target))
-        target.emitEvent(new LayoutEvent(BEFORE_ONCE, blocks))
+        target.emitEvent(new LayoutEvent(BEFORE, blocks, this.times))
 
         Layouter.fullLayout(target)
 
         blocks.forEach(item => { item.setAfter() })
-        target.emitEvent(new LayoutEvent(ONCE, blocks))
-        target.emitEvent(new LayoutEvent(AFTER_ONCE, blocks))
+        target.emitEvent(new LayoutEvent(LAYOUT, blocks, this.times))
+        target.emitEvent(new LayoutEvent(AFTER, blocks, this.times))
 
-        this.setBlocks(blocks)
+        this.addBlocks(blocks)
 
         Run.end(t)
 
-        this.__checkAgain()
     }
 
-    protected __checkAgain(): void {
-        if (this.changed && this.times <= this.config.partLayout.maxTimes) this.target.emit(LayoutEvent.AGAIN) // 防止更新布局过程中产生了属性修改
+    static fullLayout(target: ILeaf): void {
+        updateAllWorldMatrix(target)
+
+        if (target.isBranch) {
+            const branchStack: ILeaf[] = [target]
+            pushAllBranchStack(target, branchStack)
+            updateWorldBoundsByBranchStack(branchStack)
+        } else {
+            target.__updateWorldBounds()
+        }
+
+        updateAllChange(target)
     }
 
 
@@ -158,29 +179,33 @@ export class Layouter implements ILayouter {
         return [this.createBlock(list)]
     }
 
-    public setBlocks(current: ILayoutBlockData[]) {
+    public addBlocks(current: ILayoutBlockData[]) {
         this.layoutedBlocks ? this.layoutedBlocks.push(...current) : this.layoutedBlocks = current
     }
 
+    protected __onReceiveWatchData(event: WatchEvent): void {
+        this.__updateList = event.data.updatedList
+    }
 
-    static fullLayout(target: ILeaf): void {
-        updateAllWorldMatrix(target)
-
-        if (target.__isBranch) {
-            const branchStack: ILeaf[] = [target]
-            pushAllBranchStack(target, branchStack)
-            updateWorldBoundsByBranchStack(branchStack)
-        } else {
-            target.__updateWorldBounds()
-        }
+    protected __listenEvents(): void {
+        const { target } = this
+        this.__eventIds = [
+            target.on_(LayoutEvent.REQUEST, this.layout, this),
+            target.on_(LayoutEvent.AGAIN, this.layoutAgain, this),
+            target.on_(WatchEvent.DATA, this.__onReceiveWatchData, this)
+        ]
+    }
 
-        updateAllChange(target)
+    protected __removeListenEvents(): void {
+        this.target.off_(this.__eventIds)
     }
 
-    destroy(): void {
+    public destroy(): void {
         if (this.target) {
-            this.removeListenEvents()
-            this.target = undefined
+            this.stop()
+            this.__removeListenEvents()
+            this.target = null
+            this.config = null
         }
     }
 

package/src/LayouterHelper.ts

@@ -11,20 +11,20 @@ export function updateMatrix(updateList: ILeafList, levelList: ILeafLevelList):
     let layout: ILeafLayout
     updateList.list.forEach(leaf => {  // 更新矩阵, 所有子元素，和父元素都需要更新bounds
         layout = leaf.__layout
-        if (levelList.without(leaf)) { // 防止重复， 子元素可能已经被父元素更新过
+        if (levelList.without(leaf) && !layout.useZoomProxy) { // 防止重复， 子元素可能已经被父元素更新过
 
             if (layout.matrixChanged) {
 
                 updateAllWorldMatrix(leaf)
 
                 levelList.push(leaf)
-                if (leaf.__isBranch) pushAllChildBranch(leaf, levelList)
+                if (leaf.isBranch) pushAllChildBranch(leaf, levelList)
                 pushAllParent(leaf, levelList)
 
             } else if (layout.boundsChanged) {
 
                 levelList.push(leaf)
-                if (leaf.__isBranch) leaf.__tempNumber = 0  // 标识需要更新子Leaf元素的WorldBounds分支, 0表示不需要更新
+                if (leaf.isBranch) leaf.__tempNumber = 0  // 标识需要更新子Leaf元素的WorldBounds分支, 0表示不需要更新
                 pushAllParent(leaf, levelList)
             }
         }
@@ -43,9 +43,9 @@ export function updateBounds(boundsList: ILeafLevelList): void {
             branch = itemList[i]
 
             // 标识了需要更新子元素
-            if (branch.__isBranch && branch.__tempNumber) {
+            if (branch.isBranch && branch.__tempNumber) {
                 for (let j = 0, jLen = branch.children.length; j < jLen; j++) {
-                    if (!branch.children[j].__isBranch) {
+                    if (!branch.children[j].isBranch) {
                         branch.children[j].__updateWorldBounds()
                     }
                 }