嵌入式Linux基于QML开发QtMultimedia应用

ByToradex秦海

1). 简介

使用QML语言进行QT应用程序开发可以将界面开发和逻辑控制分开,提高应用的开发周期和灵活性;另外对于多媒体应用非常重要的一点是,基于QML/QT Quick 的应用程序可以直接调用GPU进行加速,这大大提高了多媒体应用在嵌入式系统环境下的处理效率和资源占用,因此本文就基于QML和QT Multimedia组件介绍多媒体应用开发。

本文所演示的平台来自于Toradex Apalis iMX6 ARM嵌入式平台,这是一个基于NXP iMX6ARM处理器,支持双核/四核Cortex-A9。


2. 准备

a). ApalisiMX6 ARM核心版配合Ixora载板,连接调试串口UART1到开发主机方便调试。


b). Apalis iMX6系统使用基于OpenEmbedded框架重新编译的集成Qt5.9支持的ToradexLinux image release V2.8b2 版本以及对应的SDK。可以结合这里的说明自行编译,需要修改的local.conf 文件如下,image更新方法请参考这里

-------------------------------

IMAGE_INSTALL_append = "gstreamer1.0-plugins-bad-* gstreamer1.0-plugins-ugly-* gstreamer1.0-libav"

PACKAGECONFIG_append_pn-qtmultimedia =" gstreamer"

-------------------------------


c). 关于开发主机SDK安装和Qt creator开发环境的配置请参考这里


d). 演示程序使用的LCD为10inch 18bitLVDS屏幕,请参考这里修改配置uboot显示分辨率。


e). 如果需要,可以打开QT debuglogging

./ 打开所有 debug logging

-------------------------------

$ export QT_LOGGING_RULES=*.debug=true

-------------------------------

./ 打开 multimedia 相关debuglogging

-------------------------------

$ export QT_LOGGING_RULES=*.debug=true

-------------------------------


f). 本文演示应用程序分为两个部分,对应为两个页面;应用启动后默认页面为视频播放(Video Player)页面,通过点击按钮可以切换为摄像头捕获页面(Camera Capture)页面。下面就逐一进行一些说明。


3). QT演示程序开发 – Video Player


a). 源代码和运行效果如下:

./ 代码

main.qml - https://github.com/simonqin09/QtQMLMultimedia/blob/master/main.qml

main.cpp - https://github.com/simonqin09/QtQMLMultimedia/blob/master/main.cpp


b). 具体要点说明如下

./ 由于QT Multimedia组件在底层也是调用GstreamerPlaybin元件进行媒体播放操作,因此在编程之前,首先可以直接使用Gstreamer pipeline在嵌入式系统先验证下,确保媒体可以正常播放,没有解码器缺失的情况。

-------------------------------

$ gst-launch-1.0 playbin uri=file:///home/root/ready-player-one-trailer-2_h720p.mov

-------------------------------


./ main.cpp 文件用于识别输入变量并通过下面代码将其传递给QML来指定媒体文件位置。

-------------------------------

QQmlApplicationEngine engine;

engine.rootContext()->setContextProperty("mysource",source);

-------------------------------


./ main.qml 文件用于实现video player界面以及媒体播放。

  • 媒体播放主要由 ”Mediaplayer”元素和 ”VideoOutput” 元素来配合实现。然后将其显示在定义好的640x480分辨率的rectangle中。
  • 定义了一些控制播放和音量的按键,当点击时候会有颜色的变化指示。
  • 使用了 Connections 用于信号触发操作,这里对应为当发现媒体播放停止的时候自动将 Play 按键的颜色变更为初始状态。
  • 在页面切换按键处,使用了loader功能来加载 Camera Capture 页面,需要注意的是同时也需要在main.qml 中创建一个 CameraMode.qml 的实例以便于操作。

   -------------------------------

    CameraMode {

               id: cameramode1

               anchors.fill: parent

               z: 1

           }

   -------------------------------



4). QT演示程序开发 – Camera Capture

a). 源代码和运行效果如下:

./ 代码

CameraMode.qml - https://github.com/simonqin09/QtQMLMultimedia/blob/master/CameraMode.qml


b). 具体要点说明如下

./ QML文件首先通过Item和Component组合,并通过定义函数show 来加载Component 也就是Camera Capture主页面。这里为了控制CameraMode.qml不在程序一启动就自动加载,增加了一个从main.qml传递过来的变量 camera_mode_visible。

./ 摄像头的capture功能由 Camera 元素和Videooutput 元素配合实现,同样将camera capture画面显示到预定义好的 640x480 分辨率的 rectangle 中。

./ 使用 ListView 来显示目前系统所连接的所有可用camera id,当点击时候实现camera id的切换以及重点显示。

./ 定义了 start 和 stop 按键,用于开始和停止所选定camera id的图像捕获。

./ 定义截图按键,通过 Camera 元素里面的 imageCapture属性实现将所保存的图片显示在图像捕获窗口的下方区域。

./ 定义了 pagedestroy 函数,用于从当前页面返回video player 页面。



5). 程序部署配置

a). 将编译好的可执行程序 “videotest”和所需要的视频文件“ready-player-one-trailer-2_h720p.mov” 复制到ApalisiMX6模块“/home/root” 目录下。


b). 配置程序开机自启动

./ 修改 /usr/bin/x-window-manager文件为如下

-------------------------------

RET=1

while [ $RET -ne 0 ]; do

        cd/home/root

       /home/root/videotest -urlfile:///home/root/ready-player-one-trailer-2_h720p.mov

       RET=$?

done

-------------------------------



6). 程序运行演示

a). 开机后,系统自动启动程序,如下所示

./ video player


./ camera capture

