VC 仿QQ窗口靠边自动收缩隐藏效果

原文地址：http://www.newxing.com/Tech/Program/VC/QQ_169.html

源代码下载地址：http://www.newxing.com/Code/VC/jiemian/84.html

一、观察

模仿前最重要的一步就是观察，经过半天对QQ的摆弄和摸索，总结出了以下一些特点：

1、窗口开始粘附时,检测的是鼠标坐标与桌面边界的距离，特别地，粘附在下面的时候，检测的是与任务栏的距离；

2、在向上移动窗口时，窗口边界永远不会超出桌面上面边界；

3、窗口是个 TopMost 风格；

4、当窗口粘附在上面、左边或右边并显示时，你把鼠标移动到最顶端，光标变成改变窗口大小的图标，而单单是把窗口的top坐标设置为0是不行的；

5、粘附在下面的时候，当处于移动状态，那么窗口的底边是与任务栏顶边对齐的，但从隐藏到显示的时候，窗口的底端是与屏幕底边对齐的；

6、隐藏后显露出来的那条线可能是一个Border，但肯定的是绝不包含Client区域；

7、关于响应鼠标的进入与移出窗口，绝对不是WM_MOUSEMOVE、WM_MOUSELEAVE。证明：你以及其慢的速度接触隐藏状态的QQ边界，你会发现几乎是“一触即发”，你又以及其慢的速度移出显示状态的QQ，你会发现它的收缩反而不是“一触即发”的，而是离边缘10象素左右。而WM_MOUSEMOVE，WM_MOUSELEAVE，只有在进入、移出Client区域才响应，明显和QQ不同，其实从第6点也可以知道；

8、粘附在两边的时候，高度会调整为桌面上边界到任务栏下边界的距离；

9、在“拖动时显示窗口内容”模式下（桌面属性－外观－效果），粘附在两边的拖动出来时；如果收缩之前高度比收缩后小则回复原来高度，在非“拖动时显示窗口内容”模式下，光栅会回复原来高度，但释放左键时，高度却是收缩时调整后的高度，一开始我以为这是个BUG，但我编写时同样出现这个问题，发现这两种模式会影响WM_MOVING参数的意义；

10、粘附在两边的时候当你设置任务栏自动隐藏，QQ窗口会自动调整高度充满屏幕高度；

11、窗口显示或隐藏不是一瞬间的，这点在第9点提到的两种模式下，会有所不同；

12、任务栏并不显示QQ窗口；

二、编写代码

观察完毕，就开始编写了。
首先新建一个基于对话框的MFC程序，命名为QQHideWnd，在对话框属性的styles页把border改为Resizing，你也可同时把Entended styles 的 tool window 钩上，对于这点我在程序了动态修改了。
在QQHideWndDlg.h头文件添加以下成员函数：

[cpp]  view plain  copy

1. protected:  
2.     //修正移动时窗口的大小  
3.     void FixMoving(UINT fwSide, LPRECT pRect);  
4.     //修正改改变窗口大小时窗口的大小  
5.     void FixSizing(UINT fwSide, LPRECT pRect);  
6.     //从收缩状态显示窗口  
7.     void DoShow();  
8.     //从显示状态收缩窗口  
9.     void DoHide();  
10.     //重载函数,只是为了方便调用  
11.     BOOL SetWindowPos(const CWnd* pWndInsertAfter,  
12.                       LPCRECT pCRect, UINT nFlags = SWP_SHOWWINDOW);  

继续添加成员变量：

[cpp]  view plain  copy

1. private:  
2.     BOOL m_isSizeChanged;   //窗口大小是否改变了   
3.     BOOL m_isSetTimer;      //是否设置了检测鼠标的Timer  
4.       
5.     INT  m_oldWndHeight;    //旧的窗口宽度  
6.     INT  m_taskBarHeight;   //任务栏高度  
7.     INT  m_edgeHeight;      //边缘高度  
8.     INT  m_edgeWidth;       //边缘宽度  
9.   
10.     INT  m_hideMode;        //隐藏模式  
11.     BOOL m_hsFinished;      //隐藏或显示过程是否完成  
12.         BOOL m_hiding;          //该参数只有在!m_hsFinished才有效  
13.                             //真:正在隐藏,假:正在显示  

