Anatomy of a WebDock

A WebDock control is the outmost control that all WebDock components reside in. Usually, a WebDock control fitting the browser window is used to layout all visual elements in a web application (like the main window of a desktop application).

There is one main content area and zero or more dock panels for displaying information. Each dock panel can dock to one of the 4 edges of the WebDock control. The main content area will fill up the space left behind by the dock panels. Like a classic ASP.NET panel, the main content area and dock panels accept any HTML content and ASP.NET controls.

A dock panel is normally visible (or pinned). Users can click the Auto Hide button on the title bar of a dock panel to (auto-)hide that panel. When a dock panel is auto-hidden, the panel itself is invisible, but its tab icons and titles will be shown in a corresponding dock bar. (E.g. if the dock panel is docked to the left edge of the WebDock control, its tab icons and titles will be shown in the left dock bar.) The dock panel will slide open when the mouse cursor is over its icons or titles. A dock bar will only be shown if one or more associated dock panels are autohidden.

Dock panel groups can be used to group related dock panels so as to create a sophisticated layout.

Splitter bars will be displayed in-between panels for users to resize the panels.

Each dock panel contains one or more tabbed panels, and one active tabbed panel will be visible. A tab strip is availale at the bottom of the dock panel for users to switch between tabbed panels. The title and content of the active tabbed panel is displayed in the title bar and content area respectively.

Action buttons are displayed for users to change the panel's state. Developers can specify what actions are allowed for each dock panel.