Help Repainting with GDI+

[I_want_to_learn]

OK i will try to be as clear as i can be.

I am trying to make Full screen (800 x 480) apps for vehicle PC's.

like this one:


I'm trying to do apps like that with Fully Alpha Blended PNG's.

I managed to load a PNG as the Dialogs Background and one as a Button.

The button has 2 images:
1: The Normal State
2: the Down (Pressed) State

The problem i'm having is that every time i click the button, the "Down State" PNG gets drawn on top of the "Normal State" PNG and you can clearly see the Normal state Icon in the back of the button's Downstate Image and Viceversa

How can i clear or erase the the normal state image if i click my button and viceversa when i release my button.

Here's a video of whats going on.
http://s615.photobucket.com/albums/t...nt=Trouble.flv

In the Video you can see the Images getting drawn on top of the other and the shadows pilling up and getting darker and darker.


This is my Dialog Code:

// ODBII  Maker DatabaseDlg.cpp : implementation file
//

#include "stdafx.h"
#include "ODBII  Maker Database.h"
#include "ODBII  Maker DatabaseDlg.h"
#include "SearchButton.h"
#include <fstream>
#include <gdiplus.h>
#include <GdiPlusEnums.h>

#pragma comment (lib,"gdiplus.lib")

using namespace std;

fstream database;

CString ItemText;
int mark;

#ifdef _DEBUG
#define new DEBUG_NEW
#endif


// CAboutDlg dialog used for App About

class CAboutDlg : public CDialog
{
public:
	CAboutDlg();

// Dialog Data
	enum { IDD = IDD_ABOUTBOX };

	protected:
	virtual void DoDataExchange(CDataExchange* pDX);    // DDX/DDV support

// Implementation
protected:
	DECLARE_MESSAGE_MAP()
};

CAboutDlg::CAboutDlg() : CDialog(CAboutDlg::IDD)
{
}

void CAboutDlg::DoDataExchange(CDataExchange* pDX)
{
	CDialog::DoDataExchange(pDX);
}

BEGIN_MESSAGE_MAP(CAboutDlg, CDialog)
END_MESSAGE_MAP()


// CODBIIMakerDatabaseDlg dialog




CODBIIMakerDatabaseDlg::CODBIIMakerDatabaseDlg(CWnd* pParent /*=NULL*/)
	: CDialog(CODBIIMakerDatabaseDlg::IDD, pParent)
{
	m_hIcon = AfxGetApp()->LoadIcon(IDR_MAINFRAME);
}

void CODBIIMakerDatabaseDlg::DoDataExchange(CDataExchange* pDX)
{
	CDialog::DoDataExchange(pDX);
	DDX_Control(pDX, IDC_LIST1, m_Maker);
	DDX_Control(pDX, IDC_FIND, Search);
	DDX_Control(pDX, IDC_CODE, m_Meaning);
	DDX_Control(pDX, IDC_Meaning, m_Code);
}

BEGIN_MESSAGE_MAP(CODBIIMakerDatabaseDlg, CDialog)
	ON_WM_SYSCOMMAND()
	ON_WM_PAINT()
	ON_WM_QUERYDRAGICON()
	ON_BN_CLICKED(IDC_FIND, &CODBIIMakerDatabaseDlg::OnBnClickedFind)
	ON_WM_ERASEBKGND()
END_MESSAGE_MAP()


// CODBIIMakerDatabaseDlg message handlers

BOOL CODBIIMakerDatabaseDlg::OnInitDialog()
{
	CDialog::OnInitDialog();

	// Add "About..." menu item to system menu.

	// IDM_ABOUTBOX must be in the system command range.
	ASSERT((IDM_ABOUTBOX & 0xFFF0) == IDM_ABOUTBOX);
	ASSERT(IDM_ABOUTBOX < 0xF000);

	CMenu* pSysMenu = GetSystemMenu(FALSE);
	if (pSysMenu != NULL)
	{
		BOOL bNameValid;
		CString strAboutMenu;
		bNameValid = strAboutMenu.LoadString(IDS_ABOUTBOX);
		ASSERT(bNameValid);
		if (!strAboutMenu.IsEmpty())
		{
			pSysMenu->AppendMenu(MF_SEPARATOR);
			pSysMenu->AppendMenu(MF_STRING, IDM_ABOUTBOX, strAboutMenu);
		}
	}

	// Set the icon for this dialog.  The framework does this automatically
	//  when the application's main window is not a dialog
	SetIcon(m_hIcon, TRUE);			// Set big icon
	SetIcon(m_hIcon, FALSE);		// Set small icon

	// TODO: Add extra initialization here
	Gdiplus::GdiplusStartupInput gdiplusstartupinput;
	Gdiplus::GdiplusStartup(&gdiplusToken,&gdiplusstartupinput,NULL);
	char Maker[MAX_PATH];
	m_Maker.InsertColumn(0,"");
	m_Maker.SetColumnWidth(0,180);

	database.open("Manufacturers//Manufacturer.txt",fstream::in);

	while (database.getline(Maker,sizeof(Maker)) != 0)
			{
				m_Maker.InsertItem(0,Maker);
		}

	database.clear();
	database.close();

	return TRUE;  // return TRUE  unless you set the focus to a control
}

