Qt 鼠标悬浮按钮上出现浮窗效果
操作:
鼠标hover于Btn(or other widget),在指定位置显示想要的widget(或其他控件窗口)
方法:重载以下几个api
void paintEvent(QPaintEvent *); //由于重载QPushbutton,normal, hover, pressed 按钮的状态需要重新设定
void enterEvent(QEvent*event); //鼠标进入的时候发送信号显示 diy widget
void leaveEvent(QEvent*event); //鼠标离开的时候发送信号隐藏 diy widget
实现:
类原型:
//构造的时候需要将normal,hover, pressed的状态的图片,其他多余的为扩展,taskPix为任务图标类似QQ消息右上角的小红点,当然也可以自己画
class MyBtn :public QPushButton {
Q_OBJECT
public:
MyBtn(QWidget *parent, QString Text, QPixmap NorPix, QPixmap HoverTipsPix, QPixmap PressedTaskpix, QPixmap TaskPix);
void init();
void SetTaskCounts(int counts) { TaskCounts = counts; }
void setCurrenPix(QPixmap pix) { CurrenPix = pix; }
QTimer *pTimer; //鼠标进入的时候,需要计时器100ms去将获取全局的鼠标位置发给需要显示的Widget
protected:
void paintEvent(QPaintEvent *);
void enterEvent(QEvent*event);
void leaveEvent(QEvent*event);
bool eventFilter(QObject *obj, QEvent *event); //可能要用到的过滤,有些事件不需要上层窗口处理在这里处理,比如右键什么的,本文暂时不涉及
private:
int TaskCounts;
QPixmap TaskPix;
QPixmap NorPix;
QPixmap HoverPix;
QPixmap PressPix;
QPixmap CurrenPix;
QLabel *TipsLbl; //需要显示的wigdet 其中构造的Text是放在这里
QWidget *TipsWgt; //需要显示的widget
QGridLayout *TipsLyt;
public slots:
void slot_showWgt(QPoint);
void slot_updateTasks(int tasks); //随着消息的变动更新 Taskcounts
signals:
void sig_showWgt(QPoint); //发送消息通知要显示的widget
void sig_hideWgt(); //发送消息通知要隐藏的widget
};
MyBtn::MyBtn(QWidget *parent, QString Text, QPixmap NormalPix, QPixmap HoverTipsPix, QPixmap PressedTaskpix, QPixmap TasksPix) :
QPushButton(parent)
{
init();
NorPix = NormalPix;
CurrenPix = NormalPix;
HoverPix = HoverTipsPix;
PressPix = PressedTaskpix;
PressPix = NorPix;
TaskPix = TasksPix;
TipsLbl->setText(Text);
}
void MyBtn::init()
{
pTimer = new QTimer(this);
TaskCounts = 0;
TipsWgt = new QWidget;
TipsLbl = new QLabel(TipsWgt);
TipsLyt = new QGridLayout(TipsWgt);
TipsLyt->addWidget(TipsLbl);
TipsWgt->setWindowFlags(Qt::FramelessWindowHint);
TipsWgt->setStyleSheet("background-color: transparent");
TipsWgt->setAutoFillBackground(false);
TipsWgt->setAttribute(Qt::WA_TranslucentBackground);
TipsLbl->setStyleSheet("QLabel{border-image: url(:/SprintPlot/image/menuWhatis.png);color:white;}");
TipsLbl->resize(80, 40);
QPixmap pix(":/SprintPlot/image/menuWhatis.png");
TipsLbl->setFixedSize(pix.size());
TipsLbl->setAlignment(Qt::AlignCenter);
TipsWgt->resize(80, 40);
connect(this, &MyBtn::sig_showWgt, this, &MyBtn::slot_showWgt);
}
void MyBtn::paintEvent(QPaintEvent *event)
{
QPainter painter(this);
painter.drawPixmap(QRect(this->rect().x() + this->width() / 4 - 3, this->rect().y()+10, 24, 24), CurrenPix);
painter.setPen(Qt::white);
if (TaskCounts > 99)
{
painter.drawPixmap(QRect(QPoint(this->x() + 20, 0), QSize(22, 22)), TaskPix);
painter.drawText(QRect(QPoint(this->x() + 22, 2), QSize(18, 18)), Qt::AlignVCenter, QString::number(99) + "+");
}
else if (TaskCounts)
{
painter.drawPixmap(QRect(QPoint(this->x()+ 20, 0), QSize(18, 18)), TaskPix);
painter.drawText(QRect(QPoint(this->x() + 23, 3), QSize(12, 12)), Qt::AlignCenter, QString::number(TaskCounts));
}
else
{
update();
}
}
void MyBtn::enterEvent(QEvent *event)
{
CurrenPix = HoverPix;
pTimer->stop();
QPoint oPoint = this->mapToGlobal(QPoint(this->x() - 90, 0));
emit sig_showWgt(oPoint);
}
void MyBtn::leaveEvent(QEvent *event)
{
CurrenPix = NorPix;
pTimer->start(100);
TipsWgt->hide();
}
bool MyBtn::eventFilter(QObject *target, QEvent *event)
{
if (target == this&&event->type() == QEvent::Enter)
{
CurrenPix = HoverPix;
}
else if (target == this&&event->type() == QEvent::MouseButtonPress)
{
CurrenPix = PressPix;
}
else if (target == this&&event->type() == QEvent::Leave)
{
CurrenPix = NorPix;
}
else
{
return true;
}
return QPushButton::eventFilter(target, event);
}
void MyBtn::slot_showWgt(QPoint oPoint)
{
TipsWgt->move(oPoint);
TipsWgt->show();
}
void MyBtn::slot_updateTasks(int tasks)
{
TaskCounts = tasks;
}
效果截图:

注意如果要鼠标进入浮窗不消失的话,需要自己实现这个浮窗,重写enterevent()判断全局鼠标位置
然后在确定是不是要隐藏窗口,类似于QQ的资料卡。有问题可以博客私聊回复。
Qt 鼠标悬浮按钮上出现浮窗效果的更多相关文章
- Java基础 awt Button 鼠标放在按钮上背景颜色改变,鼠标离开背景颜色恢复
JDK :OpenJDK-11 OS :CentOS 7.6.1810 IDE :Eclipse 2019‑03 typesetting :Markdown code ...
- js 鼠标放到图片上放大某一部分效果
动图效果: 代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
- Qt实现自定义按钮的三态效果
好久之前做的一个小软件,好长时间没动过了,在不记录下有些细节可能都忘了,这里整理下部分功能的实现. 按钮的三态,指的是普通态.鼠标的停留态.点击态,三态是界面交互非常基本的一项功能,Qt中如果使用的是 ...
- 【C#/WPF】用System.Timers.Timer计时器做浮窗广告
需求:鼠标静止一段时间后,显示浮窗广告. 思路:界面XAML写好一个专门显示浮窗广告的Canvas,先设为不可见Visibility=”Collapsed”,然后用System.Timers.Time ...
- Android6.0 源码修改之 仿IOS添加全屏可拖拽浮窗返回按钮
前言 之前写过屏蔽系统导航栏功能的文章,具体可看Android6.0 源码修改之屏蔽导航栏虚拟按键(Home和RecentAPP)/动态显示和隐藏NavigationBar 在某些特殊定制的版本中要求 ...
- CSS鼠标悬浮DIV后显示DIV外的按钮
昨天写样式遇到个问题,如何让鼠标悬浮DIV后,显示DIV外的按钮,可以点击到按钮. 效果如下: 问题: 在DIV hover时候将按钮设为display: block,这是很直接的想法,但是这有个问题 ...
- 在TableView上添加悬浮按钮
如果直接在TableVIewController上贴Button的话会导致这个会随之滚动,下面解决在TableView上实现位置固定悬浮按钮的两种方法: 1.在view上贴tableView,然后将悬 ...
- Duilib 鼠标在某控件例如按钮上悬停后,对目标控件操作
其实对WM_MOUSEHOVER消息的处理,因为WindowImplBase基类中对此消息未处理,所以在自己的窗口类中实现: .h文件中加入 LRESULT OnMouseHover( UINT uM ...
- GUI编程笔记(java)08:GUI通过鼠标移动到按钮上更改背景色案例
首先我们看看源代码如下: package cn.itcast_06; import java.awt.Button; import java.awt.Color; import java.awt.Fl ...
随机推荐
- React Native商城项目实战16 - 购物中心详细页
逻辑分析: 首页(Home)加载的购物中心组件(ShopCenter),传递url数据: ShopCenter里根据url加载购物中心详细页组件(ShopCenterDetail), ShopCent ...
- 《HTML5 与 CSS3 基础教程(第 8 版)》
第 1 章 网页的构造块 文件名和文件夹名 文件名全部使用小写字母,用短横线分隔单词,用 .html 作为扩展名.混合使用大小写字 母会增加访问者输入正确地址以及找到页面的难度 文件夹的名称也应全部用 ...
- 基于Skyline的web开发(6.x)
多窗口对比 一个页面加载多个TerraExplorer3DWindow和SGWorld等只有第一个能用(即使用iframe也是一样) 所以我决定打开两个新页面实现多窗口对比,然后我在<主页面&g ...
- JDBC 国际标准时间
mysql.driver=com.mysql.cj.jdbc.Drivermysql.url=jdbc:mysql://localhost:3306/XXXX?characterEncoding=UT ...
- Linux(Ubuntu)常用命令(三)
查看时间 cal :显示当前日期. cal :显示全年日历./ cal -y 显示当年日历. date :显示当前时间. 这几个一般不会用到了解即可. 查看进程信息 ps :显示当前进程. - ...
- oracle--表分区、分区索引
--|/ range分区 create table sale( product_id varchar2(5), sale_count number(10,2) ) partition by range ...
- 无法打开内核设备"\\.\Global\vmx86":系统找不到指定的文件. 是否在安装 VMwareWorksation 后重新引到 ? 问题解决
节前正常使用的工作环境, 过完春节后, 上班第一天就不正常工作了, 难不成机器也要放假休息, 虚拟机打不开了, 没办法办公可是不行的. 上网查原因, 解决问题. 上网看了很多关于此问题的解决办法, 很 ...
- [Python3 练习] 003 货币转换
题目:货币转换 (1) 描述 人民币和美元是世界上通用的两种货币,写一个程序进行货币间币值转换 记人民币和美元之间的汇率为:1 美元 = 6.78 人民币 程序可以接受人民币或美元输入,转换为另一种货 ...
- python中json的基本使用
一.json的概念 json是一种通用的数据类型 一般情况下接口返回的数据类型都是json 长得像字典,形式也是k-v{ } 其实json是字符串 字符串不能用key.value来取值,所以要先转换为 ...
- 用js代码打开新场口 关于window.open()方法的参数
应用window.open,可以弹出新窗口, window.open('path', 'windowName', 'windowSetting' ) window.open("./a.htm ...