Difference between revisions of "Template:FriendlyCoreRK3399QtDev/zh"

From FriendlyELEC WiKi
Jump to: navigation, search
(updated by API)
(updated by API)
 
(10 intermediate revisions by 2 users not shown)
Line 1: Line 1:
−
===开发Qt应用===
+
===开发Qt程序===
 +
 
 +
FriendlyELEC为RK3399平台移植的 Qt 5.10.0 支持以下显示设备插件：KMS、EGLFS和XCB，这三种插件均支持OpenGL ES和GPU硬件加速，只是调用方式不同，具体如下：<br>
 +
* KMS – 使用Linux内核的DRM显示接口来渲染界面<br>
 +
* EGLFS – 使用OpenGL ES接口来渲染界面<br>
 +
* XCB – 在X11服务器上运行，并集成到X11窗口环境<br>
 +
<br>
 +
三种插件所支持的Qt特性会有所不同，请根据你的需求来选择: <br>
 +
::{| class="wikitable"
 +
|-
 +
  | 插件名称
 +
  | OpenGL ES
 +
  | QtWebEngine
 +
  | QtMultimedia
 +
  | 视频硬解播放
 +
  | 双屏异显
 +
|-
 +
  | KMS
 +
  | <b>Yes</b>
 +
  | No
 +
  | <b>Yes</b>
 +
  | No
 +
  | <b>Yes</b>
 +
|-
 +
  | EGLFS
 +
  | <b>Yes</b>
 +
  | No
 +
  | <b>Yes</b>
 +
  | No
 +
  | No
 +
|-
 +
  | XCB
 +
  | <b>Yes</b>
 +
  | <b>Yes</b>
 +
  | <b>Yes</b>
 +
  | <b>Yes</b>
 +
  | <b>Yes</b>
 +
|}
 +
<b>建议使用 KMS或XCB 插件。</b><br><br>
 +
为了方便用户测试，FriendlyCore平台提供了4个脚本文件用于设置Qt环境变量，分别为：
 +
::{| class="wikitable"
 +
|-
 +
|脚本文件名||作用
 +
|-
 +
|/usr/bin/setqt5env-kms||设置kms插件所需要的环境变量
 +
|-
 +
|/usr/bin/setqt5env-eglfs||设置eglfs插件所需要的环境变量 
 +
|-
 +
|/usr/bin/setqt5env-xcb||设置xcb插件所需要的环境变量
 +
|-
 +
|/usr/bin/setqt5env-nogui||仅供无界面的Qt程序使用
 +
|}
 +
例如要设置用KMS插件来显示程序界面，可以使用以下命令：
 +
<syntaxhighlight lang="bash">
 +
. setqt5env-kms
 +
./apps
 +
</syntaxhighlight>
 +
（注: .与字母s之间有个空格）
 +
 
 
====Qt开发环境搭建====
 
====Qt开发环境搭建====
−
需要为RK3399开发Qt应用，需要使用 Ubuntu 18.04 64位系统作为交叉编译平台，也可以使用 Docker 环境，
+
FriendlyELEC为RK3399平台提供了两种交叉编译Qt程序的方法：
−
* Docker环境可以参考： http://github.com/friendlyarm/friendlyelec-ubuntu18-docker
+
* 方法1：使用Docker容器，详细可参考github页面：http://github.com/friendlyarm/friendlyelec-ubuntu18-docker
−
* 本地交叉编译环境搭建请参考: [[How to Build and Install Qt Application for FriendlyELEC Boards/zh]]<br>
+
* 方法2: 搭建本地交叉编译环境，本地需要安装 Ubuntu 18.04 64位系统，其环境搭建方法请参考：[[How to Build and Install Qt Application for FriendlyELEC Boards/zh]]
 +
 
 +
====Qt示例演示====
 +
FriendlyCore系统内置了几个很有特色的Qt演示程序，方便测试Qt5的特性，下面分别介绍它们：
 +
====Qt Quick示例：CinematicExperience====
 +
<br />
 +
Qt Quick 是 Qt 提供的一种高级用户界面技术，使用它可轻松地为移动和嵌入式设备创建流畅的用户界面。Qt Quick 应用默认使用 OpenGL ES ，渲染效率很高，你可以用它创建非常炫非常酷非常迷人的界面。<br />
 +
CinematicExperience是一个用Qt Quick实现的影片选择界面。<br />
 +
该例子使用了Qt QML中的界面动态转换、粒子模拟和着色器特效，所以这个示例能体现RK3399的硬件性能与软件优化，在RK3399平台上非常流畅。<br />
 +
在命令行执行以下命令启动该示例：<br />
 +
<syntaxhighlight lang="bash">
 +
cd /opt/Qt5_CinematicExperience
 +
./run.sh
 +
</syntaxhighlight>
 +
界面如下所示：<br />
 +
