Interactions
Jet Admin's Component Designer allows you to add interactions to layers, enhancing user engagement and functionality. Five types of interactions can be added to any layer:
Track Hover State:
Monitors the hover state of the layer, allowing you to change its appearance or behavior when a user hovers over it.
Track Pressed State:
Detects when a layer is pressed or clicked, enabling you to modify its appearance or trigger specific actions.
Click Action:
Defines an action to be performed when the layer is clicked, such as navigating to another page or executing a custom script.
Cursor:
Customizes the cursor style when hovering over the layer, enhancing the user interface and experience.
Text Selection:
Allows text layers to be selectable, enabling users to copy text from your application.
Usage Examples
Hover State:
Change the background color of a button when a user hovers over it to provide visual feedback.
Pressed State:
Trigger an effect when a button is pressed to simulate a realistic button press.
Click Action:
Set up navigation to a detailed view when an image or item is clicked.
Cursor:
Change the cursor to a pointer to indicate clickable elements or to a custom icon for specific interactions.
Text Selection:
Enable users to copy text from informational panels or data tables for convenience.
Implementation
To add interactions in Jet Admin:
Select the Layer:
Choose the layer you want to add an interaction to.
Choose Interaction Type:
Click on the interaction menu and select the desired interaction type (e.g., Track Hover State).
Configure Interaction:
Define the specific behavior or action for the interaction. For example, set the hover state to change the background color to a specific value.
Apply and Test:
Apply the interaction settings and test them to ensure they work as intended.
By utilizing these interactions, you can create a more interactive and engaging user interface in Jet Admin, improving the overall user experience.
Last updated