Qt是一个C++应用程序框架。它拥有完备的C++图形库和集成了一系列代码模块, 支持C++,Python,QML,Javascript等多种语言,同时也拥有一套完整的设计、开发工具。
使用Qt开发的软件,相同的代码可以在大多数的平台上编译运行,而不需要修改源代码。 它会自动根据平台的不同,表现平台特有的图形界面风格。
Qt 为了更好的支持移动端开发引入Quick和QML。
Qt Quick
模块是用于编写QML应用程序的标准库。
虽然Qt的QML模块提供QML引擎和语言基础设施方面,Qt Quick的模块提供了所有必要的与QML创建用户界面的基本类型。
它提供了一个视觉画布,并包括用于创建和动画化视觉组件,接收用户输入,创建数据模型和视图以及延迟对象实例化的类型。
Qt Quick模块既提供了QML API(用于提供使用QML语言创建用户界面的QML类型),又提供了C ++ API(用于使用C ++代码扩展QML应用程序)。
QML
是一种用户界面规范和编程语言。
它使开发人员和设计师都可以创建高性能,流畅动画和视觉吸引力的应用程序。
QML提供了一种高度可读的,声明性的,类似于JSON的语法,并支持将命令性JavaScript表达式与动态属性绑定结合在一起。
这一章主要是对QtQucik进行介绍以及如何配置LubanCat的运行环境,就不再深入讲解Quick,Qml的原理和语法。
1.1.
Hello Quick
Quick和Widget方式不太一样,我们演示一个Quick工程的创立。
打开Qt Creator,新建Quick工程。
工程会创建如下四个文件。
int
main
(
int
argc
,
char
*
argv
[])
QCoreApplication
::
setAttribute
(
Qt
::
AA_EnableHighDpiScaling
);
QGuiApplication
app
(
argc
,
argv
);
QQmlApplicationEngine
engine
;
engine
.
load
(
QUrl
(
QStringLiteral
(
"qrc:/main.qml"
)));
if
(
engine
.
rootObjects
().
isEmpty
())
return
-1
;
return
app
.
exec
();
首先在QtQuick中配置
高DPI
支持,
其次定义一个QGuiApplication使程序进入事件循环;
定义QQmlApplicationEngine来加载应用程序的单个QML文件,main.qml如下。
main.qml
20
import QtQuick 2.11
import QtQuick.Window 2.11
Window {
visible: true
width: 640
height: 480
property alias text1: text1
title: qsTr("Hello World")
Text {
id: text1
text: qsTr("hello quick")
anchors.fill: parent
verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter
elide: Text.ElideNone
font.pixelSize: 12
在这个Qml文件中,首先定义了一个640*480的窗口,
窗口中有一个Text的文本框,文本框的文字为:hello quick,属性:水平垂直居中,字体大小12号。
1.2. 移植qml qchart
Qt Charts 是Qt中的一个模块,可以创建炫酷的,可交互式的图表。Qt Charts使用Graphics View Framework来简化集成。图表组件可用作QWidget或QGraphicsWidget对象或QML类型。
下面我们qt官方给出的一个qchart demo来演示qml程序如何移植到LubanCat。
启动qt_creator,找到qmlchart官方例程。
编译、运行桌面版qmlchart程序
1.3.1. 配置LubanCat环境
我们开发板上系统属于debian系统中的 buster 发行版。
使用debian的好处之一就是能够直接使用社区资源。Debian目前有超过59000个软件包可供使用,几乎涵盖所有的开源软件。
所有的发行版libs 子版面的软件包都可以在下面的链接中找到 https://packages.debian.org/buster/libs/
比如上一小节移植了qmlchart这个程序,直接在系统中运行会提示我们缺少 libQt5Charts.so.5 这个动态链接库
我们可以在上述网页中搜索对应的安装包,https://packages.debian.org/search?searchon=names&keywords=libQt5Charts
然后在我们LubanCat上面执行 apt install libqt5charts5 就可以了。
上述demo程序要在LubanCat上运行还需要 qml-module-qtquick2 和 qml-module-qtcharts,直接安装即可。