<!-- Cinematicsexperience.jpg -->
 +
[[File:qt5-cinematicExperience.gif|frameless|480px]]<br />
 +
 
 +
====Qt WebEngine示例：网页浏览器====
 +
Qt WebEngine使用了Chromium作为渲染引挚，对HTML5支持完美。<br />
 +
示例展示的网页浏览器是 Qt5 自带的Demo，运行命令如下：<br />
 +
<syntaxhighlight lang="bash">
 +
cd /opt/qt5-brower
 +
./run.sh
 +
</syntaxhighlight>
 +
 
 +
界面如下所示：<br />
 +
[[File:qt5-brower.jpg|frameless|480px]]<br />
 +
 
 +
注：Qt WebEngine在FriendlyCore平台上需要使用Xcb插件来运行。
 +
 
 +
====Qt 双屏异显示例====
 +
这是一个比较简单的DEMO，演示了在同时连接HDMI和eDP LCD屏的情况下，用Qt实现两个屏幕显示不同的内容, 用以下命令启动：
 +
<syntaxhighlight lang="bash">
 +
cd /opt/qt5-multi-screen-demo
 +
./run.sh
 +
</syntaxhighlight>
 +
双屏异显的效果如下所示：<br />
 +
[[File:qt5-multi-screen.jpg|frameless|480px]]<br />
 +
 
 +
====Qt Multimedia: 硬解播放器qt5-player====
 +
qt5-player播放器已经适配Rockchip的gstreamer插件，支持4K视频的硬解播放。<br />
 +
在命令行执行以下命令启动该示例：<br />
 +
<syntaxhighlight lang="bash">
 +
cd /opt/qt5-player
 +
./run.sh
 +
</syntaxhighlight>
 +
播放器的界面如下所示，可以设置全屏播放，也可以调节音量：<br />
 +
[[File:qt5-player.gif|frameless|480px]]<br />
 +
 
 +
====Qt WebGL示例: nmapper====
 +
Qt WebGL允许你在其他设备的网页游览器查看并远程操作运行在开发板上的Qt程序，这个特性使得实现远程控制变得简单。<br />
 +
在运行示例之前，你的开发板需要先连接网络，然后在开发版本执行以下命令：<br />
 +
<syntaxhighlight lang="bash">
 +
cd /opt/qt5-nmapper
 +
./run-with-webgl.sh
 +
</syntaxhighlight>
 +
然后在电脑或者手机上打开网页游览器，在浏览器的地址栏输入开发板的IP地址，应该就能看到Qt界面了，效果如下所示：<br />
 +
[[File:qtwebgl.gif|frameless|480px]]<br />
 +
 
 +
====Qt VNC示例: 智能家居控制界面====
 +
Qt VNC允许你将一个应用程序以VNC Server的形式运行，在其他设备上可以使用VNC Client来连接和控制，用QtWidgets或者QML编写的应用都是支持的。<br />
 +
执行以下命令启动：<br />
 +
<syntaxhighlight lang="bash">
 +
cd /opt/qt5-smarthome
 +
./run-with-vnc.sh
 +
</syntaxhighlight>
 +
然后在电脑或者手机上安装并打开VNC viewer软件，输入开发板的IP地址加端口号5900，例如开发板的地址是192.168.1.100，就输入192.168.1.100:5900，连接后应该就能看到界面了，如下图所示：<br />
 +
[[File:qt5smarthomevnc.png|frameless|600px]]<br />
 +
 
 +
====Qt 双USB摄像头示例====
 +
本示例演示同时预览两个USB摄像头的图像，请在运行示例之前，先连接好两个USB摄像头和屏幕，一般来说标准的UVC摄像头都可以，不过还是建议使用以下我们测试过的型号：<br />
 +
::{| class="wikitable"
 +
|-
 +
|序号||型号     
 +
|-
 +
|1  ||  KS2A242 
 +
|-
 +
|2  ||  罗技C922 Pro
 +
|}
 +
执行以下命令启动：<br />
 +
<syntaxhighlight lang="bash">
 +
cd /opt/dual-camera
 +
./run.sh
 +
</syntaxhighlight>
 +
运行界面以及所使用的摄像头如下图所示：<br />
 +
[[File:qt5dualcamera.jpg|frameless|480px]]<br />

Latest revision as of 07:00, 18 January 2020

1 开发Qt程序

FriendlyELEC为RK3399平台移植的 Qt 5.10.0 支持以下显示设备插件：KMS、EGLFS和XCB，这三种插件均支持OpenGL ES和GPU硬件加速，只是调用方式不同，具体如下：

  • KMS – 使用Linux内核的DRM显示接口来渲染界面
  • EGLFS – 使用OpenGL ES接口来渲染界面
  • XCB – 在X11服务器上运行，并集成到X11窗口环境


三种插件所支持的Qt特性会有所不同，请根据你的需求来选择:

