教程：创建一个按钮¶

在本教程中，您将学习如何创建一个按钮。Kanzi 允许您仅使用触发器和动作来创建按钮。然而，要创建一个强大的按钮，请使用 Kanzi 状态管理器，并使用 Is Down 属性控制按钮的状态。

这两种方法之间的区别在于，使用状态管理器时，您始终知道按钮处于哪个状态。例如，当用户点击一个使用触发器和动作创建的按钮时，动作会发送消息，但您的应用程序并不知道按钮的状态。使用状态管理器时，您始终可以检查按钮处于哪个状态，甚至在需要时恢复状态。

视频显示教程的结果。

本教程假定您了解使用 Kanzi Studio 的基础知识。熟悉 Kanzi Studio 的最佳入门点是：

获取教程¶

要获取本教程，请在 Kanzi Studio 的 Quick Start 窗口中点击 Examples。在 Button 教程旁点击。

Kanzi Studio 会将教程下载到 <KanziWorkspace>/Tutorials 目录。您可以找到：

教程起点工程位于 <KanziWorkspace>/Tutorials/Button/Start 目录中。
完成的教程位于 <KanziWorkspace>/Tutorials/Button/Completed 目录中。

创建按钮¶

要创建按钮：

在 Kanzi Studio 的 Quick Start 窗口中点击 Examples。在 Button 教程旁点击 Open 并选择 Start project。
在 Node Tree 按 Alt 并右键单击中，选择 Frame 节点并选择 Button 2D。
从 Assets 窗口中拖动 Released 图像到 Node Tree，将其放在 Button 2D 节点上，按下 F2 键，并将节点重命名为 ButtonImage。

使用 ButtonImage 节点设置按钮的外观。
在 Node Tree 中选择 Button 2D 节点，并在 Properties 中添加并设置：
- Horizontal Alignment 到 Center
- Vertical Alignment 到 Center

创建按钮状态¶

在本节中，您将学习使用状态机定义用户按下和松开按钮时按钮的外观。

要创建按钮状态：

在 Node Tree 中选择 Button 2D 节点，并在 State Tools 中单击 Create State Manager。

您可以在 Preview 窗口下方找到 State Tools 窗口。

Kanzi Studio 创建一个状态管理器并将其分配给 Button 2D 节点。
创建按钮状态：
1. 在 State Tools 中，单击 Create State 以创建一个状态。
  
  双击状态名称，然后输入状态的新名称。
  
  例如，命名状态 Pressed。
2. 在 Node Tree 中选择 ButtonImage 节点，并在 Properties 中将 Image 属性设置为 Pressed。
3. 在 State Tools 中，单击以将当前值保存到该状态。
  
  您将 Image 属性的当前值保存到 Pressed 状态，以便在用户按下按钮时显示该图像。要查看哪些节点的属性已保存到某个状态，请将鼠标悬停在该状态的上。
重复上一步骤可创建定义按钮未按下时的状态。

例如，将状态命名为 Released，并将 ButtonImage 节点的 Image 属性设置为 Released。
在 State Tools 中，单击 <No Controller Property> 并选择 Button > Is Down。

在状态管理器中，您选择为 Controller Property 的属性值定义了状态组中每个状态何时处于活动状态的条件。

在这里，您使用 Is Down 属性根据该属性的值过渡到某个状态。

Is Down 属性控制 Button 节点是处于按下状态还是未按下状态。
在 State Tools 中，将 Pressed 状态下的 Controller Property 的值设置为 True。通过这样做，您的 Kanzi 应用程序在按钮被按下时使用 Pressed 状态，而在按钮未被按下时使用 Released 状态。
在 State Tools 中，单击 Transition Editor 以打开 State Transition Editor。
State Transition Editor 显示了在该状态组中所有状态之间使用的过渡。将鼠标指针移动到上，并将 Duration 设置为 0 毫秒。

您将迁移持续时间设为 0 毫秒，可在用户按下和松开按钮时立即改变按钮外观。

关闭 State Transition Editor。
在 State Tools 中，单击 Edit State Manager 以停用 State Tools。

当您想在 Preview 中尝试了解状态管理器如何在您的应用程序中工作时，您需要退出 State Tools 中的编辑模式。

在 Preview 中，当您单击按钮并按住鼠标按钮时，您将进入 Pressed 状态。当您释放鼠标按钮时，您将进入 Released 状态。