WPF Windows 7 Explorer Toolbar Control

February 12, 2010 by Dave
 

Today I have been working on emulating the Windows 7 Explorer Toolbar in WPF.  I really like this control as it blends the older toolbar and menubar concepts into one which may support icons and dropdown menus.

WPF makes creating new controls quite easy.  I decided to base my controls off of System.Windows.Controls.Toolbar, and similarly each item in the Toolbar is based off of the Button control.

Here’s the XAML that I came up with

Creating a new WPF application and using this code for Window1.xaml, you should see this:

Note that while this control is visually similar to the Windows 7 Explorer Toolbar, it does not handle overflow, or collapse menu items like the Explorer one does. Perhaps an eventual update to this control will provide more advanced support.

This control does handle the IsMouseOver, IsMouseDown, and IsKeyboardFocused states.  Adding the menu glyph is a WPF Polygon.

Comments

2 Comments on WPF Windows 7 Explorer Toolbar Control

  1. Yuri on Mon, 3rd May 2010 5:38 pm

    2. Thanks a lot for your xaml template. I think doing the overflow menu in xaml is too cumbersome. Why not do it using code behind?

    A little example to get started, in order to hide the button when window is too small:
    private void ToolBar_SizeChanged(object sender, SizeChangedEventArgs e)
    {
    if (ButtonPreferences.TransformToAncestor(this).Transform(new Point(0, 0)).X + ButtonPreferences.ActualWidth > this.ActualWidth)
    ButtonPreferences.Visibility = Visibility.Hidden;
    else
    ButtonPreferences.Visibility = Visibility.Visible;
    }

  2. myro on Mon, 31st May 2010 9:51 am

    3. thank you sir!