增加消息响应，需要注意的是有些消息你只有把右下角的 Filter for message设置为window才能看到。
WM_ NCHITTEST
WM_MOVING
WM_CREATE
WM_TIMER

然后来到对应的cpp文件，在头部定义一些宏：

[cpp]  view plain  copy

1. //收缩模式  
2. #define HM_NONE     0   //不收缩  
3. #define HM_TOP      1   //向上收缩  
4. #define HM_BOTTOM   2   //向下收缩  
5. #define HM_LEFT     3   //向左收缩  
6. #define HM_RIGHT    4   //向右收缩  
7.   
8. #define CM_ELAPSE   200 //检测鼠标是否离开窗口的时间间隔  
9. #define HS_ELAPSE   5   //隐藏或显示过程每步的时间间隔  
10. #define HS_STEPS    10  //隐藏或显示过程分成多少步  
11.   
12. #define INTERVAL    20  //触发粘附时鼠标与屏幕边界的最小间隔,单位为象素  
13. #define INFALTE     10  //触发收缩时鼠标与窗口边界的最小间隔,单位为象素  
14. #define MINCX       200 //窗口最小宽度  
15. #define MINCY       400 //窗口最小高度  

然后在构造函数初始化成员变量

[cpp]  view plain  copy

1. m_isSizeChanged = FALSE;  
2. m_isSetTimer = FALSE;  
3. m_hsFinished = TRUE;  
4.        m_hiding = FALSE;  
5.   
6. m_oldWndHeight = MINCY;  
7. m_taskBarHeight = 30;  
8. m_edgeHeight = 0;  
9. m_edgeWidth  =0;  
10. m_hideMode = HM_NONE;  

完成了一些初始的工作，那么就开始进入关键的函数实现了。首先是在OnCreate做些窗口的初始化和获得一些系统信息。
【代码一】

[cpp]  view plain  copy

1. int CQQHideWndDlg::OnCreate(LPCREATESTRUCT lpCreateStruct)  
2. {  
3. if (CDialog::OnCreate(lpCreateStruct) == -1)  
4. return -1;  
5.   
6. // TODO: Add your specialized creation code here //获得任务栏高度  
7. CWnd* p;  
8. p = this->FindWindow("Shell_TrayWnd",NULL);  
9. if(p != NULL)  
10. {  
11. CRect tRect;  
12. p->GetWindowRect(tRect);  
13. m_taskBarHeight = tRect.Height();  
14. }  
15.   
16. //修改风格使得他不在任务栏显示  
17. ModifyStyleEx(WS_EX_APPWINDOW, WS_EX_TOOLWINDOW);  
18. //去掉关闭按键(如果想画3个按键的话)  
19. //ModifyStyle(WS_SYSMENU,NULL);  
20.   
21. //获得边缘高度和宽度  
22. m_edgeHeight = GetSystemMetrics(SM_CYEDGE);  
23. m_edgeWidth = GetSystemMetrics(SM_CXFRAME);  
24.   
25. return 0;  
26. }  

接着如何知道鼠标进入或移出窗口呢？在前面我已经证明了WM_MOUSEMOVE和WM_MOUSELEAVE不符合我们的要求，于是我用了WM_ NCHITTEST这个消息，你可以看到我在这个消息响应函数中用了两个SetTimer，一个用于检测鼠标是否离开，一个用于伸缩过程，不管你喜欢不喜欢，要达到第7点和第11点，这个是必须的，考虑的效率问题，在不需要的时候关闭这些Timer就好了。

【代码二】

[cpp]  view plain  copy

1. UINT CQQHideWndDlg::OnNcHitTest(CPoint point)  
2. {  
3. // TODO: Add your message handler code here and/or call default  
4. CString str;  
5. str.Format("Mouse (%d,%d)",point.x,point.y);  
6. GetDlgItem(IDC_CURSOR)->SetWindowText(str);  
7. if(m_hideMode != HM_NONE && !m_isSetTimer &&  
8. //防止鼠标超出屏幕右边时向右边收缩造成闪烁  
9. point.x < GetSystemMetrics(SM_CXSCREEN) + INFALTE)  
10. { //鼠标进入时,如果是从收缩状态到显示状态则开启Timer  
11. SetTimer(1,CM_ELAPSE,NULL);  
12. m_isSetTimer = TRUE;  
13.   
14. m_hsFinished = FALSE;  
15. m_hiding = FALSE;  
16. SetTimer(2,HS_ELAPSE,NULL); //开启显示过程  
17. }  
18. return CDialog::OnNcHitTest(point);  
19. }  

