应用配置

基础     视口类型     画布     点按     多点     触屏     滚轮     平移视图     缩放视图

App 与 Leafer 的初始化基础配置。

关键属性

start: boolean

是否自动启动应用，默认为 true。

应用启动后，可以通过 app.stop()、 app.start() 手动控制渲染。

渲染属性

应用运行中修改 leafer.config 立即生效。

usePartRender: boolean

是否使用 局部渲染， 默认为 true。

注意事项

App 结构 下需设置在 子层 Leafer 的 config 上，如 ground、tree、sky 层。

交互属性

应用运行中修改 app.config 立即生效。

注意事项

App 结构 下只能设置在 App 的 config 上。

mobile: boolean

是否在手机端使用，自动优化体验（如停用 hover 事件），图形编辑器可配置 手势控制元素。

cursor: boolean

是否启用光标功能，默认为 true。

keyEvent: boolean

是否接收键盘事件， 默认为 true。

示例

手动启动应用

当图形数量很多，异步创建完后，通过手动 start()，可以加快创建速度。

Leafer

import { Leafer } from 'leafer-ui'

const leafer = new Leafer({
    view: window,
    start: false
})

// async create leafs ...

leafer.start()

App

import { App } from 'leafer-ui'

const app = new App({
    view: window,
    tree: {},
    start: false
})

// async create leafs ...

app.start()

关闭局部渲染

Leafer

import { Leafer, Rect, Debug } from 'leafer-ui'

const leafer = new Leafer({
    view: window,
    usePartRender: false
})

Debug.showRepaint = true

leafer.add(Rect.one({ fill: '#32cd79', draggable: true }, 100, 100))

App

import { App, Rect, Debug } from 'leafer-ui'

const app = new App({
    view: window,
    tree: { usePartRender: false }
})

Debug.showRepaint = true

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