Qt 鼠标移入QLabel、离开QLabel、点击QLabel显示不同的效果

这篇具有很好参考价值的文章主要介绍了Qt 鼠标移入QLabel、离开QLabel、点击QLabel显示不同的效果。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。


前言

通过Qt建立一个窗口应用,经常会出现以下的应用场景:即鼠标移入、离开以及点击一个QLabel时,QLabel相应的样式发生改变,发生诸如“边框加粗”、“背景色改变”、“显示文本”等变化,本案例通过编写一个继承于QLabel的MyLabel类实现上述需求。通过重写enterEvent、leaveEvent以及mousePressEvent三个函数,实现相关的视觉操作。具体效果如下图所示。


效果

建立的Qt窗口应用,一个窗口里面有4个QLabel,默认状态下的样式为绿色背景色,当鼠标进入某个QLabel范围内时,该QLabel样式切换为蓝色底红色加粗边框,当在该QLabel范围内点击鼠标左键时,该QLabel的样式切换为红色底细边框,且显示文本“被点击了”,当鼠标离开该QLabel范围时,清空所有样式,还原为初始状态。

qt鼠标移到按钮上变化图片,Qt,qt,ui

ui设置

通过Qt建立一个Qt 窗口应用,在ui文件中进行相应的窗口布局,设置所有的QLabel为统一样式。

上述步骤可以通过代码或者ui界面属性设置两种方式实现,本人习惯于直接在ui界面进行设置的方式

Qt Creator的界面如下图所示
qt鼠标移到按钮上变化图片,Qt,qt,ui
在右上方的对象列表最顶端的名称为Widget的QWidget类上右击选择“改变样式表”,弹出样式表编辑页面,通过此处对该对象下的所有子对象进行相关设置,本案例中设置为以下文本,其中QLabel后面不带#具体对象名称,则可以统一对该对象下内所有QLabel子对象生效。

QLabel//不指定特定对象,即对所有QLabel生效
{
	background-color:rgb(0,255,127);
}

qt鼠标移到按钮上变化图片,Qt,qt,ui

核心代码

通过新建一个继承于QLabel的MyLabel类实现对鼠标功能的封装,重写enterEvent、leaveEvent以及mousePressEvent,实现在相关鼠标操作下的样式变化。
MyLabel public继承于QLabel类,其中enterEvent、leaveEvent以及mousePressEvent 均为public继承于QWidget。

mylabel.h

代码如下(示例):

#ifndef MYLABEL_H
#define MYLABEL_H

#include <QObject>
#include <QDebug>
#include <QLabel>

class MyLabel:public QLabel
{
    Q_OBJECT
public:
    MyLabel(QWidget *parent = 0);
    void enterEvent(QEvent *event);
    void leaveEvent(QEvent *event);
    void mousePressEvent(QMouseEvent *event);
};

#endif // MYLABEL_H

mylabel.cpp

代码如下(示例):

#include "mylabel.h"

MyLabel::MyLabel(QWidget *parent):QLabel(parent)
{

}

void MyLabel::enterEvent(QEvent *event)
{
    setStyleSheet("border:6px solid;"
                  "border-color:rgb(255,0,0);"
                  "background-color: rgb(0, 0, 255);");
}

void MyLabel::leaveEvent(QEvent *event)
{
    setStyleSheet("border:0px");
    setText(" ");
    setAlignment(Qt::AlignCenter);
}

void MyLabel::mousePressEvent(QMouseEvent *event)
{
    setStyleSheet("border:2px solid;"
                  "background-color: rgb(255, 0, 0);");
    QFont font ( "Microsoft YaHei", 30, 75);
    setFont(font);
    setText("被点击了");
    setAlignment(Qt::AlignCenter);

}

提升QLabel类为MyLabel类

将ui文件中各个QLabel提升为MyLabel,通过右击QLabel选在“提升为”选项,出现“提升的类”对话框,选中mylabel.h头文件,点击“提升”,提升后的类名由“QLabel”变为“MyLabel”。
qt鼠标移到按钮上变化图片,Qt,qt,ui

