基于QML的 客户端软件开发流程

一,背景

Qt Quick 作为Qt公司对移动端的一种尝试,无疑是失败的。生态的缺失,支持的不利,基本上看不到移动端有人用这套东西来开发应用,但是这套技术本身是不错的,快速的开发效率,gpu式的渲染方式,在取代传统QWidget 开发桌面应用方面,还是值得学习的。现结合多年使用经验,解析下Quick开发桌面客户端时,一个基本的开发流程。

二,demo

Quick  目前推荐的方式是界面与逻辑分离,界面采用qml开发,底层逻辑采用c++开发。 其实一些简单的界面逻辑也可直接用js写在界面文件中,c++只负责核心的业务逻辑。

我们demo的需求是:

1,登录页面输入用户名和密码,点击登录。

2,校验成功后,跳转到主页,显示一张背景图片。

分析需求,涉及到两个页面,登录页和首页。涉及的底层逻辑是,用户名和密码校验。因此,两个界面使用QML开发,底层逻辑使用C++。

三,具体实现

按照先开发页面再添加逻辑的流程。

1,利用QtCreator 建一个空的Quick项目:

2,添加Login.qml 登陆页 及Home.qml 主页,还有一张背景图片

3,登录页

两个文本输入框,一个登陆按钮,以及一个登陆成功的信号。

页面间切换采用信号传递的方式,也就是说当前页面完成本身的任务后,通过激发信号告知外界。而什么时候激发这个信号,则是涉及到底层的逻辑判断,我们在点击【登陆】时,进行判断,如果符合要求则激发登陆成功信号。

4,主页

一个图片,一个退出按钮,一个退出信号。点击【退出】时,激发退出信号

5,页面跳转

两个页面有了,逻辑判断稍后填充。那么页面如何跳转呢,Quick 有两种方式,一种是通过静态隐藏的方式,就是说两种页面提前全部加载,当捕获到登陆成功信号时,将登陆页隐藏,主页显示,捕获到退出信号时,将主页隐藏,登陆页显示。还有一种是只加载一种页面,根据信号来动态加载。更推荐第二种方式,因为处理起来方便,并且内存占用小。

通过Loader加载器,默认加载登录页,当收到登陆成功信号后,动态加载主页。当收到退出信号后,动态加载登录页。

总结下来,流程就是先单独开发页面,当前页面任务完成后,激发信号。程序收到此信号后,动态加载其他页面。

6,页面效果

7,添加底层逻辑

添加 maincontroller 类,将底层逻辑,添加到这个类中。当前demo 只涉及到用户名及密码的判断。

8,导入QML

将C++类导入到qml中,否则无法识别C++的类,导入按照作用域的分为两种方式。一种是临时的,相当于局部变量,只对当前QML文件可见,一种是永久的,对所有QML文件可见,相当于单列模式。具体使用哪种,按照这个类的作用进行选择,如果此类是所有qml文件都可能使用,那就导入成永久的,否则就使用临时的方式。下面使用的就是永久的方式,所有qml文件可见。

 9,填充逻辑

界面有了,逻辑写完。最后将逻辑填充到界面对应部分。我们在界面处,进行判断。

10,最终效果

四,总结

基于QMLQt Meta-Object Language)的监控系统开发具有许多优势。QML是一种声明式的语言,用于创建可交互的用户界面,并且与C++结合使用,使得开发高度可定制的监控系统变得更加简单和高效。 首先,QML提供了一种直观且易于理解的方式来设计用户界面。通过使用QML开发人员可以轻松创建动态和交互式的监控系统,以满足用户的需求。使用QML的强大功能,可以通过简单的代码编写来处理用户交互和数据显示。 其次,QML具有良好的可扩展性。QML是基于Qt框架的,这使得可以在不同的平台上运行开发的监控系统。无论是在Windows、Mac还是Linux系统上,基于QML的监控系统都能够正常运行,这大大增加了其适用范围。 此外,基于QML的监控系统可以与C++代码进行无缝集成。开发人员可以使用C++编写高性能的后台逻辑,然后通过使用QML将其连接到用户界面。这样一来,开发人员可以充分利用C++的强大功能,同时使用QML的灵活性和直观性。 最后,基于QML的监控系统可以轻松应对不同设备的屏幕尺寸和分辨率。QML允许开发人员在界面设计中使用自适应布局和可缩放的图形元素,以确保监控系统在不同设备上的显示效果良好。 综上所述,基于QML的监控系统开发是一种强大而灵活的选择。它提供了直观的用户界面设计,良好的可扩展性,与C++的无缝集成以及对不同设备的适应性,这些都使得开发高质量的监控系统变得更加容易。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

土拨鼠不是老鼠

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值