UI美化stylesheet

一、网上找到自己喜欢的图标

大家可以每个图标类型找出三种不同的颜色,方便后续美化效果,这里我每种只找了一个。(随便找的,最后效果不好看)

在这里插入图片描述
将这个文件夹复制到项目的文件夹中。
然后右键Add New…选择QT,添加Resouece文件。将上述4个图片文件添加到此文件中。

在这里插入图片描述

二、改变notebook图标以及自己的名字

在这里插入图片描述
图标就是你找的图片,名字取个自己喜欢的。

在这里插入图片描述

三、点击每个按钮进行改变样式表:——》添加资源下拉——》border-image。然后选择相应的图标,调整大小。

在这里插入图片描述

四、帮助——》索引:stylesheet ——》The Style Sheet Syntax

制作鼠标悬停按钮变化效果。
在这里插入图片描述
在这里插入图片描述

 QPushButton {
    color: red; background-color: white }
 QPushButton:hover {
    color: white }
 QPushButton:pressed {
    color: white }

每个按钮的改变样式表的位置。根据自己喜欢的颜色调整。
在这里插入图片描述
上图表示原始转态是一个图标,鼠标悬停(hover)又是另一个图标。点击鼠标(pressed)又是另一种图标。
在这里插入图片描述
上面是原始图,下面是鼠标悬停在上面,所以变成另一个图。

五、底部小优化

发现底部的字样不会随窗口变化而变化。加入两个弹簧。右边的设置固定Fixed大小。
在这里插入图片描述
代码中加入这一句,显性的关联widget_down和horizontalLayout_2。
在这里插入图片描述

再将widget_down水平居中。

在这里插入图片描述

相关推荐

  1. 【Qt】styleSheet设置

    2024-02-20 18:56:01       7 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-02-20 18:56:01       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-02-20 18:56:01       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-02-20 18:56:01       19 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-02-20 18:56:01       20 阅读

热门阅读

  1. 算法训练营day31,贪心算法5

    2024-02-20 18:56:01       30 阅读
  2. 阿里云上关于EDAS发布方式

    2024-02-20 18:56:01       19 阅读
  3. HTML单击图片独立放大

    2024-02-20 18:56:01       26 阅读
  4. 32RTC&BKP

    32RTC&BKP

    2024-02-20 18:56:01      30 阅读
  5. CSS进阶平面转换

    2024-02-20 18:56:01       25 阅读
  6. 算法-贪心算法

    2024-02-20 18:56:01       24 阅读
  7. Chapter 8 - 11. Congestion Management in TCP Storage Networks

    2024-02-20 18:56:01       32 阅读
  8. Windows如何安装ctcdecode

    2024-02-20 18:56:01       27 阅读
  9. big three(c++)

    2024-02-20 18:56:01       30 阅读
  10. Docker中部署flink集群的两种方式

    2024-02-20 18:56:01       30 阅读
  11. 基于python的租车管理平台/汽车租赁网站

    2024-02-20 18:56:01       24 阅读