内容简介:这周简单的了解了下Qt的
点击上方蓝字可直接关注!方便下次阅读。如果对你有帮助,可以点个在看 或点个赞,感谢~
这周简单的了解了下Qt的 qml 。个人对它的定位就是可以方便快速地绘制一些精美的 UI ,对快速开发前端 (UI) 还是有挺大帮助的。所以并没有从整体上了解,而是快速的组合了一个小 Demo ,效果如下。试想下,如果自定义 Widget 需要实现多少东西呢?
Demo总体概述:通过 Widget 上的 Slider 控制 Qml 中的拨码盘刻度指向,实现了 Qml 与 Widget 通信。
程序环境:Windows、 Qt5.9.8(MSVC2015)
一、 项目准备
由于使用到了Qml以及 QQuickWidget ,所以 pro 中要添加 quick 和 quickwidgets 模块,不然会报出一些奇葩的问题。qml文件以及用到的图片是通过资源文件形式添加进来的。
QT += quick
QT += core gui quickwidgets
二、 程序源码
1. Widgwet部分
该部分主要使用了QQuickWidget用来嵌入 Qml 的显示,并使用 Qt 的信号和槽来进行通信。
ui->quickWidget->setSource(
QUrl(QStringLiteral("qrc:/main.qml")));
QObject *item = (QObject *)ui->quickWidget->rootObject();
if(nullptr != item)
{
connect(this,SIGNAL(signal_position(int)),
item,SIGNAL(posSignal(int)));
}
2. Qml部分
该部分程序几乎都是Qt官方自带例子的源码,为方便阅读,直接删去了例子中没 有用到的部分。
***\Qt5.9.8\Examples\Qt5.9.8\quick\customitems\dialcontrol\content
所以主要说下信号部分
Rectangle {
color: "#545454"
width: 300; height: 300
signal posSignal(int pos)
// 信号处理程序(处理从 Qt Widgets 接收到的信号)
onPosSignal: {
dial.value = pos
}
//官方例子拨码盘调用,删除其他程序
Dial {
id: dial
anchors.centerIn: parent
// value: slider.x * 100 / (container.width - 32)
value: 0
}
}
蓝色字体部分是Qml中信号声明以及实现的部分,与 Widget 中信号槽连接对应起来看。
三、 小结
对于地面站软件显示一些参数的情况下,使用Qml还是很方便的。以后有机会使用自定义 Widget 做一个类似的效果。
如果对其他前端语言比较熟悉的话,如h5、 js 等,使用它们也可以快速的搭建前端界面。越了解就会发现一个应用程序往往是多种语言结合在一起的,把合适的语言用在合适的地方。
需要工程源码的小伙伴可直接在公众号后台留言。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网
猜你喜欢:- RecyclerView使用指南(一)—— 基本使用
- 如何使用Meteorjs使用URL参数
- 使用 defer 还是不使用 defer?
- 使用 Typescript 加强 Vuex 使用体验
- [译] 何时使用 Rust?何时使用 Go?
- UDP协议的正确使用场合(谨慎使用)
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
Pro JavaScript Techniques
John Resig / Apress / 2006-12-13 / USD 44.99
Pro JavaScript Techniques is the ultimate JavaScript book for the modern web developer. It provides everything you need to know about modern JavaScript, and shows what JavaScript can do for your web s......一起来看看 《Pro JavaScript Techniques》 这本书的介绍吧!