然后再OnTimer中：

【代码三】

[cpp]  view plain  copy

1. void CQQHideWndDlg::OnTimer(UINT nIDEvent)  
2. {  
3. // TODO: Add your message handler code here and/or call default  
4. if(nIDEvent == 1 )  
5. {  
6. POINT curPos;  
7. GetCursorPos(&curPos);  
8.   
9. CString str;  
10. str.Format("Timer On(%d,%d)",curPos.x,curPos.y);  
11. GetDlgItem(IDC_TIMER)->SetWindowText(str);  
12.   
13. CRect tRect;  
14. //获取此时窗口大小  
15. GetWindowRect(tRect);  
16. //膨胀tRect,以达到鼠标离开窗口边沿一定距离才触发事件  
17. tRect.InflateRect(INFALTE,INFALTE);  
18.   
19. if(!tRect.PtInRect(curPos)) //如果鼠标离开了这个区域  
20. {  
21. KillTimer(1); //关闭检测鼠标Timer  
22. m_isSetTimer = FALSE;  
23. GetDlgItem(IDC_TIMER)->SetWindowText("Timer Off");  
24.   
25. m_hsFinished = FALSE;  
26. m_hiding = TRUE;  
27. SetTimer(2,HS_ELAPSE,NULL); //开启收缩过程  
28. }  
29. }  
30.   
31. if(nIDEvent == 2)  
32. {  
33. if(m_hsFinished) //如果收缩或显示过程完毕则关闭Timer  
34. KillTimer(2);  
35. else  
36. m_hiding ? DoHide() : DoShow();  
37. }  
38. CDialog::OnTimer(nIDEvent);  
39. }  

暂时不管OnTimer中的DoHide(); DoShow();

先来看看核心的函数之一的 FixMoving，该函数在OnMoving中被调用，FixMoving通过检测鼠标位置和窗口位置来决定窗口的收缩模式，并修正粘附边界时窗口的位置，从而达到像移动QQ时出现的效果。

【代码四】

[cpp]  view plain  copy

1. void CQQHideWndDlg::FixMoving(UINT fwSide, LPRECT pRect)  
2. {  
3. POINT curPos;  
4. GetCursorPos(&curPos);  
5. INT screenHeight = GetSystemMetrics(SM_CYSCREEN);  
6. INT screenWidth = GetSystemMetrics(SM_CXSCREEN);  
7. INT height = pRect->bottom - pRect->top;  
8. INT width = pRect->right - pRect->left;  
9.   
10. if (curPos.y <= INTERVAL)  
11. { //粘附在上边  
12. pRect->bottom = height - m_edgeHeight;  
13. pRect->top = -m_edgeHeight;  
14. m_hideMode = HM_TOP;  
15. }  
16. else if(curPos.y >= (screenHeight - INTERVAL - m_taskBarHeight))  
17. { //粘附在下边  
18. pRect->top = screenHeight - m_taskBarHeight - height;  
19. pRect->bottom = screenHeight - m_taskBarHeight;  
20. m_hideMode = HM_BOTTOM;  
21. }  
22. else if (curPos.x < INTERVAL)  
23. { //粘附在左边  
24. if(!m_isSizeChanged)  
25. {  
26. CRect tRect;  
27. GetWindowRect(tRect);  
28. m_oldWndHeight = tRect.Height();  
29. }  
30. pRect->right = width;  
31. pRect->left = 0;  
32. pRect->top = -m_edgeHeight;  
33. pRect->bottom = screenHeight - m_taskBarHeight;  
34. m_isSizeChanged = TRUE;  
35. m_hideMode = HM_LEFT;  
36. }  
37. else if(curPos.x >= (screenWidth - INTERVAL))  
38. { //粘附在右边  
39. if(!m_isSizeChanged)  
40. {  
41. CRect tRect;  
42. GetWindowRect(tRect);  
43. m_oldWndHeight = tRect.Height();  
44. }  
45. pRect->left = screenWidth - width;  
46. pRect->right = screenWidth;  
47. pRect->top = -m_edgeHeight;  
48. pRect->bottom = screenHeight - m_taskBarHeight;  
49. m_isSizeChanged = TRUE;  
50. m_hideMode = HM_RIGHT;  
51. }  
52. else  
53. { //不粘附  
54. if(m_isSizeChanged)  
55. { //如果收缩到两边,则拖出来后会变回原来大小  
56. //在"拖动不显示窗口内容下"只有光栅变回原来大小  
57. pRect->bottom = pRect->top + m_oldWndHeight;  
58. m_isSizeChanged = FALSE;  
59. }  
60. if(m_isSetTimer)  
61. { //如果Timer开启了,则关闭之  
62. if(KillTimer(1) == 1)  
63. m_isSetTimer = FALSE;  
64. }  
65. m_hideMode = HM_NONE;  
66. GetDlgItem(IDC_TIMER)->SetWindowText("Timer off");  
67. }  
68. }  

