第 2 步 - 创建大灯指示灯¶

在本教程的这一步中，您将创建大灯指示灯，并使用状态机设置大灯指示灯在不同状态下的外观。

../../_images/indicator-step2-completed-with-needle.gif

创建大灯指示器¶

在本节中，您将学习创建大灯指示灯。

要创建大灯指示灯：

在 Node Tree 中，右键单击 FuelLevel 节点，选择 Duplicate，按下 F2 键，并将节点重命名为 Headlights。
在 Node Tree 中选择 Headlights 节点，并在 Properties 中单击旁边的两个绑定以将其删除。
在 Node Tree 中选择 Headlights 节点，在 Preview 中选择 Node tool ，并将 Headlights 节点拖到时钟的右侧。

小技巧

当您拖动具有 Node tool 的节点时，按住 Shift 键以沿真正的水平或垂直线移动节点。
在 Node Tree 中选择 Headlights 节点，在 Properties 中右键单击 SecondaryColor 属性并选择 Remove。
在 Node Tree 中选择 Headlights 节点，并在 Properties 中设置：
- Layout Width 到 41 和 Layout Height 到 31。
  
  通过这种方式，您可以设置要从 TileAtlas 纹理中绘制的车灯指示器图像的大小。
- OffsetInTileAtlas 属性字段：
  - X 到 0
  - 将 Y 设为 0。
  通过这种方式，您可以设置从 TileAtlas 纹理的左上角到您想要显示的低灯光指示器图像的距离（以像素为单位）。
- 将 PrimaryColor 属性字段 Hue (H) 设置为 95。
  
  这样，您将使用绿色绘制大灯指示灯。

控制大灯指示器¶

在本节中，您将使用状态机设置大灯指示灯在不同状态下的外观。

要控制大灯指示器：

在 Node Tree 中选择 Headlights 节点，并在 State Tools 中点击 Create State Manager。

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

Kanzi Studio 创建一个状态管理器并将其分配给 Headlights 节点。
在 State Tools 中，单击 Create State 三次以创建三个状态，双击每个状态的名称，并将状态重命名为 Off、Low 和 High。

您使用这些状态来设置 Headlights 指示器的外观：
- 当大灯关闭时，Off 状态。
- 当近光灯打开时，Low 状态。
- 当远光灯开启时，High 状态。
在 State Tools 中，单击 <No Controller Property>，选择 + Create Property Type，并在 Create Property Type 窗口中设置：
- Name 到 Indicator.Headlights
- Type 到 Enum
在 Library > Property Types > Indicator 中，Kanzi Studio 创建了 Indicator.Headlights 枚举属性类型，其枚举键具有您创建的状态名称。您使用此自定义属性类型在 Headlights 指示器的 Off、Low 和 High 状态之间切换。
在 Node Tree 中选择 Headlights 节点，在 Properties 中右键单击，然后选择 Add Property > Node > Visible。

使用 Visible 属性，您可以控制节点的可见性。
在 Off 状态下的 State Tools 中，单击以将 Visible 属性的当前值保存到该状态。

由于 Visible 属性在 Off 状态下被禁用，Headlights 节点在该状态下不可见。
在 Properties 中启用 Visible 属性，在 State Tools 中，在 Low 状态下，单击以将 Visible 属性的当前值保存到该状态。

通过为 Low 状态启用 Visible 属性，可以使 Headlights 节点在该状态下可见。
在 Properties 集中：
- OffsetInTileAtlas 属性字段 Y 到 31。
- 将 PrimaryColor 属性字段 Hue (H) 设置为 163。
在 High 状态下的 State Tools 中，单击将属性的当前值保存到 High 状态。
在 State Tools 中，单击以停用 State Tools。
在 Node Tree 中选择 Headlights 节点，在 Properties 中右键单击，然后选择 Add Property > Controller Properties > Indicator.Headlights。