基于Qt的类似QQ好友列表抽屉效果的实现

转载地址： http://blog.csdn.net/shuideyidi/article/details/30619167

 

前段时间在忙毕业设计，所以一直没有更新博客。今天答辩完以后，将对我的毕业设计进行模块展示，供Qt初学者进行参考。

毕业设计题目：Linux系统下基于Qt的局域网即时通信系统设计与实现

 

其中我有一个类似于QQ的好友列表，然后对好友可以进行分组管理，毕设中具体效果图如下：

 

网上查寻到的设计思路：

1.采用QToolBox的方式，虽然看起来有点样子，但是并不是我们所熟悉的好友列表，比如：http://blog.csdn.net/qianguozheng/article/details/6719074

缺点：（1）：只能显示某一组中的好友，不能同时显示多个分组中好友列表；

            （2）：必须显示某一组中的好友，不能够都隐藏。

2.采用QTreeView或者QListView的方式，个人感觉比较麻烦，所以一直没哟尝试过。之前也找过到一个博客是采用这个方式的，但是由于本人的粗心，现在找不到了。。。

 

好了，介绍完别人的，接下来就是自己的了。

其实我的方法很简单，就是利用QLayout 布局以及 QWidget的setVisible()函数，控制显示。

 

[cpp] view plain copy

print?

1. #include <QVBoxLayout>  
2. #include <QLabel>  
3.   
4. class IMToolItem : public QWidget {  
5.     Q_OBJECT  
6. public:  
7.     IMToolItem(const QString &title,  
8.              QWidget *parent = 0) : QWidget(parent), layout(new QVBoxLayout)  
9.     {  
10.         layout = new QVBoxLayout;  
11.         layout->setContentsMargins(0, 0, 0, 0);  
12.         layout->addWidget(new QLabel(title));  
13.         setLayout(layout);  
14.   
15.         layout->setContentsMargins(0,0,0,0);  
16.         layout->setSpacing(0);  
17.     }  
18.   
19.     void addItem(QWidget *item)  
20.     {  
21.         m_itemList.append(item);  
22.         layout->addWidget(item);  
23.         item->setVisible(false);  
24.     }  
25.   
26. protected:  
27.     void mousePressEvent(QMouseEvent *event)  
28.     {  
29.         for (int i=0; i<m_itemList.size(); ++i)  
30.         {  
31.             m_itemList[i]->setVisible(!m_itemList[i]->isVisible());  
32.         }  
33.     }  
34.   
35. private:  
36.     QList<QWidget *> m_itemList;  
37.     QVBoxLayout *layout;  
38. };  
39.   
40. class IMToolBox : public QWidget {  
41.     Q_OBJECT  
42. public:  
43.   
44.     IMToolBox(QWidget *parent = 0) : QWidget(parent), layout(new QVBoxLayout)  
45.     {  
46.         setLayout(layout);  
47.         layout->setContentsMargins(0,0,0,0);  
48.         layout->setSpacing(0);  
49.     }  
50.   
51.     void addItem(IMToolItem *item)  
52.     {  
53.         layout->addWidget(item);  
54.     }  
55.   
56. private:  
57.     QVBoxLayout *layout;  
58. };  

#include <QVBoxLayout>#include <QLabel>class IMToolItem : public QWidget {    Q_OBJECTpublic:    IMToolItem(const QString &title,             QWidget *parent = 0) : QWidget(parent), layout(new QVBoxLayout)    {        layout = new QVBoxLayout;        layout->setContentsMargins(0, 0, 0, 0);        layout->addWidget(new QLabel(title));        setLayout(layout);        layout->setContentsMargins(0,0,0,0);        layout->setSpacing(0);    }    void addItem(QWidget *item)    {        m_itemList.append(item);        layout->addWidget(item);        item->setVisible(false);    }protected:    void mousePressEvent(QMouseEvent *event)    {        for (int i=0; i<m_itemList.size(); ++i)        {            m_itemList[i]->setVisible(!m_itemList[i]->isVisible());        }    }private:    QList<QWidget *> m_itemList;    QVBoxLayout *layout;};class IMToolBox : public QWidget {    Q_OBJECTpublic:    IMToolBox(QWidget *parent = 0) : QWidget(parent), layout(new QVBoxLayout)    {        setLayout(layout);        layout->setContentsMargins(0,0,0,0);        layout->setSpacing(0);    }    void addItem(IMToolItem *item)    {        layout->addWidget(item);    }private:    QVBoxLayout *layout;};

这段代码不仅可以实现QQ好友列表的抽屉效果，还能支持很多额外的拓展，。但是是为读者提供一个思路，读者可以自由扩展，封装成自己的类，供自己使用。

如果只要显示抽屉效果，IMToolItem这个类已经完全够用。

改日我会上传一个简单的demo供大家参考，也希望大家对不足之处进行批评指导，大家一起分享交流，互相学习。

 

 

================================================================================================================================

昨天由于太晚了，所以没有把demo提供给大家。

今天一大早起来，就将这个模块提取出来，写成了一个简单的demo供大家参考。

demo中效果图：

介绍：

点击分组title，可以显示或者隐藏整个分组内的好友；

当好友数量过多，操作显示范围，右侧会出现滚动条。

 

还有要说的就是，我觉得对于QList<QWidget *> m_itemList的循环遍历，来控制显示隐藏不是很合理。

可以直接把显示分组的标签label放在IMToolBox，将好友按钮放在IMToolItem中，然后直接控制IMToolItem的显示或者隐藏，应该也可以的。

 

下载链接：http://download.csdn.net/detail/shuideyidi/7496831