Click here to Skip to main content
15,887,350 members
Articles / Programming Languages / C#
Article

A Simple C# Toolbar Docking Framework

Rate me:
Please Sign up or sign in to vote.
4.88/5 (95 votes)
7 Sep 20043 min read 472K   6.8K   179   108
An example framework for toolbar handling, written in C#.

Sample Image - ToolBarDock.gif

Introduction

This code snippet includes a simple framework for handling docking toolbars. This framework includes support for:

  • floating/docking bars
  • changing layout of docked bars
  • double-click to switch from docked to floating and back
  • show/hide bar
  • right-click for bar view menu
  • disabling docking using the control key
  • handles any kind of control, not just toolbars

The code runs on Windows XP and VS .NET 2002, but should work on most .NET environments.

Background

The code was written while exploring the .NET framework. Although several toolbar handling implementations are available, I decided to have a go at writing my own. Nevertheless, I hope this article might be of use.

Using the code

Using the code is quite simple. Create a ToolBarManager object, giving it the form where the toolbars may be docked. This form would most likely be your application main form which would also keep the ToolBarManager as a member.

C#
_toolBarManager = new ToolBarManager(this);

The ToolBarManager handles all UI operations on the toolbars and it is also the only class the programmer will access. Adding toolbars is performed by invoking the AddControl method. Different versions of this method are available to allow more control over the positioning of the new toolbar.

C#
// Add toolbar (default position)
_toolBarManager.AddControl(_toolBar1);
// Add toolbar (floating)
_toolBarManager.AddControl(_toolBar2, DockStyle.None);
// Add toolbar (left)
_toolBarManager.AddControl(_toolBar3, DockStyle.Left);
// Add toolbar (left, on the left of _toolBar3)
_toolBarManager.AddControl(_toolBar4, DockStyle.Left, _toolBar3, DockStyle.Left);
// Add control
_toolBarManager.AddControl(_dateTimePicker, DockStyle.Bottom);

Other methods are also available to access the toolbars being handled by the ToolBarManager. Their use is rather straightforward:

  • public ArrayList GetControls() - Returns the set of all the added controls.
  • public bool ContainsControl(Control c) - Returns
    C#
    true
    
    if the control is included.
  • public void ShowControl(Control c, bool show) - Shows or hides the control.
  • public void RemoveControl(Control c) - Removes the control.

Points of Interest

The docking behavior is performed by four ToolBarDockArea controls that are added and docked to all four sides of the form. These controls simply perform specific layout handling and automatic resizing according to the controls that are added or changed.

To achieve dragging, the ToolBarManager handles mouse events on all controls added via AddControl. During drags, the ToolBarManager checks, according to the mouse position, if the dragged control should be placed on its own form (floating) or on any of the dock areas.

The control key events are handled via PreFilterMessage.

The appearance of the toolbar (the floating frame and the gripper) are user drawn in the ToolBarDockHolder user control.

History

A history file with detailed information is included in the download, here is a summary.

Version 1.0:
First version by Rogério Paulo.

Version 2.0:
Updates by Martin Müller (aka mav.northwind):

  • ToolBarManager c'tor now takes a ScrollableControl and a Form so that you can define an independent docking region and do not always have to use the form. The form itself is still needed as owner of floating toolbars, though.
  • ToolBarDockHolder now has a new property ToolbarTitle, allowing you to specify an independent name for a floating toolbar. The default is still the control's Text, but the Control.TextChanged event will no longer modify the title.
  • ToolBarDockHolder now has a new property AllowedBorders where you can specify which borders the toolbar is allowed to dock to.
  • ToolBarManager.AddControl() now returns the newly added ToolBarDockHolder, so that it's properties can be modified. The example now includes a MainMenu
  • Modified the size calculation for vertical toolbars with separators

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


Written By
Web Developer
Portugal Portugal
Rogério Paulo is a software engineer in the domain of industrial information technology since 1999.
He has been mainly involved in product development in the fields of SCADA, engineering toolsets, embedded systems, communication networks and industrial communication protocols.
www.rpaulo.com

