【Qt应用】Qt部件icon图标：悬停放大，离开复原

冷眼看人间恩怨

已于 2025-06-26 09:22:28 修改

阅读量1.3k

点赞数 21

CC 4.0 BY-SA版权

分类专栏： Qt 文章标签：笔记 qt 开发语言 c++

于 2024-08-13 11:36:02 首次发布

本文链接：https://blog.youkuaiyun.com/qq_52924376/article/details/141156052

Qt 专栏收录该内容

34 篇文章

订阅专栏

②通过界面文件（ui文件）的属性编辑器设置

②左边文件和类的框中选择Qt，中间框中选择Qt Resource File，之后再点击右下角选择即可

③文件名随意，输入完成之后点击下一步即可

④这里不用改，点击完成就创建成功了

⑤刚开始添加文件是暗的，点击不了，只需要点击添加前缀即可添加文件了

前言

Qt默认的鼠标悬停效果比较简单且不易看出，本文通过事件过滤器对鼠标悬停与离开的效果进行了重写。

1.部件插入icon图标

下面都以Push Button为例：

1.1 使用资源文件（推荐方式）

Qt的资源系统允许开发者将图标、图片等资源文件编译到应用程序的可执行文件中，从而避免了在运行时依赖外部文件的问题。

①代码设置

QPushButton *button = new QPushButton(this);//初始化一个按钮
button->setText("");//将按钮的文本清空
button->setIcon(QIcon(":path/to/your/icon.png"));//设置按钮的icon图标,更改为自己的图标路径

②通过界面文件（ui文件）的属性编辑器设置

注：这里的button不能通过代码生成，需要在控件盒子中找到Push Button拖入ui文件中

找到属性编辑器中的icon选项，再点击倒三角选取选择资源这一选项即可

1.2 通过外部文件设置

QIcon icon("path/to/your/icon.png");  //更改为自己的图标路径
yourWidget->setIcon(icon);

2. 部件安装事件过滤器

2.1 安装事件过滤器

设置按钮的文本内容、图标以及大小。

QPushButton *button = new QPushButton(this);//初始化一个按钮
button->setText("");//将按钮的文本清空
button->setIcon(QIcon(":path/to/your/icon.png"));//设置按钮的icon图标（更改为自己的图标路径）
button->resize(QSize(100, 100));//设置按钮的大小
button->setIconSize(QSize(50, 50));//设置按钮的icon图标的大小
button->installEventFilter(this);//安装事件过滤器

2.2 事件过滤器的代码实现

判断鼠标进入按钮与离开按钮的信号，进入按钮则将按钮图标变大实现悬停放大的效果，离开按钮则将图标恢复原样实现离开复原的效果

bool YouClass::eventFilter(QObject *obj, QEvent *event) {
    QPushButton *button = static_cast<QPushButton*>(obj);
    if (event->type() == QEvent::Enter) {
        // 鼠标进入按钮时，改变按钮的图标大小（这里以具体的数值为例）
        button->setIconSize(QSize(100, 100));

        return true; // 表示事件已被处理
    } else if (event->type() == QEvent::Leave) {
        // 鼠标离开内部按钮时，恢复外部按钮的默认样式（这里以具体的数值为例）
        button->setIconSize(QSize(50, 50));

        return true; // 表示事件已被处理
    }
    return YouClassBaseClass::eventFilter(obj, event);
}

3.实现效果

优化

将按钮背景设置成透明：

button->setStyleSheet("QPushButton {background-color:transparent;}");