Tabbed MDI

The new Tabbed MDI Layout is one of the most useful extensions added to the PPJ Framework. When turned on, any MDI application is turned into a modern tabbed user interface, making the look & feel of the application easier to use and modern.

A traditional looking MDI application like the one shown below can immediately become a modern application just by setting a single property.

Standard MDI Layout

New Tabbed MDI Layour with Thumbnails

How to use the Tabbed MDI component

We added a new property TabbedMdi to the SalMDIWindow and SalRibbonBarMDI classes. Therefore any existing migrated application will inherit this property. It can be set at design time or at runtime and can also be changed dynamically.

It's enough to enable it by setting the TabbedMdi.Enabled property to true.

Additional settings are:

CloseButtonStyle

Supports AllTabs, ActiveTabs, Header, AllTabsAndHeader, ActiveTabAndHeader. This property controls where the X close button(s) are showed.

ShowIcons

Turns on or off the icons in the tabs. Icons are taken from the form but can be changed programmatically.

ShowThumbnails

When enabled the component is able to show a stunning thumbnails page with the reduced image of all the open MDI Child forms. Notice that this feature is suppressed for Windows versions prior to XP.

ThumbnailsSize

Sets the size of the thumbnail. 100 means that the entire form is scaled. 50 means that half of the form starting from the top-left corner is scaled. Any value up to 100 is valid.

Renderer (not visible in designer, can only be set programmatically)

Currently we have implemented two different renderers: TabbedMdi.DefaultRenderer and TabbedMdi.FlatRenderer. These are the classes that are responsible for measuring and drawing the tabs and the buttons. You can define your own custom renderer by deriving and extending TabbedMdi.RendererBase or one of the two renderers that we have already implemented.

To change renderer use this syntax:

this.TabbedMdi.Renderer = new TabbedMdi.FlatRenderer();

To reset to the default renderer set the property to null.

Programmatic Interface and additional features

There are a number of additional aspects of the tabbed interface that you can handle from your code by retrieving the Page associated with a Mdi Child form.

TabbedMdi.Page page = this.TabbedMdi.GetTabPage(mdifrmCustomer);
page.Glyph = lockedImage16x16;

The code snippet above shows how to add a glyph image to an existing tab. Glyphs are small (16x16) icons that are displayed to the right side of the tab. For example, you can show a small lock if the content of the form is locked and cannot be saved.

Additional features that you can handle using the Page component are:

Enabled

Enables/Disables the tab.

Background

Changes the background color of the tab, if the renderer supports it.

Glyph

Adds a 16x16 icon to the right side of the tab.

Visible

Hides/Shows the tab (and related form).