MFC DLEdit 设计属于自己的编辑框
2012-02-04 13:00 by 捣乱小子, 3543 阅读, 5 评论, 收藏, 编辑
起因
无意间看到了大牛们写的自定义编辑框控件,于是找了个时间自己写了一个,加深了对MFC消息机制和一些功能的了解。
分析
先来看一张QQ2011的登录窗口,发现当鼠标悬停在编辑框上的时候,会有悬停边框高亮,这样给用户一种很绚丽的视觉享受,但我相信大家每天都上q,从而都忽略了这些美丽,细心分析一下,QQ的每一个器官甚至一根毛都是经过精心设计的。当编辑框失去输入焦点,而编辑框内文本为空的时候,会有灰色提示文本,提示用户输入。
还可以有好多的自定编辑框功能,美化我们的编辑框。
具体实现和细节
在之前《MFC自动隐藏》这篇文章中的技术细节有与DLEdit相似的地方,那就是鼠标悬停的判断。 当鼠标悬停的时候,DLEdit要绘上编辑框“悬停框条”,因此什么时候“鼠标是悬停状态”的判断很重要,为了不造成文章的累赘,点这里《MFC 鼠标去留》。在程序当中要有一BOOL变量m_bHover来标志鼠标是否悬停在控件上面。这样一来只要m_bHover为true,就可以在WM_ERASEBKGND的处理函数当中来绘绚丽的“悬停框条”。
没错,几乎所有的绘图都在WM_ERASEBKGND的处理函数当中进行,CEdit没有SS_OWNERDRAW风格,因此也没有DrawItem来对自身进行绘制,所以要用WM_ERASEBKGND的处理函数中绘制编辑框的背景,自定义美化的工作很大一部分落在其上。
其实DLEdit作为控件,很多的消息是不能够接受并处理的,相反的,它们要发送给主窗口(parentWnd),从而交给主窗口来处理。就比如WM_DRAWITEM消息,控件窗口(假设它具有*S_OWNERDRAW风格)根本就不会接受到它,更不会去调用DrawItem函数来自绘;它是被发送到主窗口,调用主窗口的afx_msg void OnDrawItem(int nIDCtl,LPDRAWITEMSTRUCT lpDrawItemStruct )函数,其内部实现会根据nIDCtl控件ID来绘控件;当然可以在OnDrawItem中实现所有控件的绘制,但是对于控件很多的窗口来说,OnDrawItem会倍感压力,所以控件本身的DrawItem有了施展身手的机会。在win32 sdk纯C的编程中,所有的控件的自绘都在“case WM_DRAWITEM:”后面得到实现,但是MFC为了更好结合面向对象思想,所以控件窗口有自己的DrawItem,并由OnDrawItem来调用。同样,WM_CTLCOLOR消息也是一样的。
细心的人都会发现,如果在控件类(或者说是子类)中添加WM_CTLCOLOR或者通知码处理消息,在消息映射表中,我们都会发现:
ON_CONTROL_REFLECT(EN_CHANGE,&CDLEdit::OnEnChange)
ON_WM_CTLCOLOR_REFLECT()
在宏的最后都有REFLECT字眼,就是映射的意思。以ON_CONTROL_REFLECT为例,MFC中定义如下:
#define ON_WM_CTLCOLOR_REFLECT() \
{ WM_CTLCOLOR+WM_REFLECT_BASE, 0, 0, 0, AfxSig_hDw, \
(AFX_PMSG)(AFX_PMSGW) \
(static_cast< HBRUSH (AFX_MSG_CALL CWnd::*)(CDC*, UINT) > ( &ThisClass :: CtlColor)) },
有这种映射,就把WM_CTLCOLOR和CtlColor函数在控件类里对应起来了。在主窗口中添加WM_CTLCOLOR消息响应函数,里面有我们很熟悉的一句话:
HBRUSH hbr = CDialog::OnCtlColor(pDC, pWnd, nCtlColor);
这一句就是根据子窗口(或者子控件,nCtlColor来指定)是否有CtlColor,来决定是否执行子窗口的CtlColor,不信你可以一步一步调试下去。另外在CSDN里唠叨一篇好文章,思路很清晰,《WM_DRAWITEM与DrawItem()的讨论》。
来看看自定义的编辑框:
说明:
- 悬停边框:鼠标悬停才绘制的边框;
- 默认边框:编辑框外围的一个实线框,与悬停边框紧贴;
- 编辑框框条:紧贴编辑框的框条,一般选择淡色为好。
在编辑框的CtlColor函数中,pDC->SetBkColor(clr),的clr是指文本颜色的背景色,而CtlColor函数的返回值是编辑框的画刷句柄(return hbr),所以,如果你不能保证clr和返回画刷的颜色一致,那么编辑框就会出现两种颜色,上面是文本的背景色,而下面是编辑框的背景色,两者是不同的。
功能图示
看看与普通的编辑框有什么不同:
边框框条就不同,接着有灰色字体提示输入。
具备输入焦点后,底色改变。
具备输入焦点后,字体变粗。
具备输入焦点后,有阴影。总之上面四个编辑框比起下面的两个会更个性化。
关于编辑框圆角功能
还有很多的功能可以自定义,比如自定义背景图案等等,抛砖引玉,抛砖引玉。如果大家有好建议,欢迎拍砖讨论。看了网上大牛们的代码,有“圆角编辑框”的功能,这只要将代码中的pDC->Rectangle(rct)变pDC->RoundRect(..)就可以了。
收获与疑问
看着自己也能写出这样的东西,还是有点欣慰的。有着大牛们的引导,相信很多的东西都可以轻车熟路。我认为,学习最忌讳的就是走弯路,在看似时髦但又百无聊赖的技术上浪费大量的时间,基础课程很重要,这才是一成不变的东西,学有余力可以接触具体的技术。有一个疑问,不知道花时间在诸如这些鸡毛蒜皮的技术上,到以后会不会产生价值,我会不会在浪费时间?
附件下载:DLEdit 工程
捣乱小子 2012年2月4日星期六
出处:http://www.cnblogs.com/daoluanxiaozi/archive/2012/02/04/2337016.html