在前文中我们展示了如何在Visual Studio中针对Windows和嵌入式Linux创建多平台Qt Quick应用程序项目。现在,我们将展示如何在嵌入式设备上运行该应用程序。然后,我们将继续将该项目开发为我们打算创建的完整嵌入式应用程序。最后,我们将使用VS调试器对应用程序的C ++和QML代码进行远程调试。
Qt是一个跨平台框架,通常用作图形工具包,它不仅创建CLI应用程序中非常有用。而且它也可以在三种主要的台式机操作系统以及移动操作系统(如Symbian,Nokia Belle,Meego Harmattan,MeeGo或BB10)以及嵌入式设备,Android(Necessitas)和iOS的端口上运行。现在我们为你提供了免费的试用版。赶快点击下载Qt最新试用版吧>>
点击获取更多文章教程
【Qtitan组件集】
- QtitanRibbon| 下载试用: 遵循Microsoft Ribbon UI Paradigm for Qt技术的Ribbon UI组件,致力于为Windows、Linux和Mac OS X提供功能完整的Ribbon组件。
- QtitanChart | 下载试用 : 是一个C ++库,代表一组控件,这些控件使您可以快速地为应用程序提供漂亮而丰富的图表。并且支持所有主要的桌面操作系统。
- QtitanDataGrid| 下载试用 : 适用于Qt的商业化DataGrid 组件,使得表格数据可以直接面向终端用户完全集成了QtDesigner,极易适应其他相似开发环境,保证100%兼容Qt GUI。
在嵌入式设备上运行
我们已经展示了如何交叉编译在Visual Studio中创建的“ hello world” Qt Quick应用程序。现在,我们将看到如何在Raspberry Pi上运行该应用程序。由于我们将以全屏模式运行,因此我们必须首先向应用程序窗口中添加一些内容。
Window { visible: true title: qsTr("Hello World") Text { id: clock font.pointSize: 72 Timer { interval: 1000; running: true; repeat: true onTriggered: clock.text = (new Date).toLocaleTimeString(Qt.locale("de_DE"), "hh:mm:ss"); } }}
和以前一样,选择Linux项目配置,然后按F7键开始交叉编译。
1>------ Build started: Project: QuickMirror, Configuration: Debug_RPi x64 ------1>rcc qml.qrc1>Invoking 'mkdir -p $(dirname qml.qrc); mkdir -p $(dirname /mnt/c/Users/user/Source/Repos/QuickMirror/main.qml); mkdir -p $(dirname /mnt/c/Users/user/Source/Repos/QuickMirror/obj/x64/Debug_RPi/rcc/qrc_qml.cpp); (/home/user/raspi/qt5/bin/rcc /mnt/c/Users/user/Source/Repos/QuickMirror/qml.qrc --name qml -o /mnt/c/Users/user/Source/Repos/QuickMirror/obj/x64/Debug_RPi/rcc/qrc_qml.cpp)', working directory: '/mnt/c/Users/user/Source/Repos/QuickMirror'1>Starting remote build1>Compiling sources:1>qrc_qml.cpp1>Linking objects1>QuickMirror.vcxproj -> C:UsersuserSourceReposQuickMirrorbinx64Debug_RPiQuickMirror.out========== Build: 1 succeeded, 0 failed, 0 up-to-date, 0 skipped ==========
要在每次构建结束时自动复制应用程序文件,可以在“ WSL构建后事件”属性页中设置以下命令(ATTN: 这将以明文形式保存设备密码)。
C:Usersuser> scp C:UsersuserSourceReposQuickMirrorbinx64Debug_RPiQuickMirror.out pi@192.168.1.98:/home/pi/pi@192.168.1.98's password:QuickMirror.out 100% 465KB 1.6MB/s 00:00C:Usersuser>
在启动Qt Quick应用程序之前,我们需要设置一些必需的环境变量:
-
LD_LIBRARY_PATH
Qt二进制文件安装目录的路径。 -
QT_QPA_PLATFORM
平台插件。 -
QT_QPA_PLATFORM_PLUGIN_PATH
平台插件安装目录的路径。 -
QT_QPA_EGLFS_PHYSICAL_WIDTH
QT_QPA_EGLFS_PHYSICAL_HEIGHT
物理屏幕的宽度和高度,以毫米为单位。 -
QML2_IMPORT_PATH
安装的QML模块的路径。
pi@raspberry-pi:~$ export LD_LIBRARY_PATH="/usr/local/qt5pi/lib"pi@raspberry-pi:~$ export QT_QPA_PLATFORM="eglfs"pi@raspberry-pi:~$ export QT_QPA_PLATFORM_PLUGIN_PATH="/usr/local/qt5pi/plugins/platforms"pi@raspberry-pi:~$ export QT_QPA_EGLFS_PHYSICAL_WIDTH="326"pi@raspberry-pi:~$ export QT_QPA_EGLFS_PHYSICAL_HEIGHT="520"pi@raspberry-pi:~$ export QML2_IMPORT_PATH="/usr/local/qt5pi/qml"pi@raspberry-pi:~$ ./QuickMirror.out
树莓派显示器

在Raspberry Pi中运行“ Hello World”应用程序
开发应用程序
我们的应用程序的要求包括显示以下信息:
- 当前时间
- 当前日期
- 周年纪念
- 天气预
- 下次出发的公共交通工具
- 新闻
我们将把每个项目封装为专用的QML类型。为此,我们必须首先将QML模块定义(qmldir)文件添加到项目中:
- 选择“项目>添加新项。。> Qt> QML模块定义”。
- 在位置字段中,指示将包含QML文件的文件夹的路径。

向项目添加新的QML模块定义
按下“添加”后,qmldir 文件将在项目树中可用。我们将使用此文件来定义每种QML类型到其对应源文件的映射。
ApiCall 1.0 QuickMirror.ApiCall.qmlCalendar 1.0 QuickMirror.Calendar.qmlClock 1.0 QuickMirror.Clock.qmlNewsTicker 1.0 QuickMirror.NewsTicker.qmlOnThisDay 1.0 QuickMirror.OnThisDay.qmlPublicTransport 1.0 QuickMirror.PublicTransport.qmlWeather 1.0 QuickMirror.Weather.qml
要将新的QML源文件添加到项目中:
- 选择“项目>添加新项…> Qt> QML文件”。
- 将位置设置qmldir为创建文件的相同目录。
- 设置QML文件名。
- 按“添加”。

我们将首先添加QML类型以显示当前时间,当前日期和重要的周年纪念日。该Clock类型将显示当前时间,每秒刷新一次。
QuickMirror.Clock.qml
function refresh() { text = (new Date).toLocaleTimeString(Qt.locale("de_DE"), "hh:mm"); } Component.onCompleted : refresh(); Timer { interval: 1000; running: true; repeat: true onTriggered: parent.refresh(); }}
该Calendar类型将显示当前日期,并在不同语言环境之间循环。
QuickMirror.Calendar.qml
Text { renderType: Text.NativeRendering id: calendar color: "white" font.family: FontFamily_Bold font.styleName: FontStyle_Bold font.pointSize: 72 property var locales: ["en_US", "de_DE", "pt_PT"] property var localeIdx: 0 function capitalize(s) { return s.replace(/(-)./g, function(c) { return c.toUpperCase(); }); } function setNextLocale() { localeIdx = (localeIdx + 1) % locales.length; } function getCurrentText() { var date = new Date; var locale = Qt.locale(locales[localeIdx]); var calendarText = capitalize(date.toLocaleDateString(locale, "dddd, dd")); var monthShort = date.toLocaleDateString(locale, "MMM"); var monthLong = date.toLocaleDateString(locale, "MMMM"); if (monthLong.length <= 5) { calendarText += capitalize(monthLong); } else { calendarText += capitalize(monthShort); if (!monthShort.endsWith(".")) calendarText += "."; } calendarText += date.toLocaleDateString(locale, " yyyy"); return calendarText; } Component.onCompleted: { text = getCurrentText(); } Timer { interval: 15000; running: true; repeat: true onTriggered: { setNextLocale(); text = getCurrentText(); } } Behavior on text { SequentialAnimation { NumberAnimation { target: calendar; property: "opacity"; to: 0.0; duration: 1000 } PropertyAction { target: calendar; property: "text" } NumberAnimation { target: calendar; property: "opacity"; to: 1.0; duration: 500 } } } }
除了日期/时间,我们的应用程序还将依靠Web API来检索信息。我们将curl在一个单独的过程中运行以连接到Web API。流程创建将由名为的C ++类处理Process。然后,QML类型ApiCall将使用一个Process对象以curl必要的参数开始并收集其输出。
QuickMirror.ApiCall.qml
Item { property var url: "" property var path: [] property var query: [] signal response(var response) signal error(var error) Process { id: curl property var path: Q_OS_WIN "C:\Windows\System32\curl.exe" : "/usr/bin/curl" property var request: "" command: path + " -s "" + request + """""" } function sendRequest() { curl.request = url; if (path.length > 0) curl.request += ""/"" + path.join(""/""); if (query.length > 0) curl.request += "" + query.join(""&""); curl.start(); } Connections { target: curl onExit /*(int exitCode声明:本站部分文章及图片源自用户投稿,如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢!