Most of the native Windows Programmers are familiar with GDI, the graphics API provided under Windows. GDI is widely used in windows applications. Later, Microsoft had introduced class-based, better services through GDI+ under Windows. Both Native programmers and Managed developers are making use of GDI/GDI+ classes and APIs.

But GDI was too old and was introduced with the initial versions of the Windows and over the time the capabilities of graphics hardware has grown and so does the demand for creating Visually Rich UI. With Windows 7, Microsoft has introduced a totally revamped 2D graphics subsystem called Direct2D based on their prominent Direct3D platform to create high quality 2D rendering. If you know or not, Windows Aero system is already taking advantage of graphics hardware since Windows Vista. This is supposed to replace the GDI APIs in the coming years. Direct2D is not only available under Windows 7 but Microsoft has made it available in Window Vista with the latest service pack upgrade.

The major advantages of the Direct2D APIs are it’s hardware accelerated and provides high quality 2D rendering. It enables the user to create visually rich applications by paying less effort, when comparing to conventional APIs .

GDI uses Pixel graphics but Direct2D can supports vector graphics as well, in which mathematical formulas are used to draw the lines and curves. Vector graphics provides high quality rendering independent of resolution of the device, while the pixelated graphics has dependency with resolution which may results in choppy graphics.

Most of the GDI APIs are not using anti-aliasing and transparency. Ofcrouse there are functions to do so but always there’s programming cost for taking advantage of these features. Also if we apply transparency and anti-aliasing, the computations are done using CPU. Direct2D can take advantage of graphics hardware and delegate the computationally intensive tasks to GPU.

Direct2D built on top of Direct3D components. The layered architecture is described below

You can see the underlying layers are Direct3D which make use of DXGI(DirectX Graphics Infrastructure), which manages the low level graphics related tasks that are independent of DirectX graphics runtime. DXGI provides common framework for graphics components. Simultaneously a high performance software rasterizer is available when the hardware acceleration is not possible. Another advantage of Direct2D API is, it’s using lightweight COM. It’s almost like simple C++ class. No BSTRS, COM Variants, Interfaces, Apartments etc.

Let’s start analyzing a simple Direct2D Program

There are 3 main components inevitable for enabling D2D rendering your application.

• A rendering Window and its handle (HWND)
• ID2D1Factory object to create the Direct2D resources
• ID2D1HwndRenderTarget object to draw the scene on the window.

The below example provides steps for enabling Direct2D Rendering in your MFC Application. It’s hard to describe the parameters of all APIs. Please refer them in MSDN.

Create your Window

Here I’m taking a dialog based application for rendering. The functions and messages may change if you’re using any other type of applications like SDI or MDI. No need to reinvent the wheel, allow the wizard to create your main dialog.

Prepare your Rendering Engine

Let’s delegate all the rendering tasks to another class instead of managing everything in the dialog class. I call this class as Direct2DHandler.

The Direct2DHandler declaration goes like below and it exposes the following functions.

#pragma once
#include <d2d1.h>
#include <d2d1helper.h>

class Direct2DHandler
{
public:
	Direct2DHandler( HWND hWnd ); // ctor
	~Direct2DHandler(void); // dtor
	HRESULT Initialize(); // Initialize the rendering
	HRESULT OnRender(); // Called from OnPaint function
	void OnResize(UINT width, UINT height);

private:
	HRESULT CreateDeviceResources(); // Create resources for drawing
	void DiscardDeviceResources(); // Release resources for drawing

private:

	HWND					m_hWnd;
	ID2D1Factory*			m_pDirect2dFactory;
	ID2D1HwndRenderTarget*	m_pRenderTarget;
	ID2D1SolidColorBrush*	m_pLightSlateGrayBrush;
	ID2D1LinearGradientBrush* m_pLinearGradientBrush;
};

The constructor

does nothing other than calling CoInitialize() function and initialize the member variables( mostly to NULL).

The Initialize function

creates the Direct2D factor object, which similar the HDC (context variable) in GDI.

HRESULT Direct2DHandler::Initialize()
{
    HRESULT hr = S_OK;

    // Create a Direct2D factory.
    hr = D2D1CreateFactory(D2D1_FACTORY_TYPE_SINGLE_THREADED, &m_pDirect2dFactory);

    return hr;
}