void CODBIIMakerDatabaseDlg::OnSysCommand(UINT nID, LPARAM lParam)
{
	if ((nID & 0xFFF0) == IDM_ABOUTBOX)
	{
		CAboutDlg dlgAbout;
		dlgAbout.DoModal();
	}
	else
	{
		CDialog::OnSysCommand(nID, lParam);
	}
}

// If you add a minimize button to your dialog, you will need the code below
//  to draw the icon.  For MFC applications using the document/view model,
//  this is automatically done for you by the framework.

void CODBIIMakerDatabaseDlg::OnPaint()
{
	CPaintDC dc(this); // device context for painting

	if (IsIconic())
	{

		SendMessage(WM_ICONERASEBKGND, reinterpret_cast<WPARAM>(dc.GetSafeHdc()), 0);

		// Center icon in client rectangle
		int cxIcon = GetSystemMetrics(SM_CXICON);
		int cyIcon = GetSystemMetrics(SM_CYICON);
		CRect rect;
		GetClientRect(&rect);
		int x = (rect.Width() - cxIcon + 1) / 2;
		int y = (rect.Height() - cyIcon + 1) / 2;

		// Draw the icon
		dc.DrawIcon(x, y, m_hIcon);
	}
	else
	{
		CDialog::OnPaint();
	}
}

// The system calls this function to obtain the cursor to display while the user drags
//  the minimized window.
HCURSOR CODBIIMakerDatabaseDlg::OnQueryDragIcon()
{
	return static_cast<HCURSOR>(m_hIcon);
}


void CODBIIMakerDatabaseDlg::OnBnClickedFind()
{
	//Search for the Code in the Database
	CString Search;
	CString Folder;
	char Temp[MAX_PATH];
	char Code[MAX_PATH];
	char Meaning[MAX_PATH];

	m_Meaning.SetWindowTextA("");

	Search = "[";
	m_Code.GetWindowTextA(Temp,sizeof(Temp));
	Search += Temp;
	Search += "]";

	if(m_Maker.GetSelectedCount() > 0)
		{
		//get the selected items number in the Listcontrol
		mark = m_Maker.GetSelectionMark();
		//get the text of the selected item in the listctrl
		ItemText = m_Maker.GetItemText(mark,NULL);
		//open the file for reading
		Folder = "Manufacturers\\";
		Folder += ItemText;
		Folder += ".txt";
		database.open(Folder,fstream::in);


			while (database.getline(Code,sizeof(Code)) != 0)
			{
		//if the Description line matches with the word searched
		//get the Codes Meaning and display it
				if(strcmp(Code,Search) == 0)
				{
					database.getline(Meaning,MAX_PATH);
					m_Meaning.SetWindowTextA(Meaning);
			}

		}
	}

	database.close();
	database.clear();
}
BOOL CODBIIMakerDatabaseDlg::OnEraseBkgnd(CDC* pDC)
{
	// TODO: Add your message handler code here and/or call default
	Gdiplus::Image * BG;

	Gdiplus::Graphics grpx(*pDC);//GDI Graphics container
	Gdiplus::Rect rect(0,0,473,261);//GDI image pos and size

	BG = Gdiplus::Image::FromFile(L"Image\\BackGround.png",FALSE);

	grpx.DrawImage(BG,rect);


	return true;
}

And this is the CustomButton's Code:

// SearchButton.cpp : implementation file
//

#include "stdafx.h"
#include "ODBII  Maker Database.h"
#include "ODBII  Maker DatabaseDlg.h"
#include "SearchButton.h"
#include <gdiplus.h>

#pragma comment (lib,"gdiplus.lib")


// SearchButton

IMPLEMENT_DYNAMIC(SearchButton, CButton)

