美化VC界面(用户登录界面)
源代码:下载
VC开发程序单调的界面相信大家都是深有感触，提到界面美化编程，人们都会说做界面不要用VC写，太难了。
一句俗语：难者不会，会者不难。VC的美化界面编程并没有人们想像的那么难。这篇文章是我写的一个用户登录界面，但界面被我美化了，我将一步一步的来讲解它的美化界面的实现步骤。相信有了这篇文章，你的VC界面从此也能绚丽多彩。
实现步骤：
第一步：美化界面的非客户区(重绘标题栏和界面边框)。
关键代码如下：
代码
//
函 数 名：DrawTitleBar
//
功能描述：绘制标题栏、边框颜色，绘制标题内容、图标和按钮
//
输入参数：pDC：设备指针
//
输出参数：void
//
创建日期：2006-2-20
//
修改日期：2006-2-20
//
作 者：joinclear
//
附加说明：无
void
CTitleBarColorDlg::DrawTitleBar(CDC
*
pDC)
{
if
(m_hWnd)
{
CBrush Brush(RGB(
187
,
200
,
143
));
CBrush
*
pOldBrush
=
pDC
->
SelectObject(
&
Brush);
CRect rtWnd, rtTitle, rtButtons;
GetWindowRect(
&
rtWnd);
//
取得标题栏的位置
//
SM_CXFRAME 窗口边框的边缘宽度
//
SM_CYFRAME 窗口边框的边缘高度
//
SM_CXSIZE 窗口标题栏宽度
//
SM_CYSIZE 窗口标题栏高度
rtTitle.left
=
GetSystemMetrics(SM_CXFRAME);
rtTitle.top
=
GetSystemMetrics(SM_CYFRAME);
rtTitle.right
=
rtWnd.right
-
rtWnd.left
-
GetSystemMetrics(SM_CXFRAME);
rtTitle.bottom
=
rtTitle.top
+
GetSystemMetrics(SM_CYSIZE);
CPoint point;
//
填充顶部框架
point.x
=
rtWnd.Width();
point.y
=
GetSystemMetrics(SM_CYSIZE)
+
GetSystemMetrics(SM_CYFRAME)
+
0
;
pDC
->
PatBlt(
0
,
0
, point.x, point.y, PATCOPY);
//
填充左侧框架
point.x
=
GetSystemMetrics(SM_CXFRAME)
-
1
;
point.y
=
rtWnd.Height()
-
1
;
pDC
->
PatBlt(
0
,
0
, point.x, point.y, PATCOPY);
//
填充底部框架
point.x
=
rtWnd.Width();
point.y
=
GetSystemMetrics(SM_CYFRAME);
pDC
->
PatBlt(
0
, rtWnd.Height()
-
point.y, point.x, point.y, PATCOPY);
//
填充右侧框架
point.x
=
GetSystemMetrics(SM_CXFRAME);
point.y
=
rtWnd.Height();
pDC
->
PatBlt(rtWnd.Width()
-
point.x,
0
, point.x, point.y, PATCOPY);
//
重画标题栏图标
m_rtIcon.left
=
rtTitle.left ;
m_rtIcon.top
=
rtTitle.top;
m_rtIcon.right
=
m_rtIcon.left
+
16
;
m_rtIcon.bottom
=
m_rtIcon.top
+
15
;
::DrawIconEx(pDC
->
m_hDC, m_rtIcon.left, m_rtIcon.top, AfxGetApp()
->
LoadIcon(IDR_MAINFRAME),
m_rtIcon.Width(), m_rtIcon.Height(),
0
, NULL, DI_NORMAL);
m_rtIcon.OffsetRect(rtWnd.TopLeft());
CBitmap
*
pBitmap
=
new
CBitmap;
CBitmap
*
pOldBitmap;
CDC
*
pDisplayMemDC
=
new
CDC;
pDisplayMemDC
->
CreateCompatibleDC(pDC);
//
重画关闭button
rtButtons.left
=
rtTitle.right
-
16
;
rtButtons.top
=
rtTitle.top
-
1
;
rtButtons.right
=
rtButtons.left
+
16
;
rtButtons.bottom
=
rtButtons.top
+
15
;
pBitmap
->
LoadBitmap(IDB_EXIT_FOCUS);
pOldBitmap
=
(CBitmap
*
)pDisplayMemDC
->
SelectObject(pBitmap);
pDC
->
BitBlt(rtButtons.left, rtButtons.top, rtButtons.Width(), rtButtons.Height(), pDisplayMemDC,
0
,
0
, SRCCOPY);
pDisplayMemDC
->
SelectObject(pOldBitmap);
m_rtButtExit
=
rtButtons;
m_rtButtExit.OffsetRect(rtWnd.TopLeft());
pBitmap
->
DeleteObject();
//
重画最大化/恢复button
rtButtons.right
=
rtButtons.left
-
3
;
rtButtons.left
=
rtButtons.right
-
16
;
if
(IsZoomed())
pBitmap
->
LoadBitmap(IDB_RESTORE_NORMAL);
else
pBitmap
->
LoadBitmap(IDB_MAX_NORMAL);
pOldBitmap
=
(CBitmap
*
)pDisplayMemDC
->
SelectObject(pBitmap);
pDC
->
BitBlt(rtButtons.left, rtButtons.top, rtButtons.Width(), rtButtons.Height(), pDisplayMemDC,
0
,
0
, SRCCOPY);
pDisplayMemDC
->
SelectObject(pOldBitmap);
m_rtButtMax
=
rtButtons;
m_rtButtMax.OffsetRect(rtWnd.TopLeft());
pBitmap
->
DeleteObject();
//
重画最小化button
rtButtons.right
=
rtButtons.left
-
3
;
rtButtons.left
=
rtButtons.right
-
16
;
pBitmap
->
LoadBitmap(IDB_MIN_NORMAL);
pOldBitmap
=
(CBitmap
*
)pDisplayMemDC
->
SelectObject(pBitmap);
pDC
->
BitBlt(rtButtons.left, rtButtons.top, rtButtons.Width(), rtButtons.Height(), pDisplayMemDC,
0
,
0
, SRCCOPY);
pDisplayMemDC
->
SelectObject(pOldBitmap);
m_rtButtMin
=
rtButtons;
m_rtButtMin.OffsetRect(rtWnd.TopLeft());
pBitmap
->
DeleteObject();
//
重画caption
int
nOldMode
=
pDC
->
SetBkMode(TRANSPARENT);
COLORREF clOldText
=
pDC
->
SetTextColor(RGB(
255
,
255
,
255
));
CFont m_captionFont;
m_captionFont.CreateFont(
18
,
//
字体的高度
0
,
//
字体的宽度
0
,
//
字体显示的角度
0
,
//
字体的角度
FW_BOLD,
//
字体的磅数
FALSE,
//
斜体字体
FALSE,
//
带下划线的字体
0
,
//
带删除线的字体
ANSI_CHARSET,
//
所需的字符集
OUT_DEFAULT_PRECIS,
//
输出的精度
CLIP_DEFAULT_PRECIS,
//
裁减的精度
DEFAULT_QUALITY,
//
逻辑字体与输出设备的实际字体之间的精度
DEFAULT_PITCH
|
FF_SWISS,
//
字体间距和字体集
_T(
"
Arial
"
));
//
字体名称
CFont
*
pOldFont
=
NULL;
pOldFont
=
pDC
->
SelectObject(
&
m_captionFont);
rtTitle.left
+=
m_rtIcon.Width ()
+
3
;
rtTitle.top
=
rtTitle.top;
rtTitle.bottom
=
rtTitle.top
+
30
;
CString m_strTitle;
GetWindowText(m_strTitle);
pDC
->
DrawText(m_strTitle,
&
rtTitle, DT_LEFT);
pDC
->
SetBkMode(nOldMode);
pDC
->
SetTextColor(clOldText);
ReleaseDC(pDisplayMemDC);
delete pDisplayMemDC;
delete pBitmap;
}
}
还有在非客户区 绘制鼠标的消息。分别为：
代码
void
CTitleBarColorDlg::OnNcLButtonDown(UINT nHitTest, CPoint point)
{
if
(m_rtButtExit.PtInRect(point))
//
关闭
SendMessage(WM_CLOSE);
else
if
(m_rtButtMin.PtInRect(point))
//
最小化
SendMessage(WM_SYSCOMMAND, SC_MINIMIZE, MAKELPARAM(point.x, point.y));
else
if
(m_rtButtMax.PtInRect(point))
{
if
(IsZoomed())
//
最大化
{
SendMessage(WM_SYSCOMMAND, SC_RESTORE, MAKELPARAM(point.x, point.y));
CRect rtWnd;
GetWindowRect(
&
rtWnd);
CRgn rgn;
rgn.CreateRoundRectRgn(
0
,
0
,rtWnd.Width(),rtWnd.Height(),
5
,
5
);
SetWindowRgn((HRGN)rgn,
true
);
Invalidate();
}
else
{
SendMessage(WM_SYSCOMMAND, SC_MAXIMIZE, MAKELPARAM(point.x, point.y));
CRect rtWnd;
GetWindowRect(
&
rtWnd);
CRgn rgn;
rgn.CreateRoundRectRgn(
0
,
0
,rtWnd.Width(),rtWnd.Height(),
5
,
5
);
SetWindowRgn((HRGN)rgn,
true
);
Invalidate();
}
}
else
if
(
!
IsZoomed())
Default();
}
void
CTitleBarColorDlg::OnNcMouseMove(UINT nHitTest, CPoint point)
{
CWindowDC dc(
this
);
CWindowDC
*
pDC
=
&
dc;
CDC
*
pDisplayMemDC
=
new
CDC;
pDisplayMemDC
->
CreateCompatibleDC(pDC);
CBitmap
*
pBitmap
=
new
CBitmap;
CBitmap
*
pOldBitmap;
CRect rtWnd, rtButton;
if
(pDC)
{
GetWindowRect(
&
rtWnd);
//
关闭button
if
(m_rtButtExit.PtInRect(point))
pBitmap
->
LoadBitmap(IDB_EXIT_NORMAL);
else
pBitmap
->
LoadBitmap(IDB_EXIT_FOCUS);
rtButton
=
m_rtButtExit;
rtButton.OffsetRect(
-
rtWnd.left,
-
rtWnd.top);
pOldBitmap
=
(CBitmap
*
)pDisplayMemDC
->
SelectObject(pBitmap);
pDC
->
BitBlt(rtButton.left, rtButton.top, rtButton.Width(), rtButton.Height(), pDisplayMemDC,
0
,
0
,
SRCCOPY);
pDisplayMemDC
->
SelectObject(pOldBitmap);
pBitmap
->
DeleteObject();
//
最大化/恢复button
if
(m_rtButtMax.PtInRect(point))
{
if
(IsZoomed())
pBitmap
->
LoadBitmap(IDB_RESTORE_FOCUS);
else
pBitmap
->
LoadBitmap(IDB_MAX_FOCUS);
}
else
{
if
(IsZoomed())
pBitmap
->
LoadBitmap(IDB_RESTORE_NORMAL);
else
pBitmap
->
LoadBitmap(IDB_MAX_NORMAL);
}
rtButton
=
m_rtButtMax;
rtButton.OffsetRect(
-
rtWnd.left,
-
rtWnd.top);
pOldBitmap
=
(CBitmap
*
)pDisplayMemDC
->
SelectObject(pBitmap);
pDC
->
BitBlt(rtButton.left, rtButton.top, rtButton.Width(), rtButton.Height(), pDisplayMemDC,
0
,
0
,
SRCCOPY);
pDisplayMemDC
->
SelectObject(pOldBitmap);
pBitmap
->
DeleteObject();
//
最小化button
if
(m_rtButtMin.PtInRect(point))
pBitmap
->
LoadBitmap(IDB_MIN_FOCUS);
else
pBitmap
->
LoadBitmap(IDB_MIN_NORMAL);
rtButton
=
m_rtButtMin;
rtButton.OffsetRect(
-
rtWnd.left,
-
rtWnd.top);
pOldBitmap
=
(CBitmap
*
)pDisplayMemDC
->
SelectObject(pBitmap);
pDC
->
BitBlt(rtButton.left, rtButton.top, rtButton.Width(), rtButton.Height(), pDisplayMemDC,
0
,
0
,
SRCCOPY);
pDisplayMemDC
->
SelectObject(pOldBitmap);
pBitmap
->
DeleteObject();
}
pDisplayMemDC
->
DeleteDC();
delete pDisplayMemDC;
delete pBitmap;
CDialog::OnNcMouseMove(nHitTest, point);
}
大部分实现如上代码所示具体实现请参照程序附带的源代码。
第二步：改变窗口边框为圆角。
关键代码如下：
代码
int
CTitleBarColorDlg::OnCreate(LPCREATESTRUCT lpCreateStruct)
{
if
(CDialog::OnCreate(lpCreateStruct)
==
-
1
)
return
-
1
;
CRect rtWnd;
GetWindowRect(
&
rtWnd);
CRgn rgn;
rgn.CreateRoundRectRgn(
0
,
0
,rtWnd.Width(),rtWnd.Height(),
5
,
5
);
SetWindowRgn((HRGN)rgn,
true
);
return
0
;
}
第三步：填充背景。
关键代码如下：
代码
BOOL CTitleBarColorDlg::OnEraseBkgnd(CDC
*
pDC)
{
BOOL retValue
=
CDialog::OnEraseBkgnd(pDC);
CRect rc;
GetClientRect(
&
rc);
pDC
->
FillSolidRect(
&
rc,RGB(
236
,
233
,
216
));
return
retValue;
}
第四步：绘制按钮。
具体请参考源代码中类CXPButton.h、CXPButton.cpp
第五步：绘制编辑框。
具体请参考源代码中类COwnerEdit.h、COwnerEdit.cpp
第六步：绘制静态字体和颜色。
这一步本来也写了一个类的，但想想用OnCtlColor()还是能很好的实现的，就没写。具体实现请看OnCtlColor()中的实现。
以上代码具体实现的细节问题，你可以下载例子代码，仔细查看其源码实现(内有详细注释)。