使用状态迁移¶
使用状态迁移来定义状态机在应用程序状态改变时的反应,例如当用户点击一个按钮时。例如,您可以:
定义迁移的持续时间和开始时间
定义用户是否可以中断迁移
使用自定义动画。请参阅 在状态迁移中使用自定义缓动函数。
使用任何与任何状态之间的迁移¶
当您创建状态时,状态机使用默认迁移在两种状态之间进行迁移。
要设置任何状态之间的迁移:
创建一个节点并将节点设置为使用状态管理器。请参阅 使用状态机 或 教程:创建一个切换按钮。
例如,创建切换按钮和拥有包含状态 On 和 Off 的状态组的状态管理器。
在 State Tools 中,单击 Transition Editor 以打开 State Transition Editor。
要创建新的过渡,请在现有过渡下单击 + Create Transition。
当您第一次打开 State Transition Editor 时,它会显示该状态组中所有状态之间使用的过渡。将鼠标指针移动到
上以查看过渡的详细信息。
在弹出窗口中进行以下设置:
Duration 到转换的长度(以毫秒为单位)。
要设置过渡的持续时间,可以在 Duration 区域中单击并拖动,或输入新值。
Allow interrupt 或 Always full time 设置 Kanzi 如何处理过渡的中断:
Always full time 使用 Duration 中设置的整个时间在中断发生后过渡到该状态。
Allow interrupt 仅使用在 Duration 中设置的剩余时间来过渡到中断发生后的状态。
Configure Animations 使您能够进一步定义过渡的细节。在 State Transition Settings 窗口中设置:
Start Time 到过渡开始前经过的毫秒时间。
Direction 判断过渡是否适用于从 Start State 到 End State 的过渡,或适用于两个状态的过渡:
Unidirectional 仅将过渡应用于从 Start State 到 End State 的过渡。
Bidirectional 将过渡应用于从 Start State 到 End State 的过渡,以及从 End State 到 Start State 的过渡。
Easing Function 设置定义过渡曲线的缓动函数。
使用缓动函数使 UI 元素更逼真。因为现实生活中的物体从不立即开始或停止,适当的缓动函数可以帮助您创造更愉悦的用户体验。
选择最适合的缓动函数。
将鼠标悬停在缓动函数的图像上查看其创建的动画类型。
Easing Mode 定义了如何将缓动函数应用于过渡:
Ease in 适用于过渡缓动函数。
Ease out 适用于过渡缓动函数的负值。
Ease in-out 适用于过渡的前半部分的缓动函数本身,以及过渡的后半部分的缓动函数的负值。
Transition Animations 使您能够为过渡使用自定义动画。请参阅 在状态迁移中使用自定义缓动函数。
设置特定状态之间的迁移¶
您可以在特定状态之间设置自定义过渡。您可以将状态添加到 State Transition Editor 画布,并配置它们之间的过渡设置。
要设置特定状态之间的迁移:
在 State Transition Editor 中右键单击,选择 Add State To Canvas,然后选择您要为其设置转换的状态。
要显示所有状态,右键单击并选择 Add All States To Canvas。
单击状态以选择它,然后单击 Default 转换以设置 Custom 转换。
将鼠标指针移动到
转换上,以查看转换的详细信息。在 State Tools 中,您可以看到在 State Transition Editor 中定义的转换。要编辑转换的设置,请单击该转换。
在状态迁移中使用自定义缓动函数¶
您可以使用动画为状态迁移定义自定义缓动函数。例如,定义一个自定义缓动函数,以便在进入该状态时使电话呼叫警报闪烁。
要在状态迁移中使用自定义缓动函数:
创建或选择使用状态管理器的节点。请参阅 使用状态机 或 教程:创建一个切换按钮。
例如:
创建一个 Image 节点,以显示提醒用户有来电的图像。
为 Image 节点创建一个状态管理器,该管理器具有一个包含状态 Default 和 Incoming Call 的状态组,并为每个状态添加和设置 Image 节点的 Opacity 属性的值:
对于 Default 状态,将其设置为 0。这样,当电话没有响铃时,您可以在 Default 状态下隐藏来电图像。
对于 Incoming Call 状态,将其设置为 1。这样,当电话响铃时,您可以在 Incoming Call 状态下显示来电图像。
创建一个 Animation 或 Animation Clip 资源。您使用此动画来更改您在上一步中创建的状态中使用的属性的值。请参阅 创建关键帧动画。
例如:在 Library > Animations > Animation Data 中创建一个 Animation,用于动画化节点的 Opacity 属性。您使用此动画使节点在进入 Incoming Call 状态时闪烁三次。
在 Node Tree 中选择您在第一步中创建的节点,并在 State Tools 中点击 Any -> Any 以打开 State Transition Settings。
在 State Transition Settings 集中:
Start State 到您想要从中进行动画过渡的状态。
例如,将其设为 Default。
End State 到您想要动画过渡到的状态。
例如,将其设为 Incoming Call。
在 State Transition Settings 的底部,点击
以添加过渡动画,并在 Transition Animations 中设置:将 Property Type 到您想要动画化的属性。
例如,将其设为 Opacity。
Kanzi Studio 在 Property Type 下拉菜单中仅显示在 Start State 和 End State 状态下具有不同值的属性。
Easing Function 到 Custom
将您在此过程的早期创建的动画应用到 Custom Animation。
例如,将其设为 Animation。
配置缓动函数¶
您可以在 State Transition Settings 中配置一些缓动函数,以定义设置过渡曲线的函数中的值。
您可以在 State Transition Settings 中配置的缓动函数有:
Back
使用 Amplitude 属性设置过渡曲线的振幅或深度。
Elastic
使用 Oscillations 属性设置过渡曲线中的振荡次数。
使用 Springiness 属性设置过渡曲线中振荡的弹性。
Exponential
使用 Exponent 属性设置过渡曲线相乘的幂指数。
Power
使用 Power 属性设置过渡曲线加速的速度。