QQ分组控件的简单实现

QQ的上下拉的抽屉式控件估计已经深入民心了。课程设计作业需要，花了半天时间写了一个类似的控件，可以实现对每个抽屉按钮设置不同的视图控件，不过没有美化，只是有骨没有肉的控件。

//QQGroupCtrl.h文件

#pragma once
#include <vector>
using namespace std;
// QQGroupCtrl
#define GROUPCTRL_HIGHT 22
#define GROUPCTRL_INITBUTTONID 90000//分组按钮的id号，自增
//QQ分组按钮
class QQGroupButton : public CButton
{
DECLARE_DYNAMIC(QQGroupButton)
public:
QQGroupButton();
virtual ~QQGroupButton();
protected:
DECLARE_MESSAGE_MAP()
public:
afx_msg void OnLButtonDown(UINT nFlags, CPoint point);
};
//分组按钮信息，关联按钮和窗口
class TGroupInfo
{
public:
TGroupInfo():m_szName(_T("")), m_pWnd(NULL){}
virtual ~TGroupInfo(){}
public:
CString		m_szName;											// 组名称
CWnd		*m_pWnd;											// 组窗口指针
QQGroupButton	*Button;												//自己
};
//分组控件，包含N个分组
class QQGroupCtrl : public CWnd
{
DECLARE_DYNAMIC(QQGroupCtrl)
public:
QQGroupCtrl();
virtual ~QQGroupCtrl();
protected:
DECLARE_MESSAGE_MAP()
public:
virtual BOOL Create(LPCTSTR lpszWindowName, DWORD dwStyle, const RECT &rect,
CWnd *pParentWnd, UINT uID);
bool AddOneGroup(TCHAR* szName, CWnd *pWnd = NULL);
void ChangeView(QQGroupButton* selectButton);
private:
vector<TGroupInfo*>		m_vecGroups;// 组信息列表
int		m_iDown;		// 当前鼠标按下的索引
CRect	m_rtClient;		// 客户区大小
int		m_initBUttonID;	//初始化按钮id
};

//QQGroupCtrl.cpp文件

