边框图标手把手教你界面字体轻松(图标界面软件字体边框)「图标边框设置」

Python是一种面向对象的高级动态编程语言,相比于其它如C/C++语言,具有上手快、代码少、开发效率高的特点,Qt是跨平台的C++图形用户界面应用程序开发框架,是当前主流的GUI开发工具之一,其在Python下的绑定是PyQt库
使用“Python+PyQt”架构编写应用软件,可以做到在兼顾软件运行效率的前提下,大大节省时间成本,加快项目的开发进度
图标字体库(Font Awesome字体库)提供了一套漂亮、可缩放的矢量图标,对于这些图标可使用CSS所提供的所有特性对它们进行更改,包括:大小、颜色、阴影或者其它任何支持的效果
在Python语言中,使用PyQt界面库搭配图标字体库,可以作出非常炫酷的界面程序
下面给出一个在PyQt界面库中,使用图标字体库开发的一种通用的无边框导航软件界面示例程序,这种导航式界面在嵌入式程序中使用的比较多,是一种比较常见的简单的软件界面设计风格
示例介绍软件运行界面如下图所示:在主界面上,上面部分是导航条区域,包括了软件图标(兼顾返回功能)、标题及关闭按钮,下面部分是主操作区域,初始界面包括六个按钮,点击每个按钮可进入不同的操作页面,如点击“温度监控”按钮,则切换到温度监控页面,在这个页面中可根据实际情况作具体的界面布局,如下图所示:同时,软件左上角图标区域的图标也作了改变,可点击该区域图标返回到初始界面
此外,拖动导航条区域或六个按钮之间的空白区域,可以拖动整个窗口到新的位置
编程分析对于上面软件界面的实现,主要涉及到的难点包括:(1) 如何将字体设置或者转换为图标?(2) 如何在无边框情况下拖动窗体?(3) 如何对软件界面进行美化?对于上面的问题,可以单独设计一个负责应用程序辅助管理的继承于QObject的类MgrHelper,对于本例,主要用于实现图标字体的管理、软件窗口的拖动管理等任务
在美化方面,可使用QSS(Qt Style Sheets)即Qt样式表对界面元素进行外观美化
可使用设计师先设计窗口的外观框架,将其转换为py文件,在主类中进行调用并作美化及相应的各种槽函数实现
下面分别进行介绍
使用设计师设计软件界面在Python中使用设计师设计软件界面的详细操作步骤可参考前面的文章:Python+PyQt架构:使用设计师编写界面程序入门示例对于本例,设计完成后界面如下图所示:界面中涉及到的所有界面对象元素名称、布局及相互之间的关系如下图所示:其中,上部的导航条区域是一个QWidget,包含两个QPushButton和一个QLabel,下面主窗口区域是一个QStackedWidget,包含7个页面,第1个页面为主操作页面,后面6个为每个操作对应的具体页面
上下两部分区域采用垂直布局
在设计师中完成界面设计后,保存该界面文件为“Main.ui”
在PyCharm开发环境中,选中这个文件,在右键菜单中选择“PyQt4-->PyUIC”将其转换为Python能够识别的文件“Ui_Main.py”
辅助管理助手类MgrHelper的实现代码辅助类MgrHelper主要实现图标字体的管理、软件窗口的拖动等任务,其实现代码如下图所示:其主要代码解释如下:(1)第16行,定义一个类的静态变量self,在主类中调用时,未定义该类的实例,直接使用了该类的相关函数,所以定义了该变量
(2)第17-24行,初始化函数,装载图标字体库,安装事件过滤器,在事件过滤函数中实现窗口的拖动功能
(3)第26-30行,定义一个类的静态函数,返回当前实例对象
(4)第32-35行,根据要设置的图标对应的charCode及字体大小参数,对控件设置字体图标
(5)第37-47行,对某个字体图标返回它的图像,可设置这个图标的字体大小、颜色及图标尺寸大小
(6)第49-60行,在事件过滤函数中实现窗体的拖动功能
主窗口类实现代码主窗口类MyWindow主要实现窗口字体图标加载、美化及相应槽函数的实现,主要代码框架如下图所示:其主要代码解释如下:(1)第63-67行,类初始化代码,加载设计师界面文件
(2)第69-74行,常量初始化函数
(3)第76-122行,界面初始化函数,实现字体图标加载、美化,随后介绍
(4)第123-128行,当点主操作页面的每个操作按钮时,切换到对应的具体操作界面中并修改软件标题
(5)第130-131行,当点击导航条区域右上角退出按钮时退出程序
(6)第133-138行,当点击导航条区域左上角返回按钮时,返回到主操作页面,并改变按钮的图标样式
其中,实现字体图标加载、美化的initUI函数具体代码如下:其主要代码解释如下:(1)第78行,设置该窗口为无边框样式
(2)第79行,为该类增加属性“canMove”,并设置其值为True,用于在事件过滤函数中判断该窗口是否可移动
(3)第87-88行,设置导航条区域左边和右边两个按钮的字体图标
(4)第91-99行,使用QSS样式表对顶部导航区域进行美化,包括颜色、字体大小等设置
(5)第101-122行,为主操作界面上的每个按钮加载字体图标并关联槽函数
(6)第124-125行,为导航条区域左边和右边两个按钮关联槽函数
完整的测试代码对于本例,完整测试代码如下图所示:代码比较简单,这儿不作详细解释了,运行程序后,就会出现本文开始的提到的运行界面图
总结在Python+PyQt架构下使用图标字体库,对于如何实现无边框通用导航软件界面,本例给出了具体设计步骤及详细实现代码
这是一个通用的软件界面布局框架,在这个基础上可以很容易的进行扩展,开发出满足自己特定项目需要的软件界面
如果你觉得这篇文章对你有用的话,关注+收藏+点赞吧
边框图标手把手教你界面字体轻松(图标界面软件字体边框)
(图片来源网络,侵删)

联系我们

在线咨询:点击这里给我发消息