10 - Adding a tabbed container widget, part 1

📖 Task Introduction

You can use Layout Widgets to add organization and structure to your object view. In this exercise, you’ll create a container on your Overview tab to arrange widgets that describe the passengers affected by this flight alert.

Although each layout configuration is distinct, you'll be implementing a Tabbed Container widget because it is simple and representative.

🔨 Task Instructions

1. In edit mode, click on your Overview tab.

2. Delete the (default) widgets below your property cards—the Properties widget and the links widget—by clicking the Delete button in the top right of each.

3. Under your property cards, click the light gray ——— ➕ Add widget ———. From the list, find and add a Tabbed Container widget.

4. In the widget configuration panel, click ⊕ Add Tab.

5. In the block that appears, click the Select Section link.

6. Choose a Property Cards widget from the widget selector. Notice that when applying the widget in a container that the widget configuration appears as a window in the center of your screen.

7. Add two cards, applying formatting and icons as desired.

   • A Count aggregation of the number of linked passengers. (Note: You'll have to select a property of the linked passenger object in order to be able to select an aggregation.)
   • A Sum aggregation of the total number of flights (i.e., flown by each passenger).

8. Improve the formatting by doing the following:

   • In the property card widget configuration’s Settings tab, set the number of columns to 2.
   • In the property card widget configuration’s Format tab, change the Title to Passenger Statistics.

9. Save your widget configuration and your object view.