内容简介:这周简单的了解了下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协议的正确使用场合(谨慎使用)
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。