MFC界面美化---自绘标题栏

做MFC项目的时候，会经常遇到需要美化界面的时候。mfc的原始界面比较丑，今天主要记录一下对MFC标题栏重绘的过程，最终效果是这样的。

1.因为要对标题栏进行重绘，我们要把MFC的原生标题栏给去掉，在MFC对话框的属性那里，

把边框的属性设置成None.

2. 去掉MFC的标题栏后，整个MFC界面鼠标拖动的时候无法让之移动，我们需要添加ON_WM_NCHITTEST()消息。

LRESULT CMFCDrawnTitleDlg::OnNcHitTest(CPoint point)
{// TODO: 在此添加消息处理程序代码和/或调用默认值UINT nHitTest = CDialogEx::OnNcHitTest(point);CRect rect;GetClientRect(&rect);rect.bottom = 70; // 表示界面的顶端到下面70像素的高度 鼠标在这个位置可以控制界面移动//函数参数point是相对于屏幕坐标的，需要将其转换为//客户区坐标才能使用PtInRect()，否则会因为坐标的不同使判断失误ScreenToClient(&point);if (rect.PtInRect(point))return nHitTest;
}

3.菜单栏的绘制，因为去掉了界面的边框，我们要自己绘制菜单栏。在OnPaint()函数里面进行实现