// QQGroupCtrl.cpp : 实现文件
//
#include "stdafx.h"
#include "CustomQQ.h"
#include "QQGroupCtrl.h"
#include "Mmsystem.h"
// QQGroupButton
IMPLEMENT_DYNAMIC(QQGroupButton, CButton)
QQGroupButton::QQGroupButton()
{
}
QQGroupButton::~QQGroupButton()
{
}
BEGIN_MESSAGE_MAP(QQGroupButton, CButton)
ON_WM_LBUTTONDOWN()
END_MESSAGE_MAP()
void QQGroupButton::OnLButtonDown(UINT nFlags, CPoint point)
{
QQGroupCtrl* parent=(QQGroupCtrl*)this->GetParent();
parent->ChangeView(this);//分组按钮
CButton::OnLButtonDown(nFlags,point);
}
//////////////////////////////////////////////////////////////////////////
// QQGroupCtrl
IMPLEMENT_DYNAMIC(QQGroupCtrl, CWnd)
QQGroupCtrl::QQGroupCtrl()
{
m_initBUttonID=GROUPCTRL_INITBUTTONID;
m_iDown=0;//选中的分组索引
}
//析构
QQGroupCtrl::~QQGroupCtrl()
{
vector <TGroupInfo*>::iterator Iter=m_vecGroups.begin( ) ;
while (Iter != m_vecGroups.end( ))
{
TGroupInfo* groupinfo=*Iter;

if (groupinfo->Button)
{
delete groupinfo->Button;
}
if (groupinfo->m_pWnd)
{
delete groupinfo->m_pWnd;
}
Iter++ ;
}
}
BEGIN_MESSAGE_MAP(QQGroupCtrl, CWnd)
END_MESSAGE_MAP()
BOOL QQGroupCtrl::Create(LPCTSTR lpszWindowName, DWORD dwStyle, const RECT &rect,
CWnd *pParentWnd, UINT uID)
{
CWnd* pWnd = this;
return pWnd->Create(NULL, lpszWindowName, dwStyle, rect, pParentWnd, uID);
}
bool QQGroupCtrl::AddOneGroup(TCHAR* szName, CWnd *pWnd)
{
TGroupInfo* ginfo=new TGroupInfo;
ginfo->m_szName=CString(szName);
ginfo->m_pWnd=pWnd;
QQGroupButton* b=new QQGroupButton;
CRect rect(0,0,0,0);
b->Create(ginfo->m_szName,WS_CHILD|WS_VISIBLE,rect,this,m_initBUttonID);
ginfo->Button=b;
m_vecGroups.push_back(ginfo);
//每加进一个组，重新计算面板的大小
CRect groupClient;
GetClientRect(&groupClient);
int index=0;
int count=m_vecGroups.size();//总数
vector <TGroupInfo*>::iterator Iter;
for ( Iter = m_vecGroups.begin( ) ; Iter != m_vecGroups.end( ) ; Iter++ )
{
TGroupInfo* groupinfo=*Iter;
//计算按钮的坐标
if (index==0)
{
CPoint leftPoint(0,0);
CSize bsize(groupClient.Width(),GROUPCTRL_HIGHT);
CRect rect(leftPoint,bsize);
groupinfo->Button->MoveWindow(rect);
}
else
{
//从下往上数的高度是bottom-(count-index)*buttonHight
CSize bsize(groupClient.Width(),GROUPCTRL_HIGHT);
CPoint leftPoint(0,groupClient.bottom-(count-index)*GROUPCTRL_HIGHT);
CRect rect(leftPoint,bsize);
groupinfo->Button->MoveWindow(rect);
}
//计算按钮的所对应窗口的坐标,即传来的pwnd
if (groupinfo->m_pWnd)//移动到按钮的下面
{
CPoint leftPoint(0,index*GROUPCTRL_HIGHT+GROUPCTRL_HIGHT);
CSize bsize(groupClient.Width(),groupClient.Height()-count*GROUPCTRL_HIGHT);
CRect rect(leftPoint,bsize);
groupinfo->m_pWnd->MoveWindow(rect);
if (index==0)
{
groupinfo->m_pWnd->ShowWindow(SW_SHOW);
}
else
{
groupinfo->m_pWnd->ShowWindow(SW_HIDE);
}
}
index++;
m_initBUttonID++;
}
GetClientRect(&m_rtClient);
return true;
}
void QQGroupCtrl::ChangeView(QQGroupButton* selectButton)
{
vector <TGroupInfo*>::iterator Iter;
int selectIndex=0;
BOOL bPtIn=FALSE;//鼠标是否点中按钮
int count=m_vecGroups.size();
//得到上一次按钮，隐藏上次的pwnd
TGroupInfo* &lastinfo=m_vecGroups.at(m_iDown);
if (lastinfo->m_pWnd)
{
lastinfo->m_pWnd->ShowWindow(SW_HIDE);
}

//得到选择索引
for ( Iter = m_vecGroups.begin( ) ; Iter != m_vecGroups.end( ) ; Iter++ )
{
TGroupInfo* groupinfo=*Iter;
if (selectButton==groupinfo->Button)
{
bPtIn=TRUE;
break;
}
selectIndex++;
}
if (!bPtIn)//没有点中
{
return ;
}

int i=0;
for ( Iter = m_vecGroups.begin( ) ; Iter != m_vecGroups.end( ) ; Iter++ )
{
TGroupInfo* groupinfo=*Iter;
//所选择的分组以及其以上的所有分组，均上移
if (i<=selectIndex)
{
groupinfo->Button->MoveWindow(0,i*GROUPCTRL_HIGHT,m_rtClient.Width(),GROUPCTRL_HIGHT,TRUE);
}
//所选择的分组以下的分组下移，不包括自己
else
{
if (selectIndex+1<count)
groupinfo->Button->MoveWindow(0,m_rtClient.bottom-(count-i)*GROUPCTRL_HIGHT,m_rtClient.Width(),GROUPCTRL_HIGHT,TRUE);
}
i++;//索引值
}
//显示所选择的分组窗口
TGroupInfo* ¤tInfo=m_vecGroups.at(selectIndex);
if (currentInfo->m_pWnd)
{
currentInfo->m_pWnd->ShowWindow(SW_SHOW);//显示本次的pwnd
}
//保存选中的按钮索引
m_iDown=selectIndex;
//UpdateWindow和Invalidate都不行，只能这样刷新了
ShowWindow(SW_HIDE);
ShowWindow(SW_SHOW);
}

原理不太难，在AddOneGroup传来的视图控件位置，是根据按钮的多少事先来调整的。而你每次按分组控件时候，所按分组以及以上的分组全部上移，所按分组的下移部分全部下移。同时，先保存一个上次按钮的索引，来隐藏上次的视图，再显示新的所选索引的视图即可。

使用代码：

QQGroupCtrl* gCtrl=new QQGroupCtrl;
gCtrl->Create(L"group",WS_VISIBLE | WS_CHILD, rect, this, 10000);
gCtrl->AddOneGroup(L"我的好友",NULL);
gCtrl->AddOneGroup(L"我的群组",NULL);
gCtrl->AddOneGroup(L"最近联系人",NULL);
gCtrl->AddOneGroup(L"自定义",NULL);

效果图