整体框架包括两个部分,一部分是UI界面框架,比如一级二级导航菜单按钮整体布局等,一部分是项目框架,上一篇文章说的是项目框架,这一篇文章来说界面框架,Qt做界面非常快速和高效,尤其是提供了可视化的界面设计,所见即所得,和大部分的开发环境类似,比如宇宙第一的VS,古老的VB,当年超级牛逼的dephi等,都是提供了可视化的所见即所得界面设计器,拖拖控件搞定,然后再去写对应的事件代码,最后编译打包发布。
Qt基本上是超大型一站式GUI超市框架,你要的各种控件都有,比如按钮、标签、文本框、下拉框、进度条等,应有尽有,就算没有的也可以自定义控件来实现,作为一个牛逼的GUI界面框架,要学好还是需要花一丢丢时间的,没有谁是一蹴而就的,做界面核心就两点:布局加配色,一般来说这是美工干的活,但是纵观国内大部分的程序员所在的公司,基本上没有美工,很可怜,需要程序员一个人全包所有的,从需求分析到详细设计到代码编写到界面设计到售后维护等。
Qt的布局提供了横向布局、垂直布局、表格布局、栅格布局,主要就这四种,学会了这几种布局其实还不够的,很多初学者会发现,达不到想要的效果,其实还要配合两个牛逼的东西,那就是控件本身的拉伸策略sizePolicy加上弹簧spacer,其中拉伸策略包括了四个要素,水平策略、垂直策略、水平伸展、垂直伸展。在一个完整的带界面的项目中,肯定需要用上这几个东西才能做出赏心悦目的界面。
Qt的配色当属QSS无敌了,这个东西据说是CSS2的子集,理论上包含了CSS2的所有写法,不过目前CSS3大行其道,QSS还不支持CSS3,估计要重写QSS解析器才行,代码量应该巨大,可能官方目前主推qml,未来估计也没有这个打算更新QSS使其支持CSS3,如果有一天支持CSS3了,那效果绝对宇宙第一了。我开源过3套QSS皮肤样式。
皮肤开源:[https://gitee.com/feiyangqingyun/QWidgetDemo](https://gitee.com/feiyangqingyun/QWidgetDemo) [https://github.com/feiyangqingyun/QWidgetDemo](https://github.com/feiyangqingyun/QWidgetDemo)
文件名称:styledemo
体验地址:[https://gitee.com/feiyangqingyun/QWidgetExe](https://gitee.com/feiyangqingyun/QWidgetExe) [https://github.com/feiyangqingyun/QWidgetExe](https://github.com/feiyangqingyun/QWidgetExe)
文件名称:bin_sams.zip
1. 采集数据端口,支持串口端口+网络端口,串口支持自由设置串口号+波特率,网络支持自由设置IP地址+通讯端口,每个端口支持采集周期,默认1秒钟一个地址,支持设置通讯超时次数,默认3次,支持最大重连时间,用于重新读取离线的设备。
2. 控制器信息,能够添加控制器名称,选择控制器地址+控制器型号,设置该控制器下面的探测器数量。
3. 探测器信息,能够添加位号,可自由选择探测器型号,气体种类,气体符号,高报值,低报值,缓冲值,清零值,是否启用,报警声音,背景地图,存储周期,数值换算小数点位数,报警延时时间,报警的类型(HH,LL,HL)等。
4. 控制器型号+探测器型号+气体种类+气体符号,均可自由配置。
5. 地图支持导入和删除,所有的探测器对应地图位置可自由拖动保存。
6. 端口信息+控制器信息+探测器信息,支持导入导出+导出到excel+打印。
7. 运行记录+报警记录+用户记录,支持多条件组合查询,比如时间段+控制器+探测器等,所有记录支持导出到excel+打印。
8. 导出到excel的记录支持所有excel+wps等表格文件版本,不依赖excel等软件。
9. 可删除指定时间范围内的数据,支持自动清理早期数据,设置最大保存记录数。
10. 支持报警短信转发,支持多个接收手机号码,可设定发送间隔,比如即时发送或者6个小时发送一次所有的报警信息,短信内容过长,自动拆分多条短信。
11. 支持报警邮件转发,支持多个接收邮箱,可设定发送间隔,比如即时发送或者6个小时发送一次所有的报警信息,支持附件发送。
12. 高报颜色+低报颜色+正常颜色+0值颜色+曲线背景+曲线颜色等,都可以自由选择。
13. 软件的中文标题+英文标题+logo路径+版权所有都可以自由设置。
14. 提供开关设置开机运行+报警声音+自动登录+记住密码等。
15. 报警声音可设置播放次数,界面提供17种皮肤文件选择。
16. 支持云端数据同步,可设置云端数据库的信息,比如数据库名称,用户名+密码等。
17. 支持网络转发和网络接收,网络接收开启后,软件从udp接收数据进行解析。网络转发支持多个目标IP,这样就实现了本地采集的软件,自由将数据转到客户端,随时查看探测器数据。
18. 自动记住用户最后停留的界面+其他信息,重启后自动应用。
19. 报警自动切换到对应的地图,探测器按钮闪烁。
20. 双击探测器图标,可以进行回控。
21. 支持用户权限管理,管理员+操作员两大类,用户登录+用户退出,可以记住密码和自动登录,超过三次报错提示并关闭程序。
22. 支持四种监控模式,设备面板监控+地图监控+表格数据监控+曲线数据监控,可自由切换,四种同步应用。
23. 支持报警继电器联动,一个位号可以跨串口联动多个模块和继电器号,支持多对多。
24. 本地数据存储支持sqlite+mysql,支持远程数据同步到云端数据库。自动重连。
25. 本地设备采集到的数据实时上传到云端,以便手机APP或者web等其他方式提取。
26. 支持两种数据源,一种是串口和网络通过协议采集设备数据,一种是数据库采集。数据库采集模式可以作为通用的系统使用。
27. 自带设备模拟工具,支持16个设备数据模拟,同时还带数据库数据模拟,以便在没有设备的时候测试数据。
28. 默认通信协议采用modbus协议,后期增加mqtt等物联网协议的支持,做成通用系统。
29. 支持所有windows操作系统+linux操作系统和其他操作系统。
t Designer中有很多UI界面组件,每种组件相对应有可设置的属性,本篇博文来让我们简单了解一下吧~
在Qt Designer中,提供了八大类界面可视化组件分别为:布局组件(Layouts)、分隔组件(Spacers)、按钮组件(Buttons)、表项视图(Item Views)、表项组件(Item Widgets)、容器组件(Containers)、输入组件(Input Widgets)、显示组件(Display Widgets),在Qt Designer的应用界面设计时,可以将各种功能的组件拖拽到窗口上进行应用的可视化界面设计,而每种组件又可以指定不同的属性。
布局组件包括:Vertical Layout(水平布局)、Horizontal Layout(垂直布局)、Grid Layout(网格布局)、Form Layout(表单布局)。
分隔组件包括:Horizontal Spacer(水平分隔)、Vertical Spacer(垂直分隔)。
按钮组件包括:Push Button(按钮)、Tool Button(工具按钮)、Radio Button(单选框)、Check Box(复选框)、Command Link Button(命令链接按钮)、Dialog Button Box(选择按钮)。
表项视图包括:List View(列表视图)、Tree View(树状视图)、Table View(表格视图)、Column View(列表视图)、Undo View(撤销视图)。
表项组件包括:List Widget(列表表项)、Tree Widget(树状表项)、Table Widget(表格表项)。
容器组件包括:Group Box(组合框,可以在内部添加内容,并修改标题头)、Scroll Area(带滑动条的框)、Tool Box(抽屉式框)、Tab Widget(标签式框)、Stacked Widget(栈式,需要信号启动)、Frame(带边框的布局)、Widget(不带边框的布局)、MDI Area(分栏显示)、Dock Widget(浮动窗口)、QAxWidget(只可以在Windows环境使用)。
输入组件包括:Combo Box(下拉选框)、Font Combo Box(下拉字体框)、Line Edit(行编辑区)、Text Edit(文本编辑区,只可以查看文字、图片和动画)、Plain Text Edit(文字编辑框)、Spin Box(调整数字框)、Double Spin Box(浮点型数字调整框)、Time Edit(时间)、Data Edit(日期)、Data/Time Edit(时间和日期)、Dial(罗盘)、Horizontal Scroll Bar(水平滚动条)、Vertical Scroll Bar(垂直滚动条)、Horizontal Slider(水平滑动条)、Vertical Slider(垂直滑动条)、Key Sequence Edit(快捷方式)。
显示组件包括:Label(标签组件,可查看文本、网页、图片和动画等)、Text Browser(文本框)、Graphics View(绘图工具)、Calendar Widget(日历)、LCD Number(LCD 数码管)、Progress Bar(进度条)、Horizontal Line(水平分割线)、Vertical Line(垂直分割线)、OpenGL Widget(OpenGL(Open Graphics Library,开放图形库)图形渲染的部件,可以在PyQt和Qt的应用中显示图形(包括2D和3D图形))、QQuickWidget(加载QML文件)。
第二部分有较多内容引用、学习该文章:Designer组件属性编辑界面中QWidget类相关属性详解,很多详细知识点可以参照该博文。
在Qt Designer中的每种组件属性编辑部分可以进行设置,如下图所示:
每种组件的属性会有所不同之处,这里以QWidget窗口为例,简单聊聊其属性,如下所示:
让我们一起看看吧~
可以看到,最顶层的节点为组件对应的父类(Form),从上往下排列的节点,基本按照父类在上,子类在下的方式排列,很好的体现了类的继承关系以及相关属性是哪个类提供的。
enabled属性
enabled属性用于表示组件是否可用,一个组件的部件可以接收和处理鼠标和键盘事件,当组件不可用时则无法接收和处理鼠标和键盘事件。
enabled属性缺省值为True,有些组件在被禁用时会以不同的方式显示自己。例如,按钮可能会将其标签显示灰色。
控制组件大小的属性有:geometry 、sizePolicy、minimumSize、maximumSize、sizeIncrement和baseSize,用于控制组件的初始大小以及动态调整大小的控制。属性配置界面的geometry定义了组件的初始大小,其他属性都与组件大小调整时控制组件的大小相关。
geometry属性
geometry属性保存组件相对于其父级对象的位置和大小,Qt实际上是以一个长方形来表示组件的位置和大小的,包括左上角的坐标位置、长和宽。
sizePolicy属性
sizePolicy属性用于说明组件在布局管理中的缩放方式,当部件没有在布局管理器中时,该设置无效。
sizePolicy属性由四个值组成,分别是水平策略、垂直策略、水平伸展和垂直伸展。
实践可参见:Python-PyQt5开发学习笔记(二):Layout(布局)
minimumSize属性
mimimumSize属性表示组件能被缩小到的最小尺寸,单位为像素,缩小到该尺寸后不能再进一步缩小了。如果组件在布局管理器中,且布局管理器也设置了最小尺寸,则部件本身的最小尺寸以部件的mimimumSize为准,布局管理器设置的不起作用。
maximumSize属性
maximumSize属性表示组件能被放大到的最大尺寸,放大到该尺寸后不能再进一步放大了。组件的缺省最大值为:(16777215,16777215)。
sizeIncrement属性
sizeIncrement属性表示组件调整大小时的每次变化的增量大小(单位:像素)的基数,实际调整大小计算公式如下: width=baseSize().width() + i * sizeIncrement().width() height=baseSize().height() + j * sizeIncrement().height()
其中i,j为非负整数。
baseSize属性
baseSize属性是组件的基础大小(单位:像素),如果组件设定了sizeIncrement,该属性用于在调整组件尺寸时计算组件应该调整到的合适值,这个属性缺省值是(0,0)。
palette属性
palette属性是调色板作用,管理着控件和窗体的所有颜色,可用于管理控件的外观显示以及设置组成。
font属性
font属性中可以设置组件的字体属性,包括字体的字体簇(Family)、大小(Size)、是否粗体(Bold)、是否斜体(Italic)、是否带下划线(Underline)、是否带删除线(Strikeout)等。
cursor属性
cursor属性保存组件的鼠标光标形状,当鼠标位于该组件上时就会呈现该属性设置的光标形状,可取值的范围及含义如下图所示:
mouseTracking属性
mouseTracking属性用于保存是否启用鼠标跟踪,缺省情况是不启用的。不启用的情况下,对应部件只接收在鼠标移动同时至少一个鼠标按键按下时的鼠标移动事件,启用鼠标跟踪的情况下,任何鼠标移动事件部件都会接收。
tabletTracking属性
tabletTracking属性保存是否启用组件的平板跟踪,缺省是不起用的。不启用平板跟踪的情况下,部件仅接收触控笔与平板接触或至少有个触控笔按键按下时的触控笔移动事件。 如果组件启用了平板跟踪功能,部件能接收触控笔靠近但未真正接触平板时的触控笔移动事件,这可以用于监视操作位置以及部件的辅助操作功能(如旋转和倾斜),并为图形界面提供这些操作的信息接口。
focusPolicy属性
focusPolicy属性可以设置组件的焦点策略。设置参数说明如下所示:
contextMenuPolicy属性
contextMenuPolicy属性是组件的快捷菜单策略,快捷菜单通过在部件上点击鼠标右键触发。设置参数说明如下所示:
acceptDrops属性
acceptDrops属性表示当前组件是否接受鼠标拖放事件,鼠标拖放应该是与鼠标拖拽结合在一起的,在Qt Designer中可以通过属性acceptDrops设置部件是否接受鼠标拖放事件。如果部件接受拖放,则在鼠标拖放时,拖放事件会发送给鼠标当前光标下接受拖放的第一个部件。
如果组件设置了acceptDrops属性为True,则就是通知系统该组件可接受鼠标拖放事件。
windowTitel属性
windowTitle属性是对窗口标题进行设置。
windowIcon属性
windowIcon属性是对窗口图标进行设置。
windowOpacity属性
windowOpacity属性为浮点数,表示组件透明度,为1完全不透明,为0完全透明,缺省是1。
toolTip属性
toolTip属性设置组件的toolTip提示信息,toolTip提示信息在鼠标放到控件上会浮动出一个小框显示提示信息。
toolTipDuration属性
toolTipDuration属性控制toolTip提示信息显示的时长,单位是毫秒,如果设置为-1,则显示时长根据toolTip内容的长度来计算。
statusTip属性
statusTip属性保存statusTip提示信息,statusTip提示信息在鼠标放到控件上时在窗口的状态栏显示提示信息,如果窗口无状态栏则不显示。statusTip属性缺省值为空字符串。
whatsThis属性
whatsThis属性保存组件的帮助信息。whatsThis的帮助信息一般在组件获得焦点后按Shift+F1弹出显示,如果这个快捷键被别的功能占用,则whatsThis的帮助信息可能无法展示。有些对话窗提供一个带问号的按钮可以点击显示whatsThis的帮助信息。whatsThis属性缺省值为空字符串。
accessibleName属性
accessibleName属性是辅助阅读中显示的组件的名称,用于残疾人辅助阅读。对于大多数小部件,无需设置此属性,因为Qt会调用部件相关属性显示,如按钮将显示按钮的文本,但当小部件不提供任何文本时,设置此属性很重要。例如,只包含图标的按钮需要将此属性设置为与屏幕阅读器一起使用。此属性默认为空。
accessibleDescription属性
accessibleDescription属性保存辅助技术所看到的部件描述,用于残疾人辅助阅读。是对accessibleName属性的补充说明。此属性默认为空。
layoutDirection属性
layoutDirection属性保存的是组件的布局方向,有三个取值:
autoFillBackground属性
autoFillBackground属性可以确认组件背景是否自动填充。
styleSheet属性
styleSheet属性是定义组件外观的属性样式表,在Qt中styleSheet样式表是类似于html的css样式一样的方法,只是专门为Qt中的部件开发的。styleSheet的定义语法也是类似CSS,并且是跨平台支持的。
locale属性
locale属性用于设置语言环境,包括语言和国家。如果一个部件没有设置语言环境,则使用父对象的语言环境或者默认语言环境(如果部件是顶层部件)。
windowFilePath属性
windowFilePath属性仅对窗口对象有效,用于关联一个窗口和对应的文件及路径。 当窗口没有设置标题属性的情况下,则窗口标题展示展示windowFilePath对应的文件名的信息(路径信息不展示),如果二者都设置,则优先使用窗口标题属性的设置作为标题。
该属性缺省为空,这个功能在窗口打开文件进行操作时可以使用来标记打开的文件。
inputMethodHints属性
inputMethodHints属性只对输入组件有效,输入法使用它来检索有关输入法应如何操作的提示,例如,如果设置了只允许输入数字的标志,则输入法可能会更改其可视组件,以反映只能输入数字。相关取值及含义如下:
windowModality属性
windowModality属性只对窗口对象有效,保存的是哪些类型的窗口被模式窗口阻塞。模式窗口防止其他窗口中的部件获取输入。此属性的值控制对应窗口可见时阻塞哪些类型的窗口获取输入。在模式窗口可见时更改此属性无效。相关取值及含义如下:
大屏地图模块采用浏览器模块+echart组件,Qt自带了webkit或者webengine模块,其中在win上mingw编译器的Qt5.6以后的版本,没有了浏览器模块,这个就需要用第三方的浏览器模块比如miniblink或者cef等,个人偏好miniblink因为足够简单。为了能够兼容所有的Qt版本和应用场景,特意专门写了通用浏览器控件独立的类webview,只要new即可,会自动判断Qt版本以及存在哪种浏览器模块就用哪种,优先采用Qt自带的浏览器模块,除非手动指定miniblink就用miniblink浏览器模块。
中间大屏地图多种样式:
*请认真填写需求信息,我们会在24小时内与您取得联系。