收缩模式和位置决定后，剩下的工作就由最后两个核心函数完成了：实现收缩的DoHide()，实现伸展的DoShow()。在这两个过程中m_hsFinished，m_hiding 这两个变量起到很重要的控制作用。由于伸缩过程没完成时，hsFinished始终为FALSE，所以Timer 2 不会关闭，于是在OnTimer中会重复调用这两个函数之一，在这两个函数体内，窗口位置有规律地递减或递增就可以达到QQ的“抽屉”效果了，有趣的是即使伸缩过程还没完成，你也可以在这个过程中改变m_hiding这个值来决定他是伸还是缩，正如QQ一样。你可以把Timer 2 的事件间隔调大一点，然后在窗口伸缩时，鼠标来回地进出窗口就会很容易看到这样有趣的效果（还没缩进去又被拉了出来，或者还没拉出来又缩进去了）。

【代码五】

[cpp]  view plain  copy

1. void CQQHideWndDlg::DoHide()  
2. {  
3. if(m_hideMode == HM_NONE)  
4. return;  
5.   
6. CRect tRect;  
7. GetWindowRect(tRect);  
8.   
9. INT height = tRect.Height();  
10. INT width = tRect.Width();  
11.   
12. INT steps = 0;  
13.   
14. switch(m_hideMode)  
15. {  
16. case HM_TOP:  
17. steps = height/HS_STEPS;  
18. tRect.bottom -= steps;  
19. if(tRect.bottom <= m_edgeWidth)  
20. { //你可以把下面一句替换上面的 ...+=|-=steps 达到取消抽屉效果  
21. //更好的办法是添加个BOOL值来控制,其他case同样.  
22. tRect.bottom = m_edgeWidth;  
23. m_hsFinished = TRUE; //完成隐藏过程  
24. }  
25. tRect.top = tRect.bottom - height;  
26. break;  
27. case HM_BOTTOM:  
28. steps = height/HS_STEPS;  
29. tRect.top += steps;  
30. if(tRect.top >= (GetSystemMetrics(SM_CYSCREEN) - m_edgeWidth))  
31. {  
32. tRect.top = GetSystemMetrics(SM_CYSCREEN) - m_edgeWidth;  
33. m_hsFinished = TRUE;  
34. }  
35. tRect.bottom = tRect.top + height;  
36. break;  
37. case HM_LEFT:  
38. steps = width/HS_STEPS;  
39. tRect.right -= steps;  
40. if(tRect.right <= m_edgeWidth)  
41. {  
42. tRect.right = m_edgeWidth;  
43. m_hsFinished = TRUE;  
44. }  
45. tRect.left = tRect.right - width;  
46. tRect.top = -m_edgeHeight;  
47. tRect.bottom = GetSystemMetrics(SM_CYSCREEN) - m_taskBarHeight;  
48. break;  
49. case HM_RIGHT:  
50. steps = width/HS_STEPS;  
51. tRect.left += steps;  
52. if(tRect.left >= (GetSystemMetrics(SM_CXSCREEN) - m_edgeWidth))  
53. {  
54. tRect.left = GetSystemMetrics(SM_CXSCREEN) - m_edgeWidth;  
55. m_hsFinished = TRUE;  
56. }  
57. tRect.right = tRect.left + width;  
58. tRect.top = -m_edgeHeight;  
59. tRect.bottom = GetSystemMetrics(SM_CYSCREEN) - m_taskBarHeight;  
60. break;  
61. default:  
62. break;  
63. }  
64.   
65. SetWindowPos(&wndTopMost,tRect);  
66. }  