void CMFCDrawnTitleDlg::OnPaint()
{if (IsIconic()){CPaintDC dc(this); // 用于绘制的设备上下文SendMessage(WM_ICONERASEBKGND, reinterpret_cast<WPARAM>(dc.GetSafeHdc()), 0);// 使图标在工作区矩形中居中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;// 绘制图标dc.DrawIcon(x, y, m_hIcon);}else{CPaintDC dc(this);CRect rect;//------------------CRect tmprect;GetClientRect(&rect);//rect.bottom = 60;rect.bottom *= 0.1;/*int nCount = 165 - 115 + 186 - 158 + 190 - 115;int nIncrecs = (rect.right - rect.left) / nCount;*/dc.FillSolidRect(rect, RGB(45, 51, 60));dc.SetBkMode(TRANSPARENT);CRect rtBtnClo;//绘制文件菜单栏GetClientRect(&rtBtnClo);rtBtnClo.left = rtBtnClo.left + 10;rtBtnClo.right = rtBtnClo.left + 30;rtBtnClo.bottom *= 0.1;rtBtnClo.top = rtBtnClo.bottom - 20;m_rtBtnfile = rtBtnClo;dc.Rectangle(rtBtnClo);dc.FillSolidRect(m_rtBtnfile, RGB(45, 51, 59));dc.SetBkMode(TRANSPARENT);CString str1 = TEXT("文件");dc.SetTextColor(RGB(185, 192, 197));dc.DrawText(str1, m_rtBtnfile, DT_LEFT | DT_VCENTER);//CDialogEx::OnPaint();//绘制选项菜单栏GetClientRect(&rtBtnClo);rtBtnClo.left = rtBtnClo.left + 70;rtBtnClo.right = rtBtnClo.left + 30;rtBtnClo.bottom *= 0.1;rtBtnClo.top = rtBtnClo.bottom - 20;m_rtBtnSelect = rtBtnClo;dc.Rectangle(rtBtnClo);dc.FillSolidRect(m_rtBtnSelect, RGB(45, 51, 59));dc.SetBkMode(TRANSPARENT);str1 = TEXT("选项");dc.SetTextColor(RGB(185, 192, 197));dc.DrawText(str1, m_rtBtnSelect, DT_LEFT | DT_VCENTER);//绘制帮助菜单栏GetClientRect(&rtBtnClo);rtBtnClo.left = rtBtnClo.left + 130;rtBtnClo.right = rtBtnClo.left + 30;rtBtnClo.bottom *= 0.1;rtBtnClo.top = rtBtnClo.bottom - 20;m_rtBtnHelp = rtBtnClo;dc.Rectangle(rtBtnClo);dc.FillSolidRect(m_rtBtnHelp, RGB(45, 51, 59));dc.SetBkMode(TRANSPARENT);str1 = TEXT("帮助");dc.SetTextColor(RGB(185, 192, 197));dc.DrawText(str1, m_rtBtnHelp, DT_LEFT | DT_VCENTER);CDialogEx::OnPaint();}
}

4.标题栏的背景颜色绘制

背景颜色绘制也在OnPaint()中。具体是这段代码

        CRect tmprect;GetClientRect(&rect);//rect.bottom = 60;rect.bottom *= 0.1;dc.FillSolidRect(rect, RGB(45, 51, 60));dc.SetBkMode(TRANSPARENT);CRect rtBtnClo;

5.最大化，最小化，退出，按钮的绘制。

这块我的设计是对按钮进行重绘，在按钮上进行贴图，把最大化，最小化的图片贴在按钮上。

然后把按钮的位置放在右上角。

定义自己的Button变量

CMyButton m_btnExit;
CMyButton m_btnMax;
CMyButton m_btnMin;

在OnInitDialog里绘制

//退出按钮绘制CRect rtBtnClo;GetClientRect(&rtBtnClo);rtBtnClo.left = rtBtnClo.right - 20;m_btnExit.SetImagePath(_T(".\\res\\icon_popup_off.png"), _T(".\\res\\icon_popup_off.png"), _T(".\\res\\icon_popup_off.png"));m_btnExit.InitMyButton(rtBtnClo.left, 5, 16, 16, true);//最大化按钮绘制GetClientRect(&rtBtnClo);rtBtnClo.left = rtBtnClo.right - 50;m_btnMax.SetImagePath(_T(".\\res\\icon_square.png"), _T(".\\res\\icon_square.png"), _T(".\\res\\icon_square.png"));m_btnMax.InitMyButton(rtBtnClo.left, 5, 16, 16, true);//最小化按钮// GetClientRect(&rtBtnClo);rtBtnClo.left = rtBtnClo.right - 80;m_btnMin.SetImagePath(_T(".\\res\\icon_minimiz.png"), _T(".\\res\\icon_minimiz.png"), _T(".\\res\\icon_minimiz.png"));m_btnMin.InitMyButton(rtBtnClo.left, 5, 16, 16, true);

注意事项：把图片贴到按钮的时候，路过你的图片有空白区域 MFC会默认把空白区域填充成黑色，所以你的图片需要设计成空白区域填充成和你的界面的背景颜色是一样的

6.按钮美化，对按钮进行重绘。

#pragma once#include <afxwin.h>
#include "pch.h"
#include "framework.h"
// CMyButtonclass CMyButton : public CButton
{DECLARE_DYNAMIC(CMyButton)public:CMyButton();virtual ~CMyButton();protected://正常状态图像路径CString m_strNormalImgPath;//按下状态图像路径CString m_strPressImgPath;//悬浮状态图像路径CString m_strFloatImgPath;//正常状态图像CImage m_imgNormal;//按下状态图像CImage m_imgPress;//悬浮状态图像CImage m_imgFloat;//窗口背景图片CImage m_BkImg;public://设置按钮图片路径void SetImagePath(CString strNoramlImgPath, CString strPressImgPath, CString strFloatImgPath);//初始化按钮，主要是调整按钮的位置，处理透明色  bool InitMyButton(int nX/*左上角X坐标*/, int nY/*左上角Y坐标*/, int nW/*图像宽*/, int nH/*图像高*/, bool bIsPng/*是否是PNG图片*/);//自绘制函数  void DrawItem(LPDRAWITEMSTRUCT lpDrawItemStruct);//初始化窗口背景void SetBkImg(CString strBkImg);//释放图片资源，方便最大化 void ReleaseImg();
protected://光标是否在窗口内BOOL m_bIsInWnd;DECLARE_MESSAGE_MAP()
public:afx_msg void OnMouseMove(UINT nFlags, CPoint point);afx_msg void OnMouseHover(UINT nFlags, CPoint point);afx_msg void OnMouseLeave();};

// MyButton.cpp : 实现文件
//#include "pch.h"
#include "MyButton.h"// CMyButtonIMPLEMENT_DYNAMIC(CMyButton, CButton)CMyButton::CMyButton()
{m_bIsInWnd = FALSE;
}CMyButton::~CMyButton()
{
}BEGIN_MESSAGE_MAP(CMyButton, CButton)ON_WM_MOUSEMOVE()ON_WM_MOUSEHOVER()ON_WM_MOUSELEAVE()
END_MESSAGE_MAP()// CMyButton 消息处理程序//设置按钮图片路径
void CMyButton::SetImagePath(CString strNoramlImgPath, CString strPressImgPath, CString strFloatImgPath)
{m_strNormalImgPath = strNoramlImgPath;m_strPressImgPath = strPressImgPath;m_strFloatImgPath = strFloatImgPath;
}void CMyButton::SetBkImg(CString strBkImg)
{if (strBkImg.IsEmpty())return;m_BkImg.Load(strBkImg);
}//初始化按钮，主要是调整按钮的位置，处理透明色 
void CMyButton::ReleaseImg()
{if (m_imgNormal){m_imgNormal.Destroy();}if (m_imgPress){m_imgPress.Destroy();}if (m_imgFloat){m_imgFloat.Destroy();}
}
bool CMyButton::InitMyButton(int nX/*左上角X坐标*/, int nY/*左上角Y坐标*/, int nW/*图像宽*/, int nH/*图像高*/, bool bIsPng/*是否是PNG图片*/)
{HRESULT hr = 0;if (m_strNormalImgPath.IsEmpty())return false;if (m_strPressImgPath.IsEmpty())return false;if (m_strFloatImgPath.IsEmpty())return false;hr = m_imgNormal.Load(m_strNormalImgPath);int a = GetLastError();if (FAILED(hr))return false;hr = m_imgPress.Load(m_strPressImgPath);if (FAILED(hr))return false;hr = m_imgFloat.Load(m_strFloatImgPath);if (FAILED(hr))return false;if (bIsPng){if (m_imgNormal.GetBPP() == 32){int i = 0;int j = 0;for (i = 0; i < m_imgNormal.GetWidth(); i++){for (j = 0; j < m_imgNormal.GetHeight(); j++){byte * pbyte = (byte *)m_imgNormal.GetPixelAddress(i, j);pbyte[0] = pbyte[0] * pbyte[3] / 255;pbyte[1] = pbyte[1] * pbyte[3] / 255;pbyte[2] = pbyte[2] * pbyte[3] / 255;}}}if (m_imgPress.GetBPP() == 32){int i = 0;int j = 0;for (i = 0; i < m_imgPress.GetWidth(); i++){for (j = 0; j < m_imgPress.GetHeight(); j++){byte * pbyte = (byte *)m_imgPress.GetPixelAddress(i, j);pbyte[0] = pbyte[0] * pbyte[3] / 255;pbyte[1] = pbyte[1] * pbyte[3] / 255;pbyte[2] = pbyte[2] * pbyte[3] / 255;}}}if (m_imgFloat.GetBPP() == 32){int i = 0;int j = 0;for (i = 0; i < m_imgFloat.GetWidth(); i++){for (j = 0; j < m_imgFloat.GetHeight(); j++){byte * pbyte = (byte *)m_imgFloat.GetPixelAddress(i, j);pbyte[0] = pbyte[0] * pbyte[3] / 255;pbyte[1] = pbyte[1] * pbyte[3] / 255;pbyte[2] = pbyte[2] * pbyte[3] / 255;}}}}MoveWindow(nX, nY, nW, nH);return true;}
//自绘制函数  
void CMyButton::DrawItem(LPDRAWITEMSTRUCT lpDrawItemStruct)
{if (!lpDrawItemStruct)return;HDC hMemDC;HBITMAP bmpMem;HGDIOBJ hOldObj;bmpMem = CreateCompatibleBitmap(lpDrawItemStruct->hDC, lpDrawItemStruct->rcItem.right - lpDrawItemStruct->rcItem.left, lpDrawItemStruct->rcItem.bottom - lpDrawItemStruct->rcItem.top);if (!bmpMem)return;hMemDC = CreateCompatibleDC(lpDrawItemStruct->hDC);if (!hMemDC){if (bmpMem){::DeleteObject(bmpMem);bmpMem = NULL;}return;}hOldObj = ::SelectObject(hMemDC, bmpMem);int nW = lpDrawItemStruct->rcItem.right - lpDrawItemStruct->rcItem.left;int nH = lpDrawItemStruct->rcItem.bottom - lpDrawItemStruct->rcItem.top;RECT rectTmp = { 0 };rectTmp = lpDrawItemStruct->rcItem;MapWindowPoints(GetParent(), &rectTmp);if (m_BkImg.IsNull() == false)m_BkImg.Draw(hMemDC, 0, 0, rectTmp.right - rectTmp.left, rectTmp.bottom - rectTmp.top, rectTmp.left, rectTmp.top, rectTmp.right - rectTmp.left, rectTmp.bottom - rectTmp.top);if (lpDrawItemStruct->itemState & ODS_SELECTED){//按钮被选择  m_imgPress.AlphaBlend(hMemDC, 0, 0, nW, nH, 0, 0, nW, nH);}else{//默认状态  m_imgNormal.AlphaBlend(hMemDC, 0, 0, nW, nH, 0, 0, nW, nH);}::BitBlt(lpDrawItemStruct->hDC, 0, 0, nW, nH, hMemDC,0,0,SRCCOPY);SelectObject(hMemDC, hOldObj);if (bmpMem){::DeleteObject(bmpMem);bmpMem = NULL;}if (hMemDC){::DeleteDC(hMemDC);hMemDC = NULL;}return;
}void CMyButton::OnMouseMove(UINT nFlags, CPoint point)
{// TODO:  在此添加消息处理程序代码和/或调用默认值CButton::OnMouseMove(nFlags, point);if (!m_bIsInWnd){TRACKMOUSEEVENT       tme;tme.cbSize = sizeof(TRACKMOUSEEVENT);tme.dwFlags = TME_HOVER | TME_LEAVE;tme.dwHoverTime = 10;tme.hwndTrack = m_hWnd;_TrackMouseEvent(&tme);m_bIsInWnd = TRUE;}
}void CMyButton::OnMouseHover(UINT nFlags, CPoint point)
{// TODO:  在此添加消息处理程序代码和/或调用默认值HDC hMemDC;HBITMAP bmpMem;HGDIOBJ hOldObj;HDC hDC = ::GetDC(GetSafeHwnd());CRect rcItem;GetClientRect(&rcItem);if (hDC){bmpMem = CreateCompatibleBitmap(hDC, rcItem.Width(), rcItem.Height());if (!bmpMem){::ReleaseDC(GetSafeHwnd(), hDC);return;}hMemDC = CreateCompatibleDC(hDC);if (!hMemDC){if (bmpMem){::DeleteObject(bmpMem);bmpMem = NULL;}::ReleaseDC(GetSafeHwnd(), hDC);return;}hOldObj = ::SelectObject(hMemDC, bmpMem);RECT rectTmp = { 0 };rectTmp = rcItem;MapWindowPoints(GetParent(), &rectTmp);if (m_BkImg.IsNull() == false)m_BkImg.Draw(hMemDC, 0, 0, rectTmp.right - rectTmp.left, rectTmp.bottom - rectTmp.top, rectTmp.left, rectTmp.top, rectTmp.right - rectTmp.left, rectTmp.bottom - rectTmp.top);int nW = rcItem.right - rcItem.left;int nH = rcItem.bottom - rcItem.top;m_imgFloat.AlphaBlend(hMemDC, 0, 0, nW, nH, 0, 0,nW,nH);::BitBlt(hDC, 0, 0, nW, nH, hMemDC, 0, 0, SRCCOPY);SelectObject(hMemDC, hOldObj);if (bmpMem){::DeleteObject(bmpMem);bmpMem = NULL;}if (hMemDC){::DeleteDC(hMemDC);hMemDC = NULL;}::ReleaseDC(GetSafeHwnd(), hDC);}CButton::OnMouseHover(nFlags, point);
}void CMyButton::OnMouseLeave()
{// TODO:  在此添加消息处理程序代码和/或调用默认值CButton::OnMouseLeave();InvalidateRect(NULL);m_bIsInWnd = FALSE;
}