Qt QML和QtQuick简介以及QML实例
bigegpt 2025-01-02 14:42 5 浏览
从 Qt 4.7 开始,Qt 引入了一种声明式脚本语言,称为 QML(Qt Meta Language 或者 Qt Modeling Language),作为 C++ 语言的一种替代。而 Qt Quick 就是使用 QML 构建的一套类库。 QML 是一种基于 JavaScript 的声明式语言。在 Qt 5 中, QML 有了长足进步,并且同 C++ 并列成为 Qt 的首选编程语言。
也就是说,使用 Qt 5,我们不仅可以使用 C++ 开发 Qt 程序,而且可以使用 QML。虽然 QML 是解释型语言,性能要比 C++ 低一些,但是新版 QML 使用 V8,Qt 5.2 又引入了专为 QML 优化的 V4 引擎,使得其性能不再有明显降低。在 Nokia 发布 Qt 4.7 的时候,QML 被用于开发手机应用程序,全面支持触摸操作、流畅的动画效果等。但是在 Qt 5 中,QML 已经不仅限于开发手机应用,也可以用户开发传统的桌面程序。
QML 文档描述了一个对象树。QML 元素包含了其构造块、图形元素(矩形、图片等)和行为(例如动画、切换等)。这些 QML 元素按照一定的嵌套关系构成复杂的组件,供用户交互。
——摘自《Qt学习之路2》
helloworld实例:
新建项目如图:
选择Qt Quick Application,组件选择Qt Quick 2.1
创建项目成功之后,Qt会为我们自动生成一系列文件:
我们真正需要关注的是:main.qml 里面的内容
【领QT开发教程学习资料,点击下方链接莬费领取↓↓,先码住不迷路~】
点击→领取「链接」
1 import QtQuick 2.1
2 import QtQuick.Window 2.0
3
4 Window {
5 visible: true
6 width: 360
7 height: 360
8
9 MouseArea {
10 anchors.fill: parent
11 onClicked: {
12 Qt.quit();
13 }
14 }
15
16 Text {
17 text: qsTr("Hello World")
18 anchors.centerIn: parent
19 }
20 }
如上述代码所示,一个 QML 文档分为 import 和 declaration 两部分。前者用于引入文档中所需要的组件(有可能是类库,也可以是一个 JavaScript 文件或者另外的 QML 文件);后者用于声明本文档中的 QML 元素。
每一个 QML 有且只有一个根元素,类似于 XML 文档。这个根元素就是这个 QML 文档中定义的 QML 元素,在这个例子中就是一个 Window 对象。注意一下这个 QML 文档的具体语法,非常类似于 JSON 的定义,使用键值对的形式区分元素属性。所以我们能够很清楚看到,我们定义了一个窗口,可见性为真,宽度为 360 像素,高度为 360 像素。记得我们说过,QML 文档定义了一个对象树,所以 QML 文档中元素是可以嵌套的。在这个窗口中,我们又增加了一个 Text 元素,顾名思义,就是一个文本。
Text 显示的是 Hello World 字符串,而这个字符串是由 qsTr()函数返回的。qsTr()函数就是 QObject::tr()函数的 QML 版本,用于返回可翻译的字符串。Text 的位置则是由锚点(anchor)定义。示例中的 Text 位置定义为 parent 中心,其中 parent 属性就是这个元素所在的外部的元素。anchors.centerIn: parent同理,我们可以看到MouseArea 是充满父元素的。MouseArea 还有一个 onClicked 属性。这是一个回调,也就是鼠标点击事件。 MouseArea可以看作是可以相应鼠标事件的区域。当点击事件发出时,就会执行 onClicked 中的代码。这段代码其实是让整个程序退出。注意我们的 MouseArea充满整个矩形anchors.fill: parent,所以整个区域都可以接受鼠标事件。
运行效果示例:
接下来我们可以改变 main.qml 文件中的“Hello World”字符串,不重新编译直接运行,就会看到运行结果也会相应的变化。这说明 QML 文档是运行时解释的,不需要经过编译。所以,利用 QML 的解释执行的特性,QML 尤其适合于快速开发和原型建模。另外,由于QML 比 C++ 简单很多,所以 QML 也适用于提供插件等机制。
- 上一篇:QML 发光呼吸动画字体
- 下一篇:QML组件(Compontents)
相关推荐
- 数据中台与业务中台总体技术架构设计方案
-
《数据中台与业务中台总体技术架构设计方案》提出**“开放、稳定、滋养”三原则**,强调通过统一技术架构与框架破除烟囱式系统,构建**“业务中台+数据中台”闭环体系**。方案主张从单体架...
- 三分钟摸清楚什么叫前后端分离(什么是前后端分离架构?)
-
什么叫前后端分离?其实,前后端分离的初衷是为了分离前后端开发人员的职责,解决开发模式的问题。说到底,前后端分离就是将前端视图和后端数据进行分离,这样,后端只需要提供接口(后端数据)给前端,而前端也可以...
- 刚刚,给学妹普及了登录的两大绝学
-
今天跟大家聊一个比较基础的话题,就是实现登录的方式有哪些?适合刚入行的朋友。华山之Session绝学Session我们称之为会话控制,是一种在服务器端保持会话状态的解决方案。通俗点来讲就是客户...
- 6种微服务RPC框架,你知道几个?(grpc是微服务框架吗)
-
开源RPC框架有哪些呢?一类是跟某种特定语言平台绑定的,另一类是与语言无关即跨语言平台的。跟语言平台绑定的开源RPC框架主要有下面几种。Dubbo:国内最早开源的RPC框架,由阿里巴巴公司...
- 微服务中,Spring Cloud 有哪些注册中心?
-
SpringCloud是微服务架构中经常使用的一个框架,它提供了一系列工具来帮助开发者构建和管理分布式系统,而服务注册中心又是微服务架构中一个关键组件。那么,SpringCloud支持哪些注册...
- Eureka的自我保护机制(eureka自我保护机制原理)
-
最近遇到一个问题,服务之间调用报错,显示无法路由到指定服务,但是对应的服务是启动的,查询eureka,结果eureka上显示如下,所有实例均消失,我个人对注册中心并没有什么研究,进行正好借此机会简单总...
- eureka、zookepeer、nacos的区别(eureka和nacos哪个更好)
-
前言随着微服务被各大企业应用在项目中,微服务的框架也被更多人学习和使用,但是大部分情况下都是停留在应用层。一、演变过程1.1服务注册和发现基本概念服务注册:将某个或者某些服务的信息(模块的ip和...
- 40K+Star!Mall电商实战项目开源,附源码、教程合集
-
最近看了下我的Github,发现mall项目已经突破40K+Star,有点小激动!记得去年8月的时候mall项目刚过20K+Star,时隔1年多已经增长到了40K+Star。今天跟大家聊聊mall项目...
- SpringCloud 常见注册中心的比较(springcloud注册过程)
-
一、概述springcloud是一个非常优秀的微服务框架,要管理众多的服务,就需要对这些服务进行治理,也就是我们说的服务治理,服务治理的作用就是在传统的rpc远程调用框架中,管理每个服务与每个服务之间...
- 简单介绍Nacos服务注册中心(nacos注册中心有什么用)
-
Nacos是阿里开源的一个新框架,在分布式的架构中,Nacos同时扮演着服务注册中心和配置中心的角色。今天主要讲的是Nacos作为服务注册中心。分布式中著名的CAP理论,任何一种服务注册中心都只能实现...
- 入门注册中心——consul(注册中心怎么注册)
-
基础概念什么是注册中心随着微服务理论发展的成熟,越来越多互联网公司采用微服务架构来支持业务发展。各个微服务之间都需要通过注册中心来实现自动化的注册和发现。注册中心主要有三种角色:服务提供者(RPCS...
- 08 Eureka的基础知识(eureka replication)
-
Eureka是Netflix开发的服务发现框架,SpringCloud将它集成在自己的子项目spring-cloud-netflix中,实现SpringCloud的服务发现功能。上图简要描述了Eur...
- 微服务架构中的服务注册与发现有哪些?Zookeeper、Eu
-
“大家好,我是码哥,《Redis高手心法》作者,本章节选自《Java面试高手心法58讲》专栏。随着单体应用的拆分,我们面临的首要问题就是采用哪种方式实现服务间的调用,像之前单体应用可能直接在配...
- Eureka 都挂了,微服务还能调通吗?
-
如果你做过微服务开发,这个面试题应该能够立马答出来,如果你没做过微服务开发,但是学过一些SpringCloud组件的用法,这个问题可能要稍微想一下,但是也应该能够答出来。今天就来和大家说说这个问...
- ZooKeeper、Eureka、Consul 、Nacos微服务注册中心对比
-
注册中心前言服务注册中心本质上是为了解耦服务提供者和服务消费者。对于任何一个微服务,原则上都应存在或者支持多个提供者,这是由微服务的分布式属性决定的。更进一步,为了支持弹性扩缩容特性,一个微服务的提供...
- 一周热门
- 最近发表
- 标签列表
-
- mybatiscollection (79)
- mqtt服务器 (88)
- keyerror (78)
- c#map (65)
- resize函数 (64)
- xftp6 (83)
- bt搜索 (75)
- c#var (76)
- mybatis大于等于 (64)
- xcode-select (66)
- mysql授权 (74)
- 下载测试 (70)
- linuxlink (65)
- pythonwget (67)
- androidinclude (65)
- logstashinput (65)
- hadoop端口 (65)
- vue阻止冒泡 (67)
- oracle时间戳转换日期 (64)
- jquery跨域 (68)
- php写入文件 (73)
- kafkatools (66)
- mysql导出数据库 (66)
- jquery鼠标移入移出 (71)
- 取小数点后两位的函数 (73)