Comments and Discussions

 
GeneralResizability of toolbar Pin
14-Dec-04 17:54
suss14-Dec-04 17:54 
QuestionIs there a way to save the layout? Pin
optikflux13-Nov-04 11:35
optikflux13-Nov-04 11:35 
AnswerRe: Is there a way to save the layout? Pin
Rogério Paulo14-Nov-04 22:29
Rogério Paulo14-Nov-04 22:29 
QuestionRe: Is there a way to save the layout? Pin
balakrishna.10-Jan-07 22:44
balakrishna.10-Jan-07 22:44 
AnswerRe: Is there a way to save the layout? Pin
jonh19-Mar-05 23:44
jonh19-Mar-05 23:44 
GeneralRe: Is there a way to save the layout? Pin
David Herpin20-Nov-09 8:26
David Herpin20-Nov-09 8:26 
GeneralGood work and Congratulation Pin
Pham Ngoc Quyen9-Nov-04 16:26
Pham Ngoc Quyen9-Nov-04 16:26 
QuestionComments - grey? Pin
JamesA_Dev29-Oct-04 1:13
JamesA_Dev29-Oct-04 1:13 
Where does the horrible dark grey bar come from when the toolbars are floating?
Is it from the system colours/xp themes or is it hard coded?
Shouldn't it be the same blue as the main example window?

When you right-click a toolbar it should only show relevant options for that particular toolbar shouldn't it? I don't think it should show options for all toolbars, this should be left to the option on the menu.
AnswerRe: Comments - grey? Pin
Almighty Bob1-Dec-04 12:40
Almighty Bob1-Dec-04 12:40 
GeneralA little bug, but great work! Pin
mbelli26-Oct-04 22:03
mbelli26-Oct-04 22:03 
GeneralRe: A little bug, but great work! Pin
merkuriev_sergey22-Feb-05 4:13
merkuriev_sergey22-Feb-05 4:13 
GeneralSolution Pin
merkuriev_sergey23-Feb-05 11:45
merkuriev_sergey23-Feb-05 11:45 
GeneralDesign issue: Main window gets inactive Pin
TeisDraiby27-Sep-04 16:34
TeisDraiby27-Sep-04 16:34 
GeneralRTL for the toolbar Pin
Anonymous25-Sep-04 5:59
Anonymous25-Sep-04 5:59 
Generalnice! Pin
NicoRi13-Sep-04 20:22
NicoRi13-Sep-04 20:22 
Generalsmall bug and minor changes Pin
Oscar Cubo11-Sep-04 23:55
Oscar Cubo11-Sep-04 23:55 
GeneralRe: small bug and minor changes Pin
Duong Tien Nam3-Jan-05 20:57
Duong Tien Nam3-Jan-05 20:57 
GeneralGreat article! Pin
NJDotNetGuy11-Sep-04 7:24
NJDotNetGuy11-Sep-04 7:24 
QuestionHow to create a autofill toolbar like of google Pin
akszn8-Sep-04 23:22
akszn8-Sep-04 23:22 
AnswerRe: How to create a autofill toolbar like of google Pin
ThaNerd13-Sep-04 21:50
ThaNerd13-Sep-04 21:50 
GeneralA small bug. Pin
Jan van den Baard8-Sep-04 8:04
professionalJan van den Baard8-Sep-04 8:04 
GeneralMinor fix Pin
Rogério Paulo2-Sep-04 23:21
Rogério Paulo2-Sep-04 23:21 
GeneralGood work and congratulations Pin
Antonio Barros2-Sep-04 9:35
professionalAntonio Barros2-Sep-04 9:35 
GeneralRe: Good work and congratulations Pin
Hugo Pais Batista4-Sep-04 14:56
Hugo Pais Batista4-Sep-04 14:56 
GeneralRe: Good work and congratulations Pin
Laudeci Oliveira8-Sep-04 7:22
Laudeci Oliveira8-Sep-04 7:22 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.