Playground | LeaferJS

场景

🎨 图形编辑

透明画板

创建图形

画笔工具

拖拽创建

右键菜单

🎮️ 小游戏

心花怒放

画龙点睛

快速入门

🧬 基础

创建 Leafer 引擎

创建元素

设置样式

事件处理

移除元素

导出元素

Vue / React

🧲 好玩

动画

交互状态

运动路径

Robot 游戏元素

自动布局

图形编辑器

😎 进阶

创建 App 应用

缩放平移视图

转换坐标

获取包围盒

局部渲染

生命周期

应用与引擎配置

元素参考

🍉 应用与引擎

App

Leafer

🥥 组元素

Group

Box

Frame

🍊 元素

Rect

Ellipse

Line

Polygon

Star

Path

Pen

Image

SVG

Canvas

Text

UI

🥝 自定义元素

基础

高级

元素通用功能

🎞️ 数据

id / name

parent / leafer

数据 / 克隆

路径数据

导入导出

移除 / 销毁

📐 布局

位置 / 缩放 / 旋转

偏移 / resize

围绕中心

包围盒 / 变换

转换坐标

层叠 / 放置

🏼 外观

透明 / 隐藏

填充 / 描边

渐变 / 图像

内外阴影

淡化 / 突出

裁剪 / 擦除

混合模式

🖱 交互

可交互性

编辑 / 拖拽

光标样式

交互状态

事件处理

🐆 动画

动画

过渡

运动路径

🌴 高级

限制拖动范围

强制渲染

查找拾取

自定义属性

常用功能

🌲 事件

交互事件

元素事件

平台事件

基础事件

🌷 实用

数学

列表

资源

🛠 开发

调试模式

开发插件

插件

🎨 图形编辑器

Editor

编辑器属性

编辑器功能

编辑器配置

编辑器事件

编辑工具

内部编辑器

🫧 自动布局

Flow

布局属性

子元素属性

🐆 动画

Animate

动画选项

缓动方式

延迟

时长

速度

反向

循环

结束样式

加入关键帧

自动播放

过渡属性

事件

动画属性

动画功能

动画事件

🫐 官方插件

视口

视图控制

滚动条

箭头

HTML

文本编辑

运动路径

Robot

交互状态

查找元素

导出元素

滤镜

color

resize

App.ts

实时预览

清空

TS

JS