Welcome to Pete Brown's 10rem.net

First time here? If you are a developer or are interested in Microsoft tools and technology, please consider subscribing to the latest posts.

You may also be interested in my blog archives, the articles section, or some of my lab projects such as the C64 emulator written in Silverlight.

(hide this)

Overlaying Icons on the Windows 7 Taskbar with WPF 4

Pete Brown - 09 December 2009

The Windows 7 taskbar is more than just a place to hold icons for running and pinned applications. Among other things, you can use it to display the progress of a long-running operation and overlay informational icons to indicate a change in application state – the topic of this post.


Taskbar overlays can be used to show information to the user that is not critical in nature, but which may be interesting to them. For example, Outlook 2010 adds an envelope overlay when new mail arrives.

Fishbowl, the Facebook application for Windows, uses it to indicate how many new items have arrived.

Your own applications may want to use it to indicate new tasks in a queue, what long-running operation is being performed (when used along with the progress reporting), what screen the application is on (to help differentiate from other instances of the same application) etc.

Project Setup

Create a regular WPF 4 Windows application using Visual Studio 2010, and open up the xaml for the main window. I called my application WpfTaskbarIconOverlay.

Main Window

The main Window has two buttons and the TaskbarItemInfo declaration

<Window x:Class="WpfTaskbarIconOverlay.MainWindow"
        Title="WPF Taskbar Overlay Window"

        <TaskbarItemInfo />
        <StackPanel Width="120"
            <Button x:Name="AddOverlay"
                    Content="Add Overlay"
                    Margin="10" />
            <Button x:Name="RemoveOverlay"
                    Content="Remove Overlay"
                    Margin="10" />

The end result should look like this:


In the code-behind, wire up event handlers for the two buttons

public partial class MainWindow : Window
    public MainWindow()

        AddOverlay.Click += new RoutedEventHandler(AddOverlay_Click);
        RemoveOverlay.Click += new RoutedEventHandler(RemoveOverlay_Click);

    void RemoveOverlay_Click(object sender, RoutedEventArgs e)

    void AddOverlay_Click(object sender, RoutedEventArgs e)


Setting up the Overlay Images

The TaskbarItemInfo.Overlay property is of type ImageSource, so anything that can be represented as such may be used as an overlay. That includes both vector and bitmap content.

You can create the content in code, or, like most things in WPF, represent it in Xaml as a resource. We’ll add just a little more markup and code here to get the resources in place.

First, we’ll create the window resources in xaml. We won’t actually draw anything yet, just set up the resource. The Window.Resources section is a child of the Window, and is typically placed right after the <Window …> opening tag.

    <DrawingImage x:Key="OverlayImage">


Here’s the updated set of event handlers in the code-behind. Note that the AddOverlay button simply assigns the overlay from the resources, and the RemoveOverlay button nulls out the Overlay image.

void RemoveOverlay_Click(object sender, RoutedEventArgs e)
    TaskbarItemInfo.Overlay = null;

void AddOverlay_Click(object sender, RoutedEventArgs e)
    TaskbarItemInfo.Overlay = (ImageSource)Resources["OverlayImage"];

Next, we’ll overlay a couple types of image.

Overlaying Vector Drawings

The first image is a simple vector rectangle. I sized it at 16x16, but anything over that size will be scaled down to 16x16 assuming you have Windows 7 the default-sized icons and not the small ones. Overlays do not appear when using small icons.

    <DrawingImage x:Key="OverlayImage">
                    <GeometryDrawing Brush="Red">
                            <RectangleGeometry Rect="0 0 16 16"
                                               RadiusY="3" />


When you run the application, and click the “Add Overlay” button, you’ll see a red rounded rectangle fade in over the icon.

image image

Note that the shape retains its proper transparency

Overlaying PNGs

Overlaying PNGs is just as easy.

The first thing I did was locate some free 16x16 PNG icons, and plop one of them into the project, with its build action set to “Resource”


Next, I added it to the resources section of the window, keeping the same key as the previous drawing image

    <DrawingImage x:Key="OverlayImage">
            <ImageDrawing ImageSource="10.png"
                          Rect="0,0,16,16" />

That’s all you need to do. Since we used the base ImageSource class when casting in our code-behind, we don’t have to touch the code at all. When run, here’s what it looked like on my system:


Note that the “Rect” property of the ImageDrawing is required. If you leave it out, you won’t see any overlay icon on the taskbar.


I’ll have a video and source code for this example on windowsclient.net soon. Check back for the link when posted.

Update: The source and video may be found here.

posted by Pete Brown on Wednesday, December 9, 2009
filed under:        

9 comments for “Overlaying Icons on the Windows 7 Taskbar with WPF 4”

  1. Pete Brownsays:

    VB or C# source code? The C# source is right out of the recording. I save it off and then convert it to C# afterwards. The VB code should be fine, but it'll help to know which one you're playing with.

    I just downloaded both sets of source and run then in VS2010 Beta 2. Both worked on Windows 7 here.

    Do you see any overlay at all? When you click the "add overlay" button, do you see anything?

    Are you running with small icons? If so, you won't see overlays. You need to run the default size icons for that.

    If you're running any special theme software (like windowblinds or similar), that could mess it up too.

  2. Ajay Shankarsays:
    Thanx for the prompt Pete.

    I am using the same code as illustrated here in C#.
    I am just using the simple color without any icon. When I click on Add or Remove nothing happens...nothing is changing. I tried to create another button and tested messagebox.show("Test");
    its working. It means there is something wrong with my OS or My AntiVirus is blocking the changes.
    Dunno what's the reason.
    Still tryin...
  3. Pete Brownsays:
    You mentioned you're trying it with the solid color. I assume you're talking about the red rectangle in the sample.

    Did you spell the resource name correctly?

    Did it work with the ladybug icon? If you're not sure, download the sample again and run it to check.

  4. Window 7 iconssays:
    really a great efforts. i was facing some problem in vector overlay drawing(when click on add button it was not showing the same for which i create coding),but i got my mistake by matching my codes to your's.
    Thanks again to share .
  5. Shahnawazsays:
    Thanks for the article, I'm able to show up icon in the taskbar, now I want to move little bit advanced topic that I want to show dynamic numbers as the overlay icons just like Fishbowl you described above.

    How i can acheive this functionality?

    Thanks in advance.
  6. Petersays:
    I have the same problem as Ajay. When setting the Overlay property it just seems not to react. It does not react when i applied it to OverlayImage or OverlayImageVector.

    Resource names are correct and they are found. I download your C# sample with the ladybug and it does not work.

    I am using Win7 with WPF4.
  7. Petesays:
    @Ajay @Peter

    I can't see how antivirus or anything would block this; it's a core system function.

    Ajay, You are running Windows 7, right? Legit copy? (have to ask)


    Please put a try/catch block around the code in the event handler that sets the overlay icon, and let me know if there's an exception being thrown.


Comment on this Post

Remember me

3 trackbacks for “Overlaying Icons on the Windows 7 Taskbar with WPF 4”

  1. POKE 53280,0: Pete Brown's Blogsays:
    The Windows 7 taskbar has tons of ways that applications can surface unique information or capabilities
  2. Windows Client Newssays:
    In this session, Pete Brown shows us how to implement Windows 7 taskbar icon overlays using the native
  3. Windows Client Newssays:
    In this session, Pete Brown shows us how to implement Windows 7 taskbar icon overlays using the native