自定义QToolTip样式

本文写作纯属个人兴趣使然，界面没有美化什么，纯属学习之用，如果有当之处，还请大家海涵，进入正题。

本文主要讲述了利用Qt5实现类似QQ好友列表中，当鼠标悬停在头像上面时弹出QQ好友信息的功能，总共包括2个部分，其一列表显示部分（显示QQ 好友，包括头像、姓名、简要概述），其二CToolTip部分，用于显示当前用户的信息，话不多说，直接上代码和图
QQ好友条信息显示部分：
这个功能其实网上有相关的资料的，直接上代码吧：ItemWidget.h
#ifndef ITEMWIDGET_H
#define ITEMWIDGET_H
#include <QWidget>
#include <QLabel>
#include <QPushButton>
#include <QVBoxLayout>
#include <QHBoxLayout>
//class CLabel;
class ItemWidget : public QWidget
{
Q_OBJECT
public:
explicit ItemWidget(QWidget *parent = 0);
void setText(QPixmap pixmap, QString name, QString info);
void setText(QString info);
signals:
public slots:
private:
QLabel *labelIcon;
QLabel *labelName;
QLabel *labelInfo;
QHBoxLayout *horLayout;
QVBoxLayout *verlayout;
protected:
bool event(QEvent *e);
};
#endif // ITEMWIDGET_H
ItemWidget.cpp
#include "itemwidget.h"
#include "global.h"
#include "ctooltip.h"
#include <QEvent>
#include <QCursor>
ItemWidget::ItemWidget(QWidget *parent) :
QWidget(parent)
{
labelIcon = new QLabel(this);
labelName = new QLabel(this);
labelName->setStyleSheet("QLabel{color: green; font: 13pt bold;}"); labelInfo = new QLabel(this);
labelInfo->setStyleSheet("QLabel{color: gray;}");
verlayout = new QVBoxLayout();
verlayout->setContentsMargins(0, 0, 0, 0);
verlayout->addWidget(labelName);
verlayout->addWidget(labelInfo);
horLayout = new QHBoxLayout(this);
horLayout->setContentsMargins(2, 2, 2, 2);
horLayout->addWidget(labelIcon, 1, Qt::AlignTop);
horLayout->addLayout(verlayout, 4);
}
void ItemWidget::setText(QPixmap pixmap, QString name, QString info) { labelIcon->setPixmap(pixmap);
labelName->setText(name);
labelInfo->setText(info);
}
// 测试用的
void ItemWidget::setText(QString info) {
labelIcon->setText(info);
}
// 鼠标悬停的时候，显示当前用户简要信息
bool ItemWidget::event(QEvent *e) {
if (e->type() == QEvent::ToolTip) {
qDebug() << "tool tip show";
g_toolTip->showMessage(labelIcon->pixmap(),
labelName->text(),
labelInfo->text(),
QCursor::pos());
} else if (e->type() == QEvent::Leave) {
qDebug() << "tool tip leave";
g_toolTip->hide();
}
return QWidget::event(e);
}
然后是CToolTip自定义样式部分：.h
#ifndef CTOOLTIP_H
#define CTOOLTIP_H
#include <QWidget>
#include <QLabel>
#include <QPushButton>
#include <QGroupBox>
#include <QVBoxLayout>
#include <QHBoxLayout>
class CToolTip : public QWidget
{
Q_OBJECT
public:
explicit CToolTip(QWidget *parent = 0);
void showMessage(const QPixmap *pixmap, QString name, QString info, QPoint point);
void showMessage(const QPixmap *pixmap, QPoint point);
signals:
public slots:
private:
QLabel *labelIcon;
QLabel *labelName;
QLabel *labelInfo;
QHBoxLayout *horLayout;
QVBoxLayout *verlayout;
QGroupBox *groupBox;
protected:
void hoverEvent(QHoverEvent *);
};
#endif // CTOOLTIP_H
CToolTip.cpp
#include "ctooltip.h"
#include <QDebug>
#include <QApplication>
#include <QDesktopWidget>
CToolTip::CToolTip(QWidget *parent) :
QWidget(parent)
{
this->setWindowFlags(Qt::FramelessWindowHint |
Qt::WindowSystemMenuHint | Qt::WindowMinMaxButtonsHint);
this->resize(200, 100); ;
this->setObjectName("CToolTip");
this->setStyleSheet("QWidget#CToolTip {border: 2px solid green; background-color: skyblue;}");
groupBox = new QGroupBox(this);
groupBox->setGeometry(10, 10, 180, 80);
groupBox->setTitle("用户信息");
labelIcon = new QLabel(groupBox);
labelName = new QLabel(groupBox);
labelInfo = new QLabel(groupBox);
verlayout = new QVBoxLayout();
verlayout->setContentsMargins(0, 0, 0, 0);
verlayout->addWidget(labelName);
verlayout->addWidget(labelInfo);
horLayout = new QHBoxLayout(groupBox);
horLayout->setContentsMargins(10, 10, 10, 10);
horLayout->addWidget(labelIcon, 1, Qt::AlignTop);
horLayout->addLayout(verlayout, 4);
}
// 显示ToolTip消息
void CToolTip::showMessage(const QPixmap *pixmap, QString name, QString info, QPoint point) {
labelIcon->setPixmap(*pixmap);
labelName->setText(name);
labelInfo->setText(info);
// 重新定义CToolTip的坐标
int rectX;
int rectY;
if (point.rx() < 200) {
rectX = point.rx() + 10;
} else {
rectX = point.rx() - 240;
}
rectY = point.ry();
move(QPoint(rectX, rectY));
QWidget::show();
}
// 显示ToolTip消息
void CToolTip::showMessage(const QPixmap *pixmap, QPoint point) { labelIcon->setPixmap(*pixmap);
labelName->setText("自己想办法获取");
labelInfo->setText("自己动手，丰衣足食");
// 此处可以作为QToolTip样式进行显示
move(point);
QWidget::show();
}
// 当鼠标进入事件时，让界面隐藏掉
void CToolTip::hoverEvent(QHoverEvent *) {
hide();
}
// 最后一个组合界面，mainWidget.h
#ifndef MAINWIDGET_H
#define MAINWIDGET_H
#include <QWidget>
class CToolTip;
namespace Ui {
class MainWidget;
}
class MainWidget : public QWidget
{
Q_OBJECT
public:
explicit MainWidget(QWidget *parent = 0);
~MainWidget();
private:
Ui::MainWidget *ui;
CToolTip *ctoolTip;
};
#endif // MAINWIDGET_H
mainwidget.cpp
#include "mainwidget.h"
#include "ui_mainwidget.h"
#include "itemwidget.h"
#include "ctooltip.h"
#include <QListWidgetItem>
CToolTip *g_toolTip;
MainWidget::MainWidget(QWidget *parent) :
QWidget(parent),
ui(new Ui::MainWidget)
{
// this->setWindowFlags(Qt::FramelessWindowHint |
Qt::WindowSystemMenuHint | Qt::WindowMinMaxButtonsHint);
ui->setupUi(this);
ctoolTip = new CToolTip();
// 定义全局的ToolTip，方便使用
g_toolTip = ctoolTip;
// 本行代码主要针对ListWidgetItem右键点击时才生效的
ui->listWidget->setMouseTracking(true);
// 添加测试数据
for (int i = 0; i < 10; i++) {
ItemWidget *itemWidget = new ItemWidget(ui->listWidget);
itemWidget->setText(QPixmap(QString(":/images/%1").arg(i+1)), QString("标题"), QString("写点什么呢: %1?").arg(i));
QListWidgetItem *listItem = new
QListWidgetItem(ui->listWidget);
// 此处的size如果不设置，界面被压缩了看不出ItemWidget的效果，高度一定要设置
listItem->setSizeHint(QSize(200, 40));
ui->listWidget->setItemWidget(listItem, itemWidget);
}
}
MainWidget::~MainWidget()
{
delete ui;
}
// 界面文件没什么，就一个listWidget，
最后给大家上一个效果
代码下载地址：/s/1eQvk2R4。