Binding Menu Data to the Menu Bar Widget
The menu bar supports multiple data inputs for the following sections:
• Primary navigation—The top-level menu items that are displayed at the top of the menu bar. These items are configured using menu data.
• Secondary navigation—The top-level menu items that are displayed above the footer. These items are configured using menu data.
• Footer—A section at the bottom of the menu bar that contains an icon, text, and links to a URL. This section is configured using widget properties. For more information, see Defining the Footer Section.
You can configure the type of data source to use for the Menu Bar widget using the DataSource property. There are two options to define the menu items:
• Infotable (default)—Using an infotable from a data service.
• Menu Entity—Using Menu entities in Composer.
Using a Menu Entity
1. Select a Menu Bar widget on the canvas or using the Explorer panel.
2. On the Properties panel, set the DataSource property to Menu Entity.
3. In the PrimaryNavMenu property, select a Menu entity from the server.
4. To display secondary navigation items, select a Menu entity for the SecondaryNavMenu property.
Optionally, define the footer section using widget properties.
5. Click Save, then View Mashup.
The menu items are displayed at run time.
Using an Infotable
You can bind data from any infotable that is formatted using the MenuEntry Data Shape. Use the Data panel to add a Thing with a data service for the menu bar.
For more information, see Defining the Menu Bar Items Using an Infotable.
1. On the Data panel, add a data service that returns an infotable with the menu item data to display.
2. Bind the All Data property of the data service to the PrimaryNavData widget property.
3. Bind an event, such as the mashup Loaded property, to execute the menu data service at run time.
4. To display secondary items on the menu bar, repeat steps 1 through 3 for the SecondaryNavData widget property.
Optionally, define the footer section using widget properties.
5. Click Save, then View Mashup.
The data service is executed at run time and the menu bar items are displayed.
Defining the Footer Section
You can use the footer section to display general information such as company branding, the application name, or the name and profile icon of the current user. To configure the footer section, use the following widget properties:
• FooterText—Specifies the text to display in the footer section.
• FooterURL—The URL to redirect users to after they click the footer section.
• FooterIcon—Specifies the Media entity to use for the footer icon. The icon is permanently displayed in all menu types and cases. A fallback icon is displayed when this property is empty.
• FooterLinkTargetWindow—Controls how the footer links opens. You can open the URL in the current or in a new browser window.
• HideFooter—Enables you to show or hide the footer section.
• FooterLogo—Specifies the Media entity to display in the footer area when the menu is open. The FooterIcon property is used when the menu bar is in compact mode.
 |
This property is only available in ThingWorx 9.3 or later.
|