What is Lock Wheel Component
The Lock Wheel Component is an interactive component designed to provide a visually engaging way to select values from a rotatable wheel interface.
The wheel consists of customizable segments ranging from 2 to 12, each containing an inner and outer value. Users can rotate the wheel and click the “SELECT” button at the center to make a selection based on the position of the arrow. You can also choose different themes and customize the color of each theme.
How to Configure
This section will guide you through the configuration options available for the Lock Wheel Component
Settings
- Combination Codes: Enter up to 4 outer values to create combination codes (for example, ‘1, 4, 6, 7’).
- Slice 1 Value: Define slice 1 values in the format “Outer, Inner”.
- Slice 2 Value: Define slice 2 values in the format “Outer, Inner”.
- Slice 3 Value: Define slice 3 values in the format “Outer, Inner”.
- Slice 4 Value: Define slice 4 values in the format “Outer, Inner”.
- Slice 5 Value: Define slice 5 values in the format “Outer, Inner”.
- Slice 6 Value: Define slice 6 values in the format “Outer, Inner”.
- Slice 7 Value: Define slice 7 values in the format “Outer, Inner”.
- Slice 8 Value: Define slice 8 values in the format “Outer, Inner”.
- Slice 9 Value: Define slice 9 values in the format “Outer, Inner”.
- Slice 10 Value: Define slice 10 values in the format “Outer, Inner”.
- Slice 11 Value: Define slice 11 values in the format “Outer, Inner”.
- Slice 12 Value: Define slice 12 values in the format “Outer, Inner”.
- Theme: Choose from Theme 1, 2, or 3. Entering any other value will default to Theme 1.
- Theme 1 Primary Color: Customize theme 1 primary color.
- Theme 1 Secondary Color: Customize theme 1 secondary color.
- Theme 1 Tertiary Color: Customize theme 1 tertiary color.
- Theme 2 Primary Color: Customize theme 2 primary color.
- Theme 2 Secondary Color: Customize theme 2 secondary color.
- Theme 2 Tertiary Color: Customize theme 2 tertiary color.
- Theme 3 Primary Color: Customize theme 3 primary color.
- Theme 3 Secondary Color: Customize theme 3 secondary color.
- Theme 3 Tertiary Color: Customize theme 3 tertiary color.
Actions
- Reset Combination: Reset the combination
Triggers
- Value Selected: Triggered when select a value
- Combination Reset: Triggered when reset combination
- Match Success: Triggered when match success
- Match Failed: Triggered when match failed