OnResize

function handles the rendering area for the render target. We will be using whole window area in this example.

void Direct2DHandler::OnResize(UINT width, UINT height)
{
    if (m_pRenderTarget)
    {
        // Note: This method can fail, but it's okay to ignore the
        // error here, because the error will be returned again
        // the next time EndDraw is called.
        m_pRenderTarget->Resize(D2D1::SizeU(width, height));
    }
}

OnRender

function does the following

1. Create the device resource for drawing (if not created)
2. Render the scene to the Window
3. Release the resources if error occurred

If you’re experienced 3D programming probably you might be knowing about the role of matrix and how the affects the rendering object. The matrix can be used for representing the objects coordinates system. We can apply rotation, translation (movement) etc (collectively called transformation). on a matrix and this can be used for specifying how object must be rendered. Here we’re using D2D1::Matrix3x2F::Identity() helper function which creates an identity matrix(object will be rendered at origin without any transformation)

m_pRenderTarget->SetTransform(D2D1::Matrix3x2F::Identity());

We can clear the rendering area with a default color (as the dialog background filled with some default color according to Window’s theme. Here I selected white color

m_pRenderTarget->Clear(D2D1::ColorF(D2D1::ColorF::White));

The important thing is, whatever you draw for the scene must be done between BeginDraw() and EndDraw() APIs. The other part of this code is simply straight forward and you can easily grasp it. See the source below.

HRESULT Direct2DHandler::OnRender()
{
	HRESULT hr = S_OK;

	hr = CreateDeviceResources();

	if (SUCCEEDED(hr))
	{
		m_pRenderTarget->BeginDraw();
		m_pRenderTarget->SetTransform(D2D1::Matrix3x2F::Identity());
		m_pRenderTarget->Clear(D2D1::ColorF(D2D1::ColorF::White));
		D2D1_SIZE_F rtSize = m_pRenderTarget->GetSize();
		// Draw a grid background.
		int width = static_cast<int>(rtSize.width);
		int height = static_cast<int>(rtSize.height);

		// Draw two rectangles.
		D2D1_RECT_F rectangle1 = D2D1::RectF(
			rtSize.width/2 - 50.0f,
			rtSize.height/2 - 50.0f,
			rtSize.width/2 + 50.0f,
			rtSize.height/2 + 50.0f
			);

		D2D1_RECT_F rectangle2 = D2D1::RectF(
			rtSize.width/2 - 100.0f,
			rtSize.height/2 - 100.0f,
			rtSize.width/2 + 100.0f,
			rtSize.height/2 + 100.0f
			);

		// Draw the outline of a rectangle.
		m_pRenderTarget->FillRectangle(&rectangle2, m_pLinearGradientBrush);

		// Draw a filled rectangle.
		m_pRenderTarget->FillRectangle(&rectangle1, m_pLightSlateGrayBrush);

		hr = m_pRenderTarget->EndDraw();

	}
	if (hr == D2DERR_RECREATE_TARGET)
	{
		hr = S_OK;
		DiscardDeviceResources();
	}
	return hr;
}

CreateDeviceResources

is slightly a lengthy function to initialize the required resources for rendering, like we create pens, brushes, bitmaps etc. Here mainly I’m creating a light colored solid brush and linear gradient brush to render as depicted in above picture. The comments are inlined and please read it along with the code. It will be interesting to learn about gradient brushes. If you’ve created a gradient brush in photoshop things will be far more easy. We can put stop spots to controls the end of gradients also line can be used for representing flow and angle for the gradient. Simple isn’t it? Like we create a normal gradient. See the code below.

HRESULT Direct2DHandler::CreateDeviceResources()
{
    HRESULT hr = S_OK;

    if (!m_pRenderTarget)
    {
        RECT rc;
        GetClientRect(m_hWnd, &rc);

        D2D1_SIZE_U size = D2D1::SizeU(
            rc.right - rc.left,
            rc.bottom - rc.top
            );

        // Create a Direct2D render target.
        hr = m_pDirect2dFactory->CreateHwndRenderTarget(
            D2D1::RenderTargetProperties(),
            D2D1::HwndRenderTargetProperties(m_hWnd, size),
            &m_pRenderTarget
            );

        if (SUCCEEDED(hr))
        {
            // Create a gray brush.
            hr = m_pRenderTarget->CreateSolidColorBrush(
                D2D1::ColorF(D2D1::ColorF::LightSlateGray),
                &m_pLightSlateGrayBrush
                );
        }

		// Create an array of gradient stops to put in the gradient stop
		// collection that will be used in the gradient brush.
		ID2D1GradientStopCollection *pGradientStops = NULL;

		D2D1_GRADIENT_STOP gradientStops[2];
		gradientStops[0].color = D2D1::ColorF(D2D1::ColorF::Maroon, 1);
		gradientStops[0].position = 0.0f;
		gradientStops[1].color = D2D1::ColorF(D2D1::ColorF::Red, 1);
		gradientStops[1].position = 1.0f;
		// Create the ID2D1GradientStopCollection from a previously
		// declared array of D2D1_GRADIENT_STOP structs.
		hr = m_pRenderTarget->CreateGradientStopCollection(
			gradientStops,
			2,
			D2D1_GAMMA_2_2,
			D2D1_EXTEND_MODE_CLAMP,
			&pGradientStops
			);
		// The line that determines the direction of the gradient starts at
		// the upper-left corner of the square and ends at the lower-right corner.

		if (SUCCEEDED(hr))
		{
			hr = m_pRenderTarget->CreateLinearGradientBrush(
				D2D1::LinearGradientBrushProperties(
				D2D1::Point2F(0, 0),
				D2D1::Point2F(300, 300)),
				pGradientStops,
				&m_pLinearGradientBrush
				);
		}

    }

    return hr;
}

DiscardDeviceResources

Just releases the allocated resouces. It simply uses helper macro SafeRelease described below the code.

void Direct2DHandler::DiscardDeviceResources()
{
    SafeRelease(&m_pRenderTarget);
    SafeRelease(&m_pLightSlateGrayBrush);
    SafeRelease(&m_pLinearGradientBrush);
}

template<class Interface>
inline void SafeRelease(
    Interface **ppInterfaceToRelease
    )
{
    if (*ppInterfaceToRelease != NULL)
    {
        (*ppInterfaceToRelease)->Release();

        (*ppInterfaceToRelease) = NULL;
    }
}

Initializing Rendering in Dialog class

In the

OnInitDialog function,

allocate memory for the Direct2DHandler class and Initialize it. You can call this from OnCreate function as well but ensure that there’s a valid Window handle is there.

m_pRender = new Direct2DHandler( m_hWnd );
m_pRender->Initialize();

Disable Default Background Drawing

Disable the default OnErasBkgrnd function because it may cause flickering while drawing. Also we’re occupying full client area in the dialog and the background is clearing is OnRender function itself.

BOOL CDirect2DDemoDlg::OnEraseBkgnd(CDC* pDC)
{
    return FALSE;//CDialogEx::OnEraseBkgnd(pDC);
}

OnSize (WM_SIZE)

function handles the Window size events. It will resize render target according to the Window Size.

void CDirect2DDemoDlg::OnSize(UINT nType, int cx, int cy)
{
    CDialogEx::OnSize(nType, cx, cy);
    if( m_pRender )
        m_pRender->OnResize( cx, cy );
}

OnPaint function

calls OnRender function of Direct2DHandler to draw the scene.

void CDirect2DDemoDlg::OnPaint()
{
    if (IsIconic())
    {
        // code for handling when window is minimized. Check original CPP file attached.
    }
    else
    {
        // CDialogEx::OnPaint(); no need to call this.
        if( m_pRender )
            m_pRender->OnRender();
    }
}

Linking

The Application must link to d2d1.lib through project settings or using #pragma comment( lib, “d2d1.lib” ) in the source file

d2d1helper

d2d1helper.h contains some useful functions to help the drawing. See the header for more details.

OK that’s the basics of creating Direct2D rendering for your Windows Application. Go ahead with the attached source code.

The project file is in Visual Studio 2010 format, but basically you only need to have Direct2DHandler class. You can also use other prior version of Visual Studio with Windows 7/Vista SDK.

Note: Take whole responsibility of downloading and executing the code shared here. Don’t sue me. It was virus free, malware free when I uploaded.

Download Demo Source code

In the last installment, we’ve seen using the basic version of task dialog. But usually when we see the task dialogs in Windows Vista or 7, it’s more detailed and can have flashy icons etc. Let’s see how to take more control over the task dialogs.

TaskDialogIndirect function can be used to have more options with task dialogs. TASKDIALOGCONFIG structure is used along with TaskDialogIndirect API.

As you’re seeing above the task dialog contains different type of controls, icons and capable of displaying more information to the user. It can have lengthy big buttons, radio buttons, checkbox, footer area, progressbar, custom icon, displaying predefined buttons like OK, Cancel, Yes, No etc. even we can have control over the buttons in the titlebar( minimize, maximize button etc)

The following code describes creating a task dialog with more flexible options. User can specify the callback functions which can be used to control the behavior if the controls and contents in the task bar. Filling the TASKDIALOGCONFIG structure is simple and straight forward as we’re seeing the code. The detailed option can be obtained from MSDN page.

HRESULT CALLBACK CTaskDialogSampleDlg::TaskDialogCallbackProc(
  __in  HWND hwnd,
  __in  UINT uNotification,
  __in  WPARAM wParam,
  __in  LPARAM lParam,
  __in  LONG_PTR dwRefData
)
{
	if( TDN_CREATED == uNotification )
	{
		::SendMessage( hwnd, TDM_SET_BUTTON_ELEVATION_REQUIRED_STATE, IDOK, TRUE );
		::SendMessage( hwnd, TDM_SET_PROGRESS_BAR_RANGE, 0, 100 );
	}
	else if( TDN_HYPERLINK_CLICKED == uNotification )
	{
		ShellExecute( 0, L"open", (LPCTSTR) lParam, 0, 0, SW_SHOW );
	}
	else if( TDN_TIMER == uNotification )
	{
		static int i = 0;
		::SendMessage( hwnd, TDM_SET_PROGRESS_BAR_POS, i++,0 );
	}

	return 0;
}

void CTaskDialogSampleDlg::OnBnClickedButton1()
{
	int nButtonPressed                  = 0;
	TASKDIALOGCONFIG config             = {0};
	const TASKDIALOG_BUTTON buttons[]   = {
		{ IDOK, L"Elevate Privilege" },
		{ IDCANCEL, L"Run with user privilege" }
	};

	const TASKDIALOG_BUTTON radiobuttons[] = {
		{ IDCANCEL, L"Test Radio" }};
	config.cbSize                       = sizeof(config);
	config.hInstance                    = AfxGetApp()->m_hInstance;
	config.dwCommonButtons              = TDCBF_OK_BUTTON | TDCBF_CANCEL_BUTTON;
	config.pszMainIcon                  = TD_SHIELD_ICON;
	config.pszMainInstruction           = L"Main Instruction";
	config.pszContent                   = L"This is the content.";
	config.pszVerificationText          = L"Conifirm license agreement";
	config.pButtons                     = buttons;
	config.cButtons                     = ARRAYSIZE(buttons);
	config.pRadioButtons				= radiobuttons;
	config.cRadioButtons				= ARRAYSIZE( radiobuttons );
	config.dwFlags						= TDF_SHOW_PROGRESS_BAR |
		TDF_EXPAND_FOOTER_AREA | TDF_ENABLE_HYPERLINKS | TDF_CAN_BE_MINIMIZED
		| TDF_USE_COMMAND_LINKS | TDF_CALLBACK_TIMER;
	config.pszExpandedInformation		= _T( "<a href=\"http://codereflect.com/\" >Codereflect.com</a>" );
	config.pfCallback = TaskDialogCallbackProc;
	BOOL bVerification = FALSE;
	TaskDialogIndirect(&config, &nButtonPressed, NULL, &bVerification);

	switch (nButtonPressed)
	{
	case IDOK:
		break; // the user pressed button 0 (change password).
	case IDCANCEL:
		break; // user canceled the dialog
	default:
		break; // should never happen
	}
}

The callback function is also easy to manage. There are predefined set of events for each type of control and we can simply make use of these controls by sending various messages to update its state and values. One of the best example is updating the progressbar during the lifetime of messagebox. Once the timer is enabled, the callback function will be automatically fired on discrete time interval. The notify messages are specified in detail in MSDN Documentation. Please check it.

To compile this source code, please use latest version of Visual Studio 2010 or any prior version with Windows Vista/7 SDK. You can also use express edition of Visual C++ to try this API.

Every programmer must be familiar with the MessageBox es in any platform. It’s the simplest way to notify the user to take an action or provide notifications. Windows provides standard message box functionality with MessageBox API for displaying MessageBox with most frequently used buttons (OK, Cancel, Yes, No etc) and icons (error, warning, info etc.) This is again limited in programmer’s point of view and most we used to create our own messagebox to meet our extended purpose.

Windows UI has revamped since windows Vista and the UI experience was totally new from its predecessors. Most of the Windows Vista/7 applications display and extended form of messagebox called task dialog. Task dialog gives us more flexibility over the typical messagebox we used to have in Windows. We can display progress bars, extended information on footer, custom icons, predefined icons like Shield Icons (to indicate UAC elevation is required for operation etc.)

Task dialog comes with a simple set of interfaces and also provides an advanced version of interface to take control over what all we’re displaying in the task dialog

Displaying a Simple Taskbar

A simple task dialog can be displayed by calling TaskDialog API. The default buttons like OK, Yes, No, Cancel, Retry and close button. It’s simple as displaying a normal messagebox. The major difference is that we can have a custom icon, also a main instruction to show the intention of task dialog and main content provides further description of it. Organization of message is better readable and can have more focus than standard messagebox.

	TASKDIALOG_COMMON_BUTTON_FLAGS tButton =
		TDCBF_OK_BUTTON| TDCBF_YES_BUTTON|
		TDCBF_NO_BUTTON| TDCBF_CANCEL_BUTTON|
		TDCBF_RETRY_BUTTON| TDCBF_CLOSE_BUTTON;

	int nClickedBUtton;
	TaskDialog( m_hWnd, NULL,
		_T("Demonstrating TaskDialog API"),
		_T("This is the main instruction"), _T("This shows the main content"),
		tButton,
		MAKEINTRESOURCE( IDI_SHIELD ),
		&nClickedBUtton );

In the above code you can see the default buttons are displayed with binary OR “|” operator. The return value is passed as parameter and can refer after calling the API. The return value of the function gives the error status. S_OK means the dialog was successfully displayed. the details of the parameters and return values are described in the TaskDialog API documentation. In the next installment, let’s have a look at advanced usage of Task Dialog.

In the previous posts I covered the basics of setting progress overlay and adding buttons to the thumbnail flyout area.

All thumbnail previews displays the real-time content of the window client area. Suppose if we’re watching movies, we can see it through thumbnails. If we’re listening music, we can see the album artwork on hovering the thumbnail. But we can customize the window area to display in the thumbnail area.

Let’s take the previous example. by default Windows will display the entire window area.

Let’s take an example of clipping the preview to the scrollbar.

What we can do, it’s quite simple and straight forward. Just set the offset from the client area to be clipped. See the example below. Setting a NULL area will reset the thumbnail preview to default.

BEGIN_MESSAGE_MAP(CTaskBarSampleDlg, CDialogEx)
	ON_REGISTERED_MESSAGE( g_uTBBC, CTaskBarSampleDlg::OnCreateThumbToolBar )
END_MESSAGE_MAP()

LRESULT CTaskBarSampleDlg::OnCreateThumbToolBar( WPARAM, LPARAM )
{
	// Initialize the pointer. You can also do this in the constructor.
	// Remember to release after use
	if( NULL == m_pTaskBarlist )
	{
		CoCreateInstance( CLSID_TaskbarList, NULL, CLSCTX_ALL,
						  IID_ITaskbarList3, (void**)&m_pTaskBarlist);
	}
	return 0;
}

void CTaskBarSampleDlg::OnBnClickedButton2()
{
	static bool bClip = true;
	if( bClip )
	{
		CRect rect;
		m_Progress.GetWindowRect( rect );
		ScreenToClient( rect );
		m_pTaskBarlist->SetThumbnailClip( m_hWnd,rect );

	}
	else
		m_pTaskBarlist->SetThumbnailClip( m_hWnd, NULL ); // NULL will reset to default

	bClip = !bClip;
}

In the previous post, we’ve discussed about progressbar overlay on taskbar button. In this installment, we will see how to add the toolbar buttons to the flyout thumbnail Window. The best example is Windows Media Player. You can control the tracks using the flyout window on hovering the thumbnail button.

As you can see above, the thumbnail popping up is not really displaying the actual content of the window( which is by default). It show a custom thumbnail image and toolbar buttons down the image to control the track.

Adding these buttons are quite easy.

There are few peculiarities for the buttons displayed as toolbar in thumbnail area.

1. A maximum of 7 buttons can be added to thumbnail
2. The size of the bitmaps specified for thumbnails is dependent on the current DPI. Usually we use the 16×16 image for default DPI( 96 ). The bitmap size can be calculated easily by calling GetSystemMetrics( SM_CXSIZE ) and GetSystemMetrics( SM_CYSIZE ). This has to be taken care if the application is DPI aware.
3. The buttons follows the same order they specified in the array.
4. The buttons can’t be removed once it’s added, however we can hide/update the buttons.
5. The image lists created to specify the bitmaps can be released after calling adding it to the thumbnail area. The ITaskbarList3 interface can also be released if we’re finished processing.
6. The most important thing is, Every application must handle the “TaskbarButtonCreated” message before using the ITaskList3 interface functions. Otherwise the application may face exceptions.  Especially when the buttons and other overlays are initialized on application initialization.
7. The button effect on disabling, enabling, hovering is controlled by shell itself. We don’t need to keep separate image list for this.

Handling TaskbarButtonCreated message in MFC Application

As I mentioned before, the first task is to handle the “TaskbarButtonCreated” message in the application for proper initialization of ITaskbarList3 interface.

Following code will help you to do this. You can initialize the variable globally or inside the constructor of the class.

UINT g_uTBBC = RegisterWindowMessage(L"TaskbarButtonCreated");

Once this parameter initialized, handle the message inside the message map of the dialog class. Note that you should not use ON_MESSAGE to handle the message. ON_REGISTERED_MESSAGE function must be used.

BEGIN_MESSAGE_MAP(CTaskBarSampleDlg, CDialogEx) ...
...
ON_REGISTERED_MESSAGE( g_uTBBC, CTaskBarSampleDlg::OnCreateThumbToolBar )
...
END_MESSAGE_MAP()

Proceed to initialize ITaskbarList3 after receving notification in the message handler.

LRESULT CTaskBarSampleDlg::OnCreateThumbToolBar( WPARAM, LPARAM )
 { AddThumbarButtons(); return 0; }

Initializing and Adding Buttons

Now let’s see the initialization process. This can be accomplished in following steps

• Initialize the ITaskbarList3 interface
• Create Image list to specify as the bitmap buttons
• Add image list to the interface
• Prepare the button information as array
• Add the buttons

I’ve added enough comment in the source, I hope it’s easy to understand.

void CTaskBarSampleDlg::AddThumbarButtons()
{
        // Initialize the pointer. You can also do this in the constructor.
    // Remember to release after use
    if( NULL == m_pTaskBarlist )
    {
        CoCreateInstance( CLSID_TaskbarList, NULL, CLSCTX_ALL,
                          IID_ITaskbarList3, (void**)&m_pTaskBarlist);
    }

    m_pTaskBarlist->HrInit();

    // We mention that, we're specifying bitmap, tooltpi and other flags.
    // This is mask, only specified parameters will be taken from structure
    THUMBBUTTONMASK dwMask = THB_BITMAP | THB_TOOLTIP | THB_FLAGS;

    // Create the images from a single bitmap which contains
    // buttons seperated 16pix width. Like we handle toolbar buttons
    CImageList  ImageList;
    ImageList.Create( MAKEINTRESOURCE( IDB_BITMAP_PAUSE), 16, 2, RGB( 0xFF,0,0xFF));

    // Prepare the thumbar buttons
    THUMBBUTTON thbButtons[2];
    thbButtons[0].dwMask = dwMask;
    // This can be any integer required on handling button events
    thbButtons[0].iId = IDB_THB_BUTTON_START;
    thbButtons[0].iBitmap = 0;
    lstrcpy( thbButtons[0].szTip, TEXT("Start"));
    thbButtons[0].dwFlags = THBF_ENABLED | THBF_DISMISSONCLICK;

    thbButtons[1].dwMask = dwMask;
    thbButtons[1].iId = IDB_THB_BUTTON_PAUSE;
    thbButtons[1].iBitmap = 1;
    thbButtons[1].dwFlags = THBF_DISABLED | THBF_DISMISSONCLICK;
    lstrcpy( thbButtons[1].szTip, TEXT("Pause"));

    // Declare the image list that contains the button images.
    m_pTaskBarlist->ThumbBarSetImageList(m_hWnd, ImageList.GetSafeHandle());

    // Attach the toolbar to the thumbnail.
    m_pTaskBarlist->ThumbBarAddButtons(m_hWnd, ARRAYSIZE(thbButtons), thbButtons);

    // In this program we're using the interface later, so not releasing now.
    // It's Ok to release if finished using. We can create again when necessary
}

Handling the events from buttons

The events from buttons will be delivered as WM_COMMAND message for Window. As we’re using MFC, please override OnCommand function. The button ID can be extracted from wParam using LOWORD macro.

BOOL CTaskBarSampleDlg::OnCommand(WPARAM wParam, LPARAM lParam)
{
    UINT CommandID = LOWORD( wParam );

        if( IDB_THB_BUTTON_START == CommandID )
            OnBnClickedButton1();
        else if( IDB_THB_BUTTON_PAUSE == CommandID )
            ResetProgress();
        else
            return CDialogEx::OnCommand(wParam, lParam);
}

Updating Buttons

We’ve received the button event, so it’s time to update the button. We can’t remove the buttons as I specified before, we can hide, disable, enable the state of the buttons. Other properties like bitmaps and tooltip can also be updated

void CTaskBarSampleDlg::ResetProgress()
{
    // reset the progress state
    m_pTaskBarlist->SetProgressState( m_hWnd, TBPF_NOPROGRESS );

    THUMBBUTTONMASK dwMask = THB_FLAGS;

    THUMBBUTTON thbButtons[2];
    thbButtons[0].dwMask = dwMask;
    thbButtons[0].iId = IDB_THB_BUTTON_START;
    thbButtons[0].dwFlags = THBF_ENABLED | THBF_DISMISSONCLICK;

    thbButtons[1].dwMask = dwMask;
    thbButtons[1].iId = IDB_THB_BUTTON_PAUSE;
    thbButtons[1].dwFlags = THBF_DISABLED| THBF_DISMISSONCLICK;

    m_pTaskBarlist->ThumbBarUpdateButtons( m_hWnd, ARRAYSIZE(thbButtons), thbButtons );
}

Note that the code specified above doesn’t not handling the icons based on the DPI. It always use the icon size of default DPI (16pix).  You can maintain different bitmaps to handle this. This code in the sample is just mere demonstration of this API. It may not have a professional standard.

Final output

To get the icons, you can locate this down in the Visual Studio Installation directory. Usually it appears at

C:\Program Files\Microsoft Visual Studio 10.0\Common7\VS2010ImageLibrary\1033\VS2010ImageLibrary\VS2010ImageLibrary

Download Source[VS2010] – TaskbarSample.rar

Note: You’ve the sole responsibility of downloading executing the code. It works only with Windows 7 and compiled under Visual Studio 2010

The best thing you may notice in Windows 7 may be its taskbar. It’s totally revamped and gives us a fresh look, more usable with progress bar overlays, jump lists to easily open the last opened documents, and improved and interactive thumbnail previews applications etc. You can see more details in Windows 7 website.

In this post, I am covering progress bar to display as taskbar button overlay. In Windows 7, you might have noticed the progress bar on taskbar button in many applications like Windows Explorer shows progress of file copy, Internet Explorer or Safari displays progress of downloads, etc.

We can program this for our application as well. It can be easily accomplished using the ITaskList3 COM Interface. This Interface not only for progress bars. It can be used for:

• When working with a TDI (Tabbed Document Interface) application (such as Internet Explorer) or a MDI application (such as Microsoft Excel) that is displaying its windows as a group on the taskbar:
  • Provide the taskbar with a thumbnail that represents the view of an individual tab or document. (You can see this in action with Safari Or Internet Explorer Browser)
  • Remove the thumbnail of an individual tab or document from the group.
  • Change the order of thumbnails in the group.
  • Set a tab thumbnail as the selected item when the thumbnails are shown.
• When applying an overlay to a taskbar icon, such as a notification.
  • When showing the progress of an operation, such as copying or installing an item.
  • When adding a toolbar to a thumbnail. (like iTunes of Windows Media Player)

Now let’s see how we can do this. I’ve prepared a simple dialog based application which shows a progressbar as below. You can also see the progressbar over the Icon of application displayed in the thumbnail area.

The code is self explanatory. See the code snippet and comments. Don’t forget to release the ITaskListInterface after usage. You should call m_pTaskList>Release(); to release the interface.

Step #1

Declare the pointer to access ITaskbarList3 interface. You can make this as a member of the dialog class.

ITaskbarList3* m_pTaskBarlist;
CoCreateInstance(
            CLSID_TaskbarList, NULL, CLSCTX_ALL,
            IID_ITaskbarList3, (void**)&m_pTaskBarlist);

Step #2

Initialize the progressbar state to enable the progressbar overlay:

m_pTaskBarlist->SetProgressState( m_hWnd, TBPF_INDETERMINATE );

The parameters are relatively simple. Windows handle must be passed along with the type of progressbar that needs to be displayed. If you check the definition, you can see the following types can be passed to the function. These states are exactly similar state of a normal progressbar.

Step #3 Progress

Simply call SetProgressValue() as given below. The current value and maximum value should be given.

m_pTaskBarlist->SetProgressValue( m_hWnd, nPos, nMax );

Once you finish the task, you’ve to disable the progress state. I hope you know how to do it

See the full scoop here.

To compile this code, either use Visual Studio 2010 or download the Windows 7 SDK from MSDN website.

// Declare this as member of the class or global (not recommended)
ITaskbarList3* m_pTaskBarlist;
void CTaskBarSampleDlg::OnBnClickedButtonStart()
{
	m_Progress.SetRange( 0, 10 ); // set the range for the control
	m_Progress.SetPos( 0 ); // Set initial position
	// Initialize the pointer. You can also do this in the constructor.
	// Remember to release after use
	if( NULL == m_pTaskBarlist )
	{
		CoCreateInstance(
			CLSID_TaskbarList, NULL, CLSCTX_ALL,
			IID_ITaskbarList3, (void**)&m_pTaskBarlist);
	}
	m_pTaskBarlist->SetProgressState( m_hWnd, TBPF_INDETERMINATE );
	SetTimer( 0, 500, 0 );
}
// Timer to update the progress
void CTaskBarSampleDlg::OnTimer(UINT_PTR nIDEvent)
{
	int nPos = m_Progress.GetPos();
	int nMin, nMax;
	m_Progress.GetRange( nMin, nMax );
	nPos++;
	// if finished, kill timer and return
	if( nPos > nMax )
	{
		// reset the progress state
		m_pTaskBarlist->SetProgressState( m_hWnd, TBPF_NOPROGRESS );
		// just flash the window to notify user
		FlashWindow( true );
		// Stop the timer
		KillTimer( 0 );
		// You can release the pointer if necessary here.
                  // But not a good practice
		return;
	}
	// set progress to taskbar overlay
	m_pTaskBarlist->SetProgressValue( m_hWnd, nPos, nMax );
	// set the control's progress state
	m_Progress.SetPos( nPos );
}

The Reliability Monitor is intended for advanced computer users, such as software developers and network administrators. Reliability monitor was introduced first in Windows Vista as “Reliability and Performance Monitor”. Now it has been tear-off and independent from Performance Monitor. The purpose of reliability monitor is to graphically plot the stability index and display the hardware and software failures and other core information from the system (such as application installation and removal etc.), which affects the stability of the machine.

You can see that Safari and other application has crashed many times and also the I’ve got some some warnings when I tried uninstalling the beta version of office 2010. The list also contains the programs I uninstalled.

You can see more details in Microsoft website.