│ Grooper Help - Version 25.0
25.0.0017 2,127
  • Overview
  • Help Status

Tab List

Control GrooperReview.Controls

Displays a horizontal or vertical list of tabs, allowing users to switch between multiple views, panels, or data sets in the Grooper UI.

Remarks

The Tab List control provides an intuitive tabbed navigation interface for organizing and accessing related content within the Grooper web client. Tabs are commonly used to separate different sections, panels, or data grids, enabling users to quickly switch between views without leaving the current page.

UI Components

  • Tab Bar:
    • Displays a row (or column) of tabs, each representing a distinct view, panel, or data set.
    • The active tab is visually highlighted, while inactive tabs are clickable for navigation.
  • Tab Content Area:
    • Shows the content associated with the selected tab.
    • Content may include forms, grids, property editors, or custom controls.
  • Tab Controls:
    • Tabs may include icons, tooltips, and close buttons for enhanced usability.
    • Keyboard navigation and accessibility features are supported.

Interactive Features

  • Tab Selection:
    • Click a tab to activate its content area.
    • Use keyboard shortcuts to cycle through tabs: Ctrl + Tab (next), Ctrl + Shift + Tab (previous).
  • Tab Management:
    • Tabs may be dynamically added, removed, or reordered based on user actions or workflow requirements.
    • Some implementations support closing tabs or opening new ones via context menu commands.
  • Accessibility:
    • Tabs are fully navigable by keyboard and screen reader.
    • Tooltips and icons provide additional context for each tab.

Usage Scenarios

  • Multi-Panel Navigation:
    • Switch between different data grids, property editors, or configuration panels.
  • Workflow Organization:
    • Group related tasks or views under separate tabs for efficient workflow management.
  • Custom Views:
    • Present user-defined or dynamically generated content in tabbed format.

Example

┌───────────── Tab List ─────────────┐  
│ {General} {Details} {History}      │  
│ ────────────────────────────────── │  
│   Content for selected tab         │  
└────────────────────────────────────┘

Used By

Design Tab Host

Notification