插件名称 OpenGL ES QtWebEngine QtMultimedia 视频硬解播放 双屏异显
KMS Yes No Yes No Yes
EGLFS Yes No Yes No No
XCB Yes Yes Yes Yes Yes

建议使用 KMS或XCB 插件。

为了方便用户测试，FriendlyCore平台提供了4个脚本文件用于设置Qt环境变量，分别为：

脚本文件名 作用
/usr/bin/setqt5env-kms 设置kms插件所需要的环境变量
/usr/bin/setqt5env-eglfs 设置eglfs插件所需要的环境变量
/usr/bin/setqt5env-xcb 设置xcb插件所需要的环境变量
/usr/bin/setqt5env-nogui 仅供无界面的Qt程序使用

例如要设置用KMS插件来显示程序界面，可以使用以下命令： 

. setqt5env-kms
./apps

（注: .与字母s之间有个空格）

1.1 Qt开发环境搭建

FriendlyELEC为RK3399平台提供了两种交叉编译Qt程序的方法：

1.2 Qt示例演示

FriendlyCore系统内置了几个很有特色的Qt演示程序，方便测试Qt5的特性，下面分别介绍它们：

1.3 Qt Quick示例：CinematicExperience


Qt Quick 是 Qt 提供的一种高级用户界面技术，使用它可轻松地为移动和嵌入式设备创建流畅的用户界面。Qt Quick 应用默认使用 OpenGL ES ，渲染效率很高，你可以用它创建非常炫非常酷非常迷人的界面。
CinematicExperience是一个用Qt Quick实现的影片选择界面。
该例子使用了Qt QML中的界面动态转换、粒子模拟和着色器特效，所以这个示例能体现RK3399的硬件性能与软件优化，在RK3399平台上非常流畅。
在命令行执行以下命令启动该示例：

cd /opt/Qt5_CinematicExperience
./run.sh

界面如下所示：
Qt5-cinematicExperience.gif

1.4 Qt WebEngine示例：网页浏览器

Qt WebEngine使用了Chromium作为渲染引挚，对HTML5支持完美。
示例展示的网页浏览器是 Qt5 自带的Demo，运行命令如下：

cd /opt/qt5-brower
./run.sh

界面如下所示：
Qt5-brower.jpg

注：Qt WebEngine在FriendlyCore平台上需要使用Xcb插件来运行。

1.5 Qt 双屏异显示例

这是一个比较简单的DEMO，演示了在同时连接HDMI和eDP LCD屏的情况下，用Qt实现两个屏幕显示不同的内容, 用以下命令启动： 

cd /opt/qt5-multi-screen-demo
./run.sh

双屏异显的效果如下所示：
Qt5-multi-screen.jpg

1.6 Qt Multimedia: 硬解播放器qt5-player

qt5-player播放器已经适配Rockchip的gstreamer插件，支持4K视频的硬解播放。
在命令行执行以下命令启动该示例：

cd /opt/qt5-player
./run.sh

播放器的界面如下所示，可以设置全屏播放，也可以调节音量：
Qt5-player.gif

1.7 Qt WebGL示例: nmapper

Qt WebGL允许你在其他设备的网页游览器查看并远程操作运行在开发板上的Qt程序，这个特性使得实现远程控制变得简单。
在运行示例之前，你的开发板需要先连接网络，然后在开发版本执行以下命令：

cd /opt/qt5-nmapper
./run-with-webgl.sh

然后在电脑或者手机上打开网页游览器，在浏览器的地址栏输入开发板的IP地址，应该就能看到Qt界面了，效果如下所示：
Qtwebgl.gif

1.8 Qt VNC示例: 智能家居控制界面

Qt VNC允许你将一个应用程序以VNC Server的形式运行，在其他设备上可以使用VNC Client来连接和控制，用QtWidgets或者QML编写的应用都是支持的。
执行以下命令启动：

cd /opt/qt5-smarthome
./run-with-vnc.sh

然后在电脑或者手机上安装并打开VNC viewer软件，输入开发板的IP地址加端口号5900，例如开发板的地址是192.168.1.100，就输入192.168.1.100:5900，连接后应该就能看到界面了，如下图所示：
Qt5smarthomevnc.png

1.9 Qt 双USB摄像头示例

本示例演示同时预览两个USB摄像头的图像，请在运行示例之前，先连接好两个USB摄像头和屏幕，一般来说标准的UVC摄像头都可以，不过还是建议使用以下我们测试过的型号：

序号 型号
1 KS2A242
2 罗技C922 Pro

执行以下命令启动：

cd /opt/dual-camera
./run.sh

运行界面以及所使用的摄像头如下图所示：
Qt5dualcamera.jpg

Retrieved from "https://wiki.friendlyelec.com/wiki/index.php?title=Template:FriendlyCoreRK3399QtDev/zh&oldid=21052"