系统上面一共连接了两个摄像头,第一个目前正在cpature的是MIPI CSI OV5640 摄像头模块,第二个是一个Logitech 720P USB 摄像头。


b). CPU占用率,通过 top 命令查看

./ video player 播放视频状态,约为20% 左右。

-------------------------------

PID USER      PR  NI    VIRT    RES    SHR S  %CPU %MEM     TIME+ COMMAND                                                                          

 640 root      20   0  384796  45628  34032 S  19.8  4.4   2:15.30 videotest                                                                        

 554 root     19  -1  174652  12404   8684 S   3.3  1.2   0:20.38 Xorg                                                                             

 678 root     20   0    4796   2352   1920 R   1.2  0.2  0:00.19 top

-------------------------------

./ camera capture 开始捕获图像状态,约为21% 左右。

-------------------------------

  PID USER      PR  NI    VIRT    RES    SHR S  %CPU %MEM     TIME+ COMMAND                                                                          

 640 root      20   0  435508  45092  34012 S  21.6  4.4   1:46.03 videotest                                                                        

 554 root     19  -1  174652  12404   8684 S   3.3  1.2   0:16.26 Xorg                                                                             

 676 root     20   0    4796   2368   1936 R   1.5  0.2  0:01.80 top

-------------------------------



6). 总结

本文基于NXP iMX6嵌入式平台在嵌入式linux系统下测试基于QML和QT Multimedia的多媒体应用,通过代码说明和程序运行结果可见,QML和QT multimedia的结合确实可以快速高效的构建一个界面化的多媒体应用,同时得益于QML的GPU加速以及针对NXP iMX系列的对应加速优化,其执行效率也非常之高。当然,在进行开发过程中也发现了一些问题,比如不够灵活,不能像直接使用Gstreamer框架一样自行定义pipeline元件,另外QML和C++的配合也需要一些学习和经验才能灵活掌握,因此具体采用哪种方式还是要根据实际需要来决定。

发布了97 篇原创文章 · 获赞 35 · 访问量 25万+
展开阅读全文

Qt creator用QMultimedia做视频播放器没图像

07-15

如题,我从网上参考了相关教程自己写了一个(原码在最后),是在Deepin环境下,编译是没错的,结果运行时弹出的窗口是全黑的,视频播放不出来,但奇怪的是有声音,即使把窗口关了也还有声音。如果我换到windows环境下,把相关的库和文件都改成windows的,也是没有报错,但直接连黑窗口都弹不出来了。我用的Qt5.9.1,创建工程时用的是QWidget基类(用其他的没写出来)。在百度上找了很长时间,说是没有gstreamer0.10-ffmpeg解码器,我试过了,这个解码器根本就下载不了。截图如下: ![图片说明](https://img-ask.csdn.net/upload/201707/15/1500129864_271640.png) 关于安装这个解码器的问题,百度说直接从官网上找安装包手动下载,我把好多安装包下载完了,结果都提示不能安装:![图片说明](https://img-ask.csdn.net/upload/201707/15/1500130132_477133.png) 又有说是源的问题,我从网上找了好多源,然后挨个换,都不能安装。还有说系统要升级到最新,可是我也升级了啊,也没什么用。不想放弃,希望得到指点,如果能得到任何帮助,我将不胜感激。 原码如下: ![图片说明](https://img-ask.csdn.net/upload/201707/15/1500130526_572704.png) ![图片说明](https://img-ask.csdn.net/upload/201707/15/1500130595_767762.png) ![图片说明](https://img-ask.csdn.net/upload/201707/15/1500130636_716614.png) ![图片说明](https://img-ask.csdn.net/upload/201707/15/1500130685_741237.png) 那个player.ui我只是画了一些按钮,没有去实现,因为在播放这块儿卡住了。 这是.pro文件: #------------------------------------------------- # # Project created by QtCreator 2017-07-15T09:24:24 # #------------------------------------------------- QT += core gui\ multimedia\ multimediawidgets greaterThan(QT_MAJOR_VERSION, 4): QT += widgets TARGET = test5 TEMPLATE = app # The following define makes your compiler emit warnings if you use # any feature of Qt which as been marked as deprecated (the exact warnings # depend on your compiler). Please consult the documentation of the # deprecated API in order to know how to port your code away from it. DEFINES += QT_DEPRECATED_WARNINGS # You can also make your code fail to compile if you use deprecated APIs. # In order to do so, uncomment the following line. # You can also select to disable deprecated APIs only up to a certain version of Qt. #DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000 # disables all the APIs deprecated before Qt 6.0.0 SOURCES += \ main.cpp \ player.cpp HEADERS += \ player.h FORMS += \ player.ui ```这是头文件player.h: #ifndef PLAYER_H #define PLAYER_H #include <QWidget> #include <QMediaPlayer> #include <QVideoWidget> namespace Ui { class Player; } class Player : public QWidget { Q_OBJECT public: explicit Player(QWidget *parent = 0); ~Player(); private: Ui::Player *ui; QVideoWidget *videow; QMediaPlayer *player; }; #endif // PLAYER_H ```这是main.cpp: #include "player.h" #include <QApplication> int main(int argc, char *argv[]) { QApplication a(argc, argv); Player w; w.show(); return a.exec(); } ```这是player.cpp: #include "player.h" #include "ui_player.h" Player::Player(QWidget *parent) : QWidget(parent), ui(new Ui::Player) { ui->setupUi(this); videow = new QVideoWidget(); player = new QMediaPlayer(); player->setVideoOutput(videow); player->setMedia(QUrl::fromLocalFile(QStringLiteral("/home/joe/Videos/U6-1.mpg"))); videow->show(); player->play(); } Player::~Player() { delete ui; } ``` 问答

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 编程工作室 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览