SearchButton::SearchButton()
{
	Gdiplus::GdiplusStartupInput gdiplusstartupinput;
	Gdiplus::GdiplusStartup(&gdiplusToken,&gdiplusstartupinput,NULL);

	ButtonUp = Gdiplus::Image::FromFile(L"Image\\Button1.png",FALSE);
	ButtonDown = Gdiplus::Image::FromFile(L"Image\\Button2.png",FALSE);
}

SearchButton::~SearchButton()
{
	Gdiplus::GdiplusShutdown(gdiplusToken);
}


BEGIN_MESSAGE_MAP(SearchButton, CButton)
	ON_WM_ERASEBKGND()
END_MESSAGE_MAP()



// SearchButton message handlers





void SearchButton::DrawItem(LPDRAWITEMSTRUCT lpDrawItemStruct)
{
CDC dc;

dc.Attach(lpDrawItemStruct->hDC);

CRect rt;

rt = lpDrawItemStruct->rcItem;


Gdiplus::Graphics grpx(dc);

Gdiplus::Rect rect(0,0,90,90);

UINT State = lpDrawItemStruct->itemState;

if((State & ODS_SELECTED))
{
	grpx.DrawImage(ButtonUp,rect);
}
else
{
	grpx.DrawImage(ButtonDown,rect);
}

dc.Detach();

}

BOOL SearchButton::OnEraseBkgnd(CDC* pDC)
{
	// TODO: Add your message handler code here and/or call default

	return TRUE;
}

And i Uploaded the project as well just in case.

Thanks so much in advance ^_^.

God Bless.

[I_want_to_learn]

I updated a bit the code.

Here it is:

SearchButton.cpp

// SearchButton.cpp : implementation file
//

#include "stdafx.h"
#include "ODBII  Maker Database.h"
#include "ODBII  Maker DatabaseDlg.h"
#include "SearchButton.h"
#include <gdiplus.h>

#pragma comment (lib,"gdiplus.lib")


// SearchButton

IMPLEMENT_DYNAMIC(SearchButton, CButton)

SearchButton::SearchButton()
{
	Gdiplus::GdiplusStartupInput gdiplusstartupinput;
	Gdiplus::GdiplusStartup(&gdiplusToken,&gdiplusstartupinput,NULL);

	ButtonUp = Gdiplus::Image::FromFile(L"Image\\Button1.png",FALSE);
	ButtonDown = Gdiplus::Image::FromFile(L"Image\\Button2.png",FALSE);
}

SearchButton::~SearchButton()
{
	Gdiplus::GdiplusShutdown(gdiplusToken);
}


BEGIN_MESSAGE_MAP(SearchButton, CButton)
	ON_WM_LBUTTONDOWN()
	ON_WM_LBUTTONUP()
	ON_WM_ERASEBKGND()
ON_WM_CTLCOLOR_REFLECT()
END_MESSAGE_MAP()



// SearchButton message handlers





void SearchButton::DrawItem(LPDRAWITEMSTRUCT lpDrawItemStruct)
{
CDC dc;

dc.Attach(lpDrawItemStruct->hDC);

CRect rt;

rt = lpDrawItemStruct->rcItem;


Gdiplus::Graphics grpx(dc);

UINT State = lpDrawItemStruct->itemState;

Gdiplus::Rect rect(0,0,90,90);

if((State & ODS_SELECTED))
{
	grpx.DrawImage(ButtonUp,rect);
}
else
{
	grpx.DrawImage(ButtonDown,rect);
}
dc.Detach();

}

void SearchButton::OnLButtonDown(UINT nFlags, CPoint point)
{
	// TODO: Add your message handler code here and/or call default
	Invalidate(1);
	CButton::OnLButtonDown(nFlags, point);
}

void SearchButton::OnLButtonUp(UINT nFlags, CPoint point)
{
	// TODO: Add your message handler code here and/or call default
	Invalidate(1);
	CButton::OnLButtonUp(nFlags, point);
}
BOOL SearchButton::OnEraseBkgnd(CDC* pDC)
{
	// TODO: Add your message handler code here and/or call default
	Gdiplus::Graphics grpx(*pDC);
	Gdiplus::Color trans(0,0,0,0);

	grpx.Clear(trans);

	return CButton::OnEraseBkgnd(pDC);
}

HBRUSH SearchButton::CtlColor(CDC* pDC, UINT /*nCtlColor*/)
{
	// TODO:  Change any attributes of the DC here
	// TODO:  Return a non-NULL brush if the parent's handler should not be called
	return (HBRUSH)::GetStockObject(NULL_BRUSH);
}

How can i erase the image with a Alpha blended Brush?