The Grouped Menu Control is a versatile navigation component that allows the creation of a well-organized menu. It effectively groups navigation items together based on shared categories, providing an organized and seamless user experience.
The Grouped Menu control simplifies the process of creating a navigation menu by automatically organizing menu items into logical groups. Instead of designing the groups separately, you can easily assign each menu item to its corresponding group, and the control will handle the rest. This allows for a seamless and efficient creation of the menu, streamlining the user interface development.
Utilizing the Grouped Menu Control
The Grouped Menu Control will then appear on the screen in the builder, you can then set all the above properties as per your requirements.
The Grouped Menu is mainly a navigation control and does not have any data binding. You simply specify the Page to navigate to and specify whether the screen would be validated on navigation. You need to make sure that you link the right screen based on the menu item. You would already be setting the properties for color settings on hovering the mouse over an item and color settings on selecting an item.
|The spacing between the two groups.
|The height of each individual item.
|The radius of the borders of each item. The border will have curved corners based on the radius.
|The indentation of the entire group, including its title and menu items.
|Menu Item Indentation
|The indentation of the menu items only. This is in addition to the Group Indentation property.
|Customize the size, weight (Light, Normal, Bold, Extra Bold, X Extra Bold), and color of the text of each menu item.
|Customize the size, weight (Light, Normal, Bold, Extra Bold, X Extra Bold), and color of the text of the title of each group.
|Set the size and color of the icon of each menu item.
|Toggle switch to display or hide the icon of each menu item.
|The background color that appears when you hover on a menu item.
|The color of the icons that appears when you hover on a menu item.
|The color of the text that appears when you hover on a menu item.
|The size, weight (Light, Normal, Bold, Extra Bold, X Extra Bold), and color of the selected text.
|The background color that appears for the selected text.
|The color of the icon for the selected text.
|Actions to add or delete items from the menu list.
|The label of the item added to the list.
|The name of the group to which the item belongs. Items with the same group name will be automatically displayed under that group.
|The action to navigate with or without validation of the selected form in the "Navigate To" property.
|Allows you to select the screen to navigate to upon selecting the action.
|The type of transition on navigation, such as Slide to Left, Slide to Right, Slide to Bottom, or Slide to Top.
|The icon to be used for the menu item.
|A toggle button to enable the item to be selected by default.
|Reset Target Screen
|A toggle to enable or disable resetting of target screens.