WinAPI: Image on hover - winapi

Question

A friend of mine is about to release an application and asked me to create a launcher for it. I found it a good excuse to finally study WinAPI and thought that a simple launcher would be easily doable even in a relatively small time window.
I was wrong.
I'm trying to create a launcher window with 5 buttons that start different things. The goal is to have transparent buttons (not done yet) that have a smaller image inside them. The image should only be displayed when the user hovers over the larger button area.
The images are in .png format. I'm using GDI+ and loading PNG files from resources with http://www.codeproject.com/Articles/3537/Loading-JPG-PNG-resources-using-GDI.
I'm using MouseTrackEvents to keep track of the mouse and I've also subclassed a button. The problem is that I don't know how I should handle the WM_MOUSELEAVE message. I don't know how to erase the image I've drawn. If I have to save the ht_img as a variable and refer to it later, I don't know how.
Here's what I have so far. This example loads the .png from resource IDB_Website2. Displaying the image works (although it keeps being rendered over and over again currently):
WndProc:
LRESULT CALLBACK WndProc(HWND hWnd, UINT Msg, WPARAM wParam, LPARAM lParam)
{
int wmId, wmEvent;
PAINTSTRUCT ps;
HDC hdc;
GDI gdi;
switch (Msg)
{
case WM_CREATE:
{
HWND hwndButton = CreateWindow(TEXT("button"), NULL,
WS_VISIBLE | WS_CHILD | BS_PUSHBUTTON,
80, 10, 100, 50,
hWnd, (HMENU) HT_BUTTON1, NULL, NULL);
HTButton = (WNDPROC) SetWindowLong(hwndButton, GWL_WNDPROC, (LONG) ButtonProc);
}
...
case WM_PAINT:
hdc = BeginPaint(hWnd, &ps);
gdi.InitList(hInst, hdc);
EndPaint(hWnd, &ps);
break;
Buttonproc (subclassed button):
LRESULT CALLBACK ButtonProc(HWND hWnd, UINT Msg, WPARAM wParam, LPARAM lParam)
{
MouseTrackEvents MouseTrack;
GDI gdi;
HDC odc = GetDC(GetParent(hWnd));
switch(Msg)
{
case WM_MOUSEMOVE:
MouseTrack.OnMouseMove(hWnd);
break;
case WM_MOUSEHOVER:
gdi.Create(IDB_Website2, _T("PNG"), hInst, odc, 62, 347, 200, 40, true);
MouseTrack.Reset(hWnd);
break;
case WM_MOUSELEAVE:
MouseTrack.Reset(hWnd);
break;
}
return CallWindowProc (HTButton, hWnd, Msg, wParam, lParam);
}
class GDI's Create graphic method:
void Create(UINT menuid, LPCTSTR pType, HMODULE hInst, HDC hdc, int x, int y, int w, int h)
{
Graphics grpx(hdc);
ht_img = new CGdiPlusBitmapResource();
ht_img -> Load(menuid, pType, hInst);
grpx.DrawImage(*ht_img, x, y, w, h);
delete ht_img;
}
This has been quite a challenge so far! It's been fun although a bit tear-my-hair-out inducing at times. :-) I'd be grateful for any advice on how I should proceed.
EDIT: Answering Adrian
I tried changing my Buttonproc, but the image doesn't seem to be rendered. Here's what I did:
LRESULT CALLBACK ButtonProc(HWND hWnd, UINT Msg, WPARAM wParam, LPARAM lParam)
{
MouseTrackEvents MouseTrack;
GDI gdi;
HDC odc = GetDC(GetParent(hWnd));
PAINTSTRUCT ps;
int result;
switch(Msg)
{
case WM_MOUSEMOVE:
MouseTrack.OnMouseMove(hWnd);
break;
case WM_MOUSEHOVER:
hovering = true;
break;
case WM_MOUSELEAVE:
hovering = false;
MouseTrack.Reset(hWnd);
break;
case WM_PAINT:
hdc = BeginPaint(hWnd, &ps);
result = CallWindowProc(HTButton, hWnd, Msg, wParam, lParam);
if (hovering == true) {
gdi.Create(IDB_Play2, _T("PNG"), hInst, hdc, 62, 100, 200, 40);
}
EndPaint(hWnd, &ps);
return result;
}
return CallWindowProc (HTButton, hWnd, Msg, wParam, lParam);
}

Answer 1

You probably don't want to do the painting directly in the handling of the mouse events. You probably want to handle WM_PAINT in the button proc by calling the underlying implementation and then augmenting it based on the hover state. Then your mouse handling corresponds to flipping a state variable and invalidating the button (which will cause it to repaint).
case WM_PAINT:
// start with the standard rendering
int result = CallWindowProc (HTButton, hWnd, Msg, wParam, lParam);
// then overdraw our embellishments
if (my_state_variable == hovering) {
DrawOverlayImage();
}
return result; // don't just break here, or you'll call CallWindowProc again