Introduction
When I started working on porting an MFC / WTL based project to Windows Forms, I encountered troubles using the ToolStrip
control. In MFC / WTL, CToolBar
(CToolBarCtrl
in WTL) objects allowed you to specify three different sets of CImageList
objects for the different states of buttons on toolbars. Also, the CImageList
itself can be created from a single bitmap that contains a strip of icons for the toolbars. After digging through various methods and properties, I was finally able to accomplish this using Windows Forms. The source code itself is pretty straightforward.
In Windows Forms, ToolStrip
objects expose a single property to assign ImageList
objects. However, they do not expose properties for adding multiple ImageList
s that will be used to indicate various states of the toolbar buttons like “MouseHover / Hot”, “Disabled”, etc. To accomplish this, we have to handle the “Mouse Enter” and “Mouse Leave” events on the individual toolbar buttons (ToolStripButton
s) and change their ImageIndex
property to point to the corresponding “state bitmap”.
Using the code
Here are the various objects used in this sample code snippet:
Form
- mySampleForm
ToolStrip
– mySampleToolStrip
ImageList
- mySampleImageList
ToolStripButton
(s) - mySampleToolStripButton1
(this example handles four buttons 1 - 4)
Step 1:
Add a handler for the “mySampleForm
Load” event. In the handler, load the “Regular Bitmap Strip” and the “Hover / Hot Bitmap Strip” into two separate Bitmap
objects.
Add the two Bitmap
objects into the ImageList
by calling the AddStrip
method twice. This will add both the regular and the hot bitmaps into the ImageList
. If there are four images in the bitmap (corresponding to the four toolbar buttons), then the ImageList
object will contain eight images, with the first four indicating the “Regular State” and the next four denoting the “Mouse Hover State”.
Specify the ImageIndex
for the ToolStripButton
s so that they point to the corresponding “Regular State Images”.
private void mySampleForm_Load(object sender, EventArgs e)
{
mySampleImageList.ImageSize = new Size(24,24);
Bitmap image1 = new Bitmap("<Regular Bitmap File >");
Bitmap image2 = new Bitmap("<Hover or Hot Bitmap File>");
mySampleImageList.AddStrip(image1);
mySampleImageList.AddStrip(image2);
mySampleToolStrip.ImageList = mySampleImageList;
mySampleToolStripButton1.myToolStripButton1.ImageIndex = 0;
mySampleToolStripButton2.myToolStripButton1.ImageIndex = 1;
mySampleToolStripButton3.myToolStripButton1.ImageIndex = 2;
mySampleToolStripButton4.myToolStripButton1.ImageIndex = 3;
}
Step 2:
Add a handler for the “Mouse Enter” event for any ToolStrip
button. Note that you can add a common handler that can handle the “Mouse Enter” events for all the ToolStrip
buttons. In this event handler, verify that the object sender
corresponds to a ToolStripButton
, by using is
keyword (which internally uses dynamic casting and checking the object for null
). Modify the ImageIndex
property of the ToolStripButton
so that it points to the disabled image index. Note that I am “adding four” to the index, because in my sample there are four toolbar buttons.
private void mySampleToolStripButton_MouseEnter(object sender, EventArgs e
{
if (sender is ToolStripButton)
{
if (((ToolStripButton)sender).ImageIndex < 4)
((ToolStripButton)sender).ImageIndex += 4;
}
}
Step 3:
Add a handler for the “Mouse Leave” event of the ToolStripButton
. This handler will look similar to the MouseEnter
handler, except that you need to modify the ImageIndex
property differently.
private void mySampleToolStripButton_MouseLeave(object sender, EventArgs e)
{
if (sender is ToolStripButton)
{
if (((ToolStripButton)sender).ImageIndex >= 4)
((ToolStripButton)sender).ImageIndex -= 4;
}
}
Points of interest
Changing the ImageIndex
of a specific button on a toolbar has never been easier.
History
First draft.
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.