Qml 快速使用

栏目: IT技术 · 发布时间: 4年前

内容简介:这周简单的了解了下Qt的

点击上方蓝字可直接关注!方便下次阅读。如果对你有帮助,可以点个在看 或点个赞,感谢~

这周简单的了解了下Qt的 qml 。个人对它的定位就是可以方便快速地绘制一些精美的 UI ,对快速开发前端 (UI) 还是有挺大帮助的。所以并没有从整体上了解,而是快速的组合了一个小 Demo ,效果如下。试想下,如果自定义 Widget 需要实现多少东西呢?

Qml 快速使用

Demo总体概述:通过 Widget 上的 Slider 控制 Qml 中的拨码盘刻度指向,实现了 QmlWidget 通信。

程序环境:Windows、 Qt5.9.8(MSVC2015)

一、  项目准备

由于使用到了Qml以及 QQuickWidget ,所以 pro 中要添加 quickquickwidgets 模块,不然会报出一些奇葩的问题。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 等,使用它们也可以快速的搭建前端界面。越了解就会发现一个应用程序往往是多种语言结合在一起的,把合适的语言用在合适的地方。

需要工程源码的小伙伴可直接在公众号后台留言。

Qml 快速使用


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

精通HTML

精通HTML

Paul Haine / 杨明军 / 人民邮电出版社 / 2008-2 / 35.00元

本书深入地探讨了(X)HTML及相关技术包括CSS、微格式、语义网等,重点阐述了如何在恰当的时候使用恰当的标签,全书始终贯彻现代的Web设计理念,从而使读者可以学习如何充分利用各种标记提供的多样性,创建语义丰富和结构合理的网站。 本书适合具备初步HTML和CSS知识的Web设计开发人员阅读。一起来看看 《精通HTML》 这本书的介绍吧!

随机密码生成器
随机密码生成器

多种字符组合密码

Base64 编码/解码
Base64 编码/解码

Base64 编码/解码

MD5 加密
MD5 加密

MD5 加密工具