至此可实现鼠标移入、点击、离开QLabel时相关的显示变化操作。文章来源地址https://www.toymoban.com/news/detail-648002.html

到了这里,关于Qt 鼠标移入QLabel、离开QLabel、点击QLabel显示不同的效果的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Qt 鼠标进入离开事件

    QEvent::Enter ​ 鼠标进入事件,当鼠标进入到窗口/控件内部时,触发该事件,它对应的子类是 QEnterEvent QEvent::Leave ​ 鼠标离开事件,当鼠标离开到窗口/控件内部时,触发该事件 自定义一个标签控件 LabelX ,让它继承自 QLabel ,然后重写父类的 enterEvent 和 leaveEvent 。 代码如下:

    2024年01月24日
    浏览(28)
  • QT学习12:QLabel实现点击事件

    主要是通过安装过滤器,实现点击事件。 事件过滤器的操作: 首先给需要添加事件过滤器的部件 注册监听对象 ; 对象名-installEventFilter(true); 重写 eventFilter(QObject *obj, QEvent *event) 函数进行处理。

    2024年02月13日
    浏览(55)
  • 【鼠标在不点击的情况下,直接移动到QT控件上不显示提示信息】

      当你想用图标作为按钮时,为了让用户知道按钮的功能,这时候就会在QT控件上加上提示信息,在初始化时,使用QT自带的 setToolTip 方法即可: 但有时明明已经调用了 setToolTips 方法,鼠标移动到QT控件上仍然不会有提示信息,这时候就需要具体分析下 setToolTips 方法是如何

    2024年02月10日
    浏览(33)
  • vue+openlayers,初始化openlayers地图,实现鼠标移入、点击、右键等事件

    主要功能:初始化openlayers地图,实现鼠标移入、点击、右键等事件,以及获取当前图标的feature,将当前图标信息以弹框方式进行展示;地图上展示拾取到的经纬度 前端使用的是vue技术栈 步骤一:将地图的公用配置项单独提出成一个js文件,方便打包后进行修改,代码如下

    2024年02月11日
    浏览(23)
  • 双显示器扩展显示自定义鼠标移入方向

    win+p键,选择下面的 “更多显示器设置” 拖成下图这样,点击确认:

    2024年02月12日
    浏览(41)
  • 【CSS】鼠标(移入/移出)平滑(显示/隐藏)下划线

    鼠标移入内容时,下划线从 左 开始绘制到 右 侧结束 鼠标移出内容时,下划线从 左 开始擦除到 右 侧结束 我们给内容添加一个黑色背景 background: #000; 示例 效果 将黑色背景 background: #000; 替换成彩色渐变背景 background: linear-gradient(to right,#ec695c,#61c454); 示例 效果 宽度设置100个

    2024年02月09日
    浏览(36)
  • Vue中实现鼠标移入显示,移出隐藏滚动条

    实现目标:鼠标移入显示滚动条,移出隐藏滚动条。 1、 html 结构内容如下: 注意:文本内容需要溢出容器才能显示滚动条。 代码说明: 2、 css 样式: 注意:该样式存在兼容性问题,只在以 webkit 为内核的浏览器才可使用。 3、 js 功能实现: 4、效果演示 补充:实现隐藏滚

    2024年04月22日
    浏览(49)
  • css滚动条变细且隐藏,鼠标移入显示

    全局修改滚动条的样式,让滚动条变细且隐藏,只有鼠标移入到所属区域时才显示。 滚动条可设置的元素: 元素后面还可以跟一些事件:

    2024年01月19日
    浏览(33)
  • QT鼠标事件穿透,使QLabel、QPushbutton等上层控件可以被穿透

    几乎QT所有的标准控件都可以被穿透。方法除了我们自定义这个控件外,如: 之外,这些标准控件也可以通过配置setAttribute来实现鼠标事件穿透。如:

    2024年02月12日
    浏览(28)
  • vue鼠标移入显示弹窗,移出隐藏弹窗,记录一下

    鼠标移入A弹出B , 移出A隐藏B, A : B :  逻辑 :

    2024年02月04日
    浏览(31)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包