State managers
Use the state managers to create different states in your application. For example, you can define the appearance and behavior of a button during different states, such as how the button reacts when a user selects, presses, holds, or releases the button. Kanzi uses its animation system to animate the transitions between states. See Animation system.
Each state manager consists:
- State groups. State groups contain states, define controller properties, and transitions between states in a state group. A typical transition defines a period and interpolation paths between property values of two states. You can define transitions using a general guideline for all properties, using interpolations for each property as specified, or even using animation items.
- States. Each state contains a collection of properties that define the appearance and behavior of the node to which you assign the state manager. In each state group only one state can be active at a time. A state can also define interactions either by enabling or disabling controls input using the enabled property, setting the state as a condition for the trigger in trigger settings, or by explicitly defining triggers and actions for each state.
- State objects. State objects define the properties of objects that are set under the parent object to which the state manager is assigned to. For example, you can assign a state manager to a button which contains a mesh that defines the look of the button. State object sets the properties of that mesh through the relative path using Target Object Path (./Mesh).
For example, a state manager for a button can contain three state groups: button pressed, button released, and hover over button. Each state group contains enabled and disabled states that through state objects define the appearance and behavior of the button when it is in one of the states, and the transition between the states.
You can define the changes between states by:
- Setting a controller property for the state group and a value for the property for each state. These can be implicit properties such as the Button.Pressed property of the button component nodes. When the property changes, whether as part of the component’s inherent logic or a specified set property action or animation, the state changes as well. See Using state managers.
- Using State Manager: Go to State action. You can use this alongside the controller property, however, when controller property changes, it overrides the previously set state.
Easing functions
Use an easing function to make UI elements more lifelike. Because objects in real life never start or stop immediately, the right easing function can help you create a more pleasant user experience. See Setting the transitions between states.
Hover over the image of the easing function to see the type of the animation it creates.
See also
Using state managers
Open topic with navigation