概览
满屏按钮在你告诉它们被点击时该做什么之前，并不会真正工作。这就是 event editor 的任务：它让你的界面能够反应。本指南说明 event editor 是什么，拖拽连接机制如何工作，以及你可以选择的 triggers 和 actions 全菜单，全程无需编写代码。
event editor 是什么？
event editor 让你把 widgets 连接起来，使一个 widget 上发生的操作能影响另一个 widget，或影响屏幕本身。每个连接都由三个简单部分组成：
- A source，用户交互的 widget（例如 button）。
- A trigger，用户对它做了什么（例如 click）。
- An action，因此发生什么（例如 go to another screen），通常指向一个 destination widget 或 screen。
可以把它读成一句话："When the user clicks this button, change to the Settings screen." 这就是一个 event。你可以添加任意多个 event，让整个界面动起来。
Events 通过在 widgets 之间拖动连接来可视化构建，不需要脚本。导出项目时，PicoPixel 会把每个 event 转换成对应的 LVGL 代码。
打开 event editor
选择任意 widget 或 screen，然后切换到右侧边栏的 Events 标签（它与 Design 和 Inspect 并列）。这里每个 event 都会以卡片形式出现，你可以展开并配置它。
当你还没有创建任何 event 时，PicoPixel 会显示三种开始方式：
- 点击 + 按钮添加 event。
- 选择 widget 或 screen，然后从它拖出连接到另一个 widget 或 screen。
- 使用标题栏中的 play 按钮运行 events view 并试用。
连接 widgets：将节点拖到目标
创建 event 最快的方式就在画布上：
- 选择 source widget，也就是你希望用户交互的对象。
- 抓住它边缘出现的小 connection handle，并拖出一条 wire 到你想影响的 widget 或 screen。
- 把它放到那个 destination 上。PicoPixel 会在两者之间画出一条曲线，并在 wire 上放一个小 node。
- 点击该 node 选择 trigger（它会显示当前值，例如 "Clicked"）。destination 和其他细节在 Events panel 中设置。
这条可视化 wire 就是 event。你可以一眼看出哪些 widgets 连接到了哪里。
不想拖拽？也可以点击 Events panel 中的 + 按钮，然后从下拉菜单中填写 trigger、action 和 destination。结果一样，选择你觉得自然的方式即可。
选择 trigger
trigger 是用户做了什么。点击 wire 上的 node（或 Events panel 中的 Trigger 下拉菜单）来选择。最常用的是 Clicked，但还有完整集合：
- Clicked，一次点击并松开。这是日常的 "button press"，也是最常用的。
- Pressed，手指触下的瞬间。
- Released，手指抬起时。
- Long Pressed / Long Pressed Repeat，长按，或长按并重复。
- Gesture，滑动手势。
- Value Changed，widget 的值变化时：slider 被拖动、switch 被切换、checkbox 被勾选。这是 sliders、switches 和 rollers 的自然 trigger。
- Focused / Defocused，widget 获得或失去焦点时。
- Screen Loaded / Screen Unloaded，screen 出现或离开时。很适合在屏幕打开的一刻做初始化。
- Scroll Begin / Scroll End，开始或停止滚动时。
- Ready / Cancel，用于屏幕键盘等输入控件。
选择适合 widget 的 trigger。Clicked 适合 button；slider 或 switch 更适合 Value Changed。选对 trigger，决定了 event 会触发还是永远不触发。
选择 action
action 是会发生什么。你可以选择：
- Change Screen，导航到另一个 screen。你可以选择 transition（Fade，或 Slide left/right/up/down），并设置速度和延迟。这是构建多屏应用的方式。
- Delete Screen，转到另一个 screen 并 释放离开的 screen（对内存紧张设备很有用）。
- Show Widget / Hide Widget，显示或隐藏内容。适合 pop-ups、panels 和 "more info" 区域。
- Set State，在 widget 上添加、移除或切换 checked、disabled、focused 或 pressed 等 state。
- Set Opacity，将 widget 从完全可见（100）淡出到不可见（0）。
- Set Properties，改变 widget 的位置或尺寸。
- Set Text，更新 label 或 button 上显示的文字。
- Set Sprite Mode，将 sprite 切换到某个 phase（如 "Idle" 或 "Running"），或启动/停止它。这正是让 sprite 有生命力的方式。
- Animated Image Mode，启动、停止或重启动 animated image。
- Play Animation，运行你在 widget 上设置的 timeline animation。
- Modify Flag，更精细地添加/移除/切换 LVGL flag（高级选项）。
- Call Function，按名称调用你自己的 custom C function。这是任何自定义逻辑的出口；你需要在固件中编写该函数。
一个完整例子
假设你有一个 Home screen，上面有 "Settings" button，还有一个单独的 Settings screen。连接方式：
- 选择 Settings button。
- 从它拖出连接到 Settings screen（或在 Events panel 中选择它作为 destination）。
- 将 trigger 设为 Clicked。
- 将 action 设为 Change Screen，并把 destination 设为你的 Settings screen。
- 可选地选择 Slide left transition，让它感觉像向前移动。
点击 play 按钮，并在 live preview 中点击按钮，你会直接滑到 Settings。无需代码，无需刷机。
想让角色作出反应？添加一个 button，将 trigger 设为 Clicked，选择 Set Sprite Mode action，指向你的 sprite，并选择要切换的 phase（比如 "Happy"）。现在点击按钮就会改变 sprite 的动画。关于如何构建 sprite，请看 sprites guide。
编辑和删除 events
你创建的每个 event 都会以卡片形式出现在 Events panel 中：
- Edit，点击卡片展开它，并更改 trigger、action、destination 或 action 的选项。
- Delete，使用卡片上的 ✕ 删除该 event。它的 wire 也会从画布消失。
你可以给同一个 widget 附加多个 events，例如一个在 Pressed 上，另一个在 Released 上，以构建更丰富的交互。
接下来
Events 会把静态 mock-up 变成真实界面。接下来可以：
- 在 sprites guide 中构建 animated、multi-state widgets，并用 Set Sprite Mode 驱动它们。
- 用 fonts guide 保持文字清晰且小巧。
- 准备上硬件？按照 ESP32 tutorial 导出并刷入你的交互式 UI。