【代码六】

[cpp]  view plain  copy

1. void CQQHideWndDlg::DoShow()  
2. {  
3. if(m_hideMode == HM_NONE)  
4. return;  
5.   
6. CRect tRect;  
7. GetWindowRect(tRect);  
8. INT height = tRect.Height();  
9. INT width = tRect.Width();  
10.   
11. INT steps = 0;  
12.   
13. switch(m_hideMode)  
14. {  
15. case HM_TOP:  
16. steps = height/HS_STEPS;  
17. tRect.top += steps;  
18. if(tRect.top >= -m_edgeHeight)  
19. { //你可以把下面一句替换上面的 ...+=|-=steps 达到取消抽屉效果  
20. //更好的办法是添加个BOOL值来控制,其他case同样.  
21. tRect.top = -m_edgeHeight;  
22. m_hsFinished = TRUE; //完成显示过程  
23. }  
24. tRect.bottom = tRect.top + height;  
25. break;  
26. case HM_BOTTOM:  
27. steps = height/HS_STEPS;  
28. tRect.top -= steps;  
29. if(tRect.top <= (GetSystemMetrics(SM_CYSCREEN) - height))  
30. {  
31. tRect.top = GetSystemMetrics(SM_CYSCREEN) - height;  
32. m_hsFinished = TRUE;  
33. }  
34. tRect.bottom = tRect.top + height;  
35. break;  
36. case HM_LEFT:  
37. steps = width/HS_STEPS;  
38. tRect.right += steps;  
39. if(tRect.right >= width)  
40. {  
41. tRect.right = width;  
42. m_hsFinished = TRUE;  
43. }  
44. tRect.left = tRect.right - width;  
45. tRect.top = -m_edgeHeight;  
46. tRect.bottom = GetSystemMetrics(SM_CYSCREEN) - m_taskBarHeight;  
47. break;  
48. case HM_RIGHT:  
49. steps = width/HS_STEPS;  
50. tRect.left -= steps;  
51. if(tRect.left <= (GetSystemMetrics(SM_CXSCREEN) - width))  
52. {  
53. tRect.left = GetSystemMetrics(SM_CXSCREEN) - width;  
54. m_hsFinished = TRUE;  
55. }  
56. tRect.right = tRect.left + width;  
57. tRect.top = -m_edgeHeight;  
58. tRect.bottom = GetSystemMetrics(SM_CYSCREEN) - m_taskBarHeight;  
59. break;  
60. default:  
61. break;  
62. }  
63.   
64. SetWindowPos(&wndTopMost,tRect);  
65. }  
66.   
67. BOOL CQQHideWndDlg::SetWindowPos(const CWnd* pWndInsertAfter, LPCRECT pCRect, UINT nFlags)  
68. {  
69. return CDialog::SetWindowPos(pWndInsertAfter,pCRect->left, pCRect->top,  
70. pCRect->right - pCRect->left, pCRect->bottom - pCRect->top, nFlags);  
71. }  

到此，程序终于完成了。在我的源代码中还有对WM_SIZING的处理和定义了与之相关的宏，这些主要是控制窗口在调整大小时不能超过最小的宽度和高度，与QQ的自动伸缩无关，所以不在这里提及了。

三、结束语

虽然还不能算是完美的模仿，但效果已经非常非常的接近了。也许有人会奇怪为什么要用Tool Window 风格，这是因为，这样在任务栏中不会显示窗口。从QQ的标题栏高度也可以判断出他也是这种风格，但这样一来就不能拥有最小化、最大化按键了。实际上QQ的最大化、最小化和关闭按键都是用DC画上去的。如何在Caption上增加按键，外国一些开源网站有源代码，我下载并看了一下，发现里面有个知识点很有趣，那就是更改消息路由，有兴趣的可以去下载来学习一下。