XUI Docking Framework

This is a feature of Juice a.k.a. XUI 3

Features:

• MultiSplitLayout∞
• Minimize to sidebars
• Double click to maximize/zoom in
• Sliding Windows: popup preview windows
• Drag and drop panels
• Independant of XUI

∞

Usage:

• Mouse over the sidebar for a sliding window preview
• Move mouse out of preview to dismiss or click on other window
• Double click header to maximize view
• Drag and drop headers to move windows or dock into other areas
• Drag splitters to resize window
• Click minimize or close buttons on headers (on the active panel)
• Click header to activate window (if area contains multiple panels)

Get the full source code here∞.

The components of the docking framework are:

XDockingPanel
A panel for use in a docking framework. The panel is an area into which various content panels may be docked. These docked panels are displayed with a header containing a title, a dock/minimize button and optionally a close button. By clicking on the minimize button caused the panel to hide itself within the MultiSplitPane∞'s layout and add a button to the side bar if one has been specified.

Double clicking the header causes the panel to occupy the full area of its parent. An individual XDockingPanel can contain multiple child panels, each of which is given a separate header, similar to a tab in a tab pane. The header contains a button, which when clicked docks the panel to a sidebar. The header may also contain a highlight to indicate that it is selected/active.

XDockingSideBar
The dockable components are managed via the XDockable object which contains a collection of the participating objects, including the XDockingPanel, the XDockingSideBar that holds the minimized panel and the XDockableHeader that is used within this panel. The value of the dockable object's fields are set as the dockable panel's state is changed.

In docking a panel the panel is hidden and the sidebar is informed that it should assume ownership of the dockable. However the content/panel remains a child of this docking panel unless shown in a preview panel. In the preview the content is 'borrowed' by the preview panel, but when the preview panel is dismissed the content is restored to this instance of the docking panel.

XDockableHeader
This class represent the header that appears for each panel within an area of the multisplit layout. When multiple panels are docked into the same area each has a header and selecting the header will activate that panel, making it visible. The active panel also has a hightlighted strip on its top edge, plus close and minimize buttons. The minimize button minimizes the panel to the associated sidebar.

XDockingPreview
When the mouse hovers over a button on the sidebar a preview of the docked panel is displayed. In fact the preview temporarily reparents the window and displays it in the preview area, so it is actually live content rather than a 'preview'. The preview window disappears once the mouse exits the area of the preview window, unless the panel has input focus, in which case it remains in focus.

XCardPanel
When the header is double clicked the current panel is enlarged so that it occupies the entire area of the split pane. The parent of the split pane is embedded in a card layout and the active window is temporarily added to one of the panels in the card layout (the other being occupied by the multisplit panel). Double clicking the header restores the layout.

XDockable
The XDockable is an internal class used to manage the state of the dockable panel, maintaining references to the various objects that manipulate the panel.

XDockableTransferHandler
The XDockableTransferHandler is also an internal class used during drag and drop operations.

Setting up the Docking Framework
In XUI setting up the docking frameowrk is straightforward.

1 Set the startup class to

2 Set the split layout configuration in the framset file. The config follows the

3 Showing additional panels
To show an additional window or panel just add the constraints and properties to a Hashtable. The attributes are the same as those specified in the frames file.

Additional attributes that can be set via this interface of via the framset file described above include:

• canMinimize is the panela llowed to minimize?
• canClose can the panel be closed?
• canDock can a minimized version of the panel be docked back into the container?
• hasDockingTitle is the title of the panel displayed in the sidebar?

Styling the docking framework
The colors of the various elements and attributes of borders and some other elements can be controlled using so dedicated styles. An example set of styles is shown below:

Using the docking framework in a Swing application
The docking framework does not have any depenancies on the rest of the XUI framework and so it can be easily used in any Swing application. See the test application bundled with the modified MultiSplitLayout∞, and as XUI is open source you can also look at the source code of the XUI classes mentioned above to see how they interact with the docking framework.