C++ Qt学习笔记 2020-12-1 (setToolTip换行,定时器使用,类似QQ的设置悬浮窗口实现,pushbutton上的文字或图标左右移动)

44 篇文章 8 订阅

1、setToolTip换行:

\n就行了:

ui->qqlevel->setToolTip(u8"我的Q等级\n 等级:59级\n 剩余升级天数:8天");

2、定时器使用:

//在.h中
//引入定时器
#include <QTimer>
//声明定时器
QTimer *pTimer;
//声明槽函数    
void hide_window();  

//在.cpp中
//初始化定时器
pTimer = new QTimer(this);
//绑定槽函数
connect(pTimer,SIGNAL(timeout()),this,SLOT(hide_window()));
//槽函数功能
void qqchat_main_window::hide_window()
{
    //添加内容
    qDebug()<<u8"输出";
}

//然后在适当的时候添加定时器启动,然后在某个时刻终止。
//这里我放在按钮中为例:
void qqchat_main_window::set_link_peo_index()
{  
     pTimer->start( 2000 );  //定时器启动,2秒一次定时器
}   

void qqchat_main_window::set_qzone_index()
{
     pTimer->stop(); //定时器终止
}

运行结果:

每次定时器执行2秒,在定时器执行结束的时候,发出timeout信号,触发绑定的槽函数。
程序运行结果就是,点击按钮启动定时器后,每隔两秒输出一次 “输出” ,点击定时器终止按钮,定时器结束运行。
在这里插入图片描述

3、类似QQ的设置悬浮窗口:

想了好久找到的一个解决方案:首先创建一个qt设计师界面类来绘制设置悬浮窗,当鼠标移入按钮区域,触发事件过滤器时,悬浮窗口在按钮下方显示。当鼠标移出按钮区域时,窗口就隐藏。但是为了让鼠标在窗口中的时候窗口也不隐藏,我想了两种方法:
(1)鼠标移出的事件中,隐藏悬浮窗的判断条件加一条:鼠标不在主窗口按钮区域内,且鼠标当前的坐标(全局坐标)不在调出的悬浮窗口区域中,就把悬浮窗口隐藏。前提是悬浮窗出现的位置始终在按钮下方(怎样实现看之前的笔记)。
(2)给悬浮窗的设计师界面类也添加一个事件过滤器,只要鼠标在窗口区域内,就触发事件过滤器使页面显示,移出悬浮窗口区域就隐藏。由于一移出主窗口的按钮区域,悬浮窗口就会隐藏,所以需要把按钮和窗口一部分区域重叠,这样就可以无缝衔接,然后只要把窗口透明,在里面放一个frame作为窗口区域显示就可以了。(但是有一个问题,这个事件过滤器可能会与主窗口的事件过滤器冲突,由于我位于悬浮窗口中时,鼠标也位于按钮之外的区域,一个要求它显示,一个要求它隐藏,那到底是显示还是隐藏呢?但是实际使用的时候,发现结果居然完美的实现了我的需求,鼠标在按钮上时显示,在悬浮窗口上时也显示,移出按钮和悬浮窗时则消失)

由于一开始的时候就采用的第二种方案,所以下面以第二种方案展开:

首先窗口在鼠标悬浮按钮的时候显示,所以给主界面添加事件过滤器:

//给按钮装载事件过滤器
ui->t_points->installEventFilter(this);
//按钮的事件过滤器内容
bool qqchat_main_window::eventFilter(QObject *target, QEvent *e)
{
    if (target==ui->t_points )  
    {
        if(e->type() == QEvent::Enter)
        {      //移入按钮区域,在按钮的下方显示窗口
               t_points_position = ui->t_points->mapToGlobal(ui->t_points->pos());
               setting1_1->move(t_points_position.x()-320,t_points_position.y()+3);
               setting1_1->show();
        }
        else if (e->type() == QEvent::Leave)
        {
            //移出按钮区域
            setting1_1->hide();
        }
    return QDialog::eventFilter(target, e);
}

接着来到悬浮窗口的设计师界面类:

界面设计为窗口隐藏,一个frame中放置7个按钮,代表了qq的悬浮窗的设置:
在这里插入图片描述
cpp中:

//装载事件过滤器
installEventFilter(this);   //这个过滤器是针对整个窗口的(与其内部的控件的过滤器装载不冲突)

//事件过滤器的内容
bool setting1::eventFilter(QObject *target, QEvent *e)
{
    if (target==this )  //这个窗口的过滤器
    {
        if(e->type() == QEvent::Enter)
        {    //鼠标在这个窗口中时,就显示窗口
               this->show();
        }
        else if (e->type() == QEvent::Leave)
        {    //鼠标离开窗口时,悬浮窗隐藏
            this->hide();
        }
        else{return QDialog::eventFilter(target, e);}
        }
    return QDialog::eventFilter(target, e);
}

再给悬浮窗口中的按钮加点点缀,悬浮的时候变色:

    ui->my_email->setStyleSheet("QPushButton#my_email{background:transparent;}QPushButton#my_email:hover{background-color:rgb(220,220,220,75%);border:0px;}");
    ui->my_shopping->setStyleSheet("QPushButton#my_shopping{background:transparent;}QPushButton#my_shopping:hover{background-color:rgb(220,220,220,75%);border:0px;}");
    ui->my_purse->setStyleSheet("QPushButton#my_purse{background:transparent;}QPushButton#my_purse:hover{background-color:rgb(220,220,220,75%);border:0px;}");
    ui->vip_center->setStyleSheet("QPushButton#vip_center{background:transparent;}QPushButton#vip_center:hover{background-color:rgb(220,220,220,75%);border:0px;}");
    ui->dianping->setStyleSheet("QPushButton#dianping{background:transparent;}QPushButton#dianping:hover{background-color:rgb(220,220,220,75%);border:0px;}");
    ui->app_center->setStyleSheet("QPushButton#app_center{background:transparent;}QPushButton#app_center:hover{background-color:rgb(220,220,220,75%);border:0px;}");
    ui->layout_control->setStyleSheet("QPushButton#layout_control{background:transparent;}QPushButton#layout_control:hover{background-color:rgb(220,220,220,75%);border:0px;}");

(注:其实这样写反而麻烦了,因为在主窗口的cpp中就已经完成了悬浮窗的初始化,所以事件过滤器的代码写在主窗口的cpp中就可以了,不过既然已经写了一长串了,就先放在这吧)

运行结果:
在这里插入图片描述
在这里插入图片描述

4、pushbutton上的文字或图标左右移动:

在qss中使用padding-right: 50;就行了,正数表示左移,负数表示右移。
如:

ui->my_email->setStyleSheet("QPushButton#my_email{background:transparent;padding-right: 50;}QPushButton#my_email:hover{background-color:rgb(220,220,220,75%);border:0px;padding-right: 50;}");

运行结果:
在这里插入图片描述

  • 2
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值