Skip to content

EditorGroupEvent

编辑器的编组事件,通过 app.editor.on() 监听。

事件属性

editTarget: Group

当前操作的目标组。

事件名称

EditorGroupEvent.BEFORE_GROUP

before 编组事件。

editor.before_group

EditorGroupEvent.GROUP

编组事件。

editor.group

EditorGroupEvent.BEFORE_UNGROUP

before 解组事件。

editor.before_ungroup

EditorGroupEvent.UNGROUP

解组事件。

editor.ungroup

EditorGroupEvent.BEFORE_OPEN

before 双击打开组事件。

editor.before_open_group

EditorGroupEvent.OPEN

双击打开组事件。

editor.open_group

EditorGroupEvent.BEFORE_CLOSE

before 关闭已打开的组事件。

editor.before_close_group

EditorGroupEvent.CLOSE

关闭已打开的组事件。

editor.close_group

继承事件

Event

示例

元素编组事件

ts
// #图形编辑器 [元素编组事件]
import { App, Rect } from 'leafer-ui'
import { EditorGroupEvent } from '@leafer-in/editor' // 导入图形编辑器插件 //
import '@leafer-in/viewport' // 导入视口插件 (可选)

const app = new App({
    view: window,
    editor: {}
})

app.tree.add(Rect.one({ fill: '#32cd79', editable: true }, 100, 100))
app.tree.add(Rect.one({ fill: '#32cd79', editable: true }, 300, 100))

setTimeout(() => {

    // 手动选择并编组元素 
    app.editor.select(app.tree.children)
    app.editor.group()

}, 1000)

app.editor.on(EditorGroupEvent.GROUP, (e: EditorGroupEvent) => {
    console.log(e.editTarget)
})

Released under the MIT License.