Qml 中实现对原始视频图像格式( YUV / RGB )支持

2024-06-03 20:58

本文主要是介绍Qml 中实现对原始视频图像格式( YUV / RGB )支持,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

【写在前面】

        之前一直在学着视频相关的知识,然后工作也正好是监控相关的。

        并且界面部分用 Qml 开发的 ( 相当舒服,是我擅长且喜欢的 )。

        一开始,我觉得相当容易,只是显示解码好的图像而已,没什么难度。

        记得前面写过一篇在 Qml 中使用 QImage:Qml中实现多视图,多图像源(QImage / QPixmap)_梦起丶的博客-CSDN博客。

        然后通过使用 QQmlImageProvider 来对 QImage / QPixmap / QQuickTextureFactory 实现支持。

        实际上,QImage 支持绝大多数 RGB 格式,所以即便是 YUV 格式,也可以通过转换为 RGB 来实现,然而转换所带来的性能损失也是必须考虑的。

        另一方面, QQuickTextureFactory 是其中最强大的,但遗憾的是没有任何相关的资料 ( 就很烦,因为很明显,这个就是我所需要的,以后会尝试 )。

        并且,使用 QQmlImageProvider 导致底层设计比较丑陋,所以我还是舍弃了这个方法。

        最终,我的方案是使用 Qt MutiMedia 模块中的 QAbstractVideoSurface VideoOutput 来完成。

        本篇主要内容:

        1、QML 中的 VideoOutput: source;

        2、如何使用 YUV 数据创建 QVideoFrame

        3、在 VideoOutput 上呈现视频帧;


【正文开始】

        先来看看效果图:

        其中,视频源来自一张 YUV 图像 ( 这里是 NV12 ),然后定时变化来模拟视频效果:

    //读入一张yuv图像QFile file("./test.yuv");file.open(QIODevice::ReadOnly);QByteArray data = file.readAll();d->m_testData.resize(data.size());memcpy(d->m_testData.data(), data.constData(), size_t(data.size()));file.close();

        首先,说明一下 VideoOutput: source 属性

source: Variant

此属性保存提供视频帧( 例如 MediaPlayer 或 Camera )的源项目。

如果要扩展自己的 C++ 类以与 VideoOutput 互操作,则可以为基于 QObject 的类提供 mediaObject 属性,该属性公开具有可用 QVideoRendererControl 的 QMediaObject 派生类

也可以为基于 QObject 的类提供可写 videoSurface 属性可以接受基于 QAbstractVideoSurface 的类,并且可以遵循正确的协议将 QVideoFrame 传递给它

        可以看出,在 VideoOutput 中,想要使用自己的视频源,有两种方法:

        1、提供 QMediaObject 派生类属性,该属性需要具有可用的 QVideoRenderControl ,类似于下面:

class MyMedia : QObject {

public:

      QMediaObject *mediaObject();

};

        其中,Qt 本身已经实现了一些 QMediaObject 派生类,例如:QAudioDecoder, QCamera, QMediaPlayer, 和 QRadioTuner,因此,这些类能够直接提供给 VideoOutput: source

        2、基于 QObject 的类提供可写 videoSurface 属性,可以接受基于 QAbstractVideoSurface 的类,然后传递自己的 QVideoFrame 即可,这也正是本篇所使用的方法:

#ifndef VIDEOFRAMEPROVIDER_H
#define VIDEOFRAMEPROVIDER_H#include <QObject>
#include <QAbstractVideoSurface>
#include <QVideoSurfaceFormat>QT_FORWARD_DECLARE_CLASS(VideoFrameProviderPrivate);class VideoFrameProvider : public QObject
{Q_OBJECTQ_PROPERTY(QAbstractVideoSurface *videoSurface READ videoSurface WRITE setVideoSurface)Q_PROPERTY(QString videoUrl READ videoUrl WRITE setVideoUrl NOTIFY videoUrlChanged)public:VideoFrameProvider(QObject *parent = nullptr);~VideoFrameProvider();QAbstractVideoSurface *videoSurface();void setVideoSurface(QAbstractVideoSurface *surface);QString videoUrl() const;void setVideoUrl(const QString &url);void setFormat(int width, int heigth, QVideoFrame::PixelFormat pixFormat);signals:/*** @brief newVideoFrame 有新的视频帧* @param frame 视频帧*/void newVideoFrame(const QVideoFrame &frame);void videoUrlChanged();public slots:void onNewVideoFrameReceived(const QVideoFrame &frame);private:VideoFrameProviderPrivate *d = nullptr;
};#endif // VIDEOFRAMEPROVIDER_H

        全部实现如下: 

#include "videoframeprovider.h"#include <QFile>
#include <QFileInfo>
#include <QSharedPointer>
#include <QTimer>class VideoFrameProviderPrivate
{
public:QAbstractVideoSurface *m_surface = nullptr;QVideoSurfaceFormat m_format;QString m_videoUrl;QSharedPointer<QVideoFrame> m_frame = nullptr;/*** 以下代码仅供示例使用* 实际上,此处应放你的视频源,它可以来自你自己的解码器*/QVector<char> m_testData;QTimer *m_testTimer = nullptr;
};VideoFrameProvider::VideoFrameProvider(QObject *parent): QObject(parent)
{d = new VideoFrameProviderPrivate;int width = 1280;int height = 720;int size = width * height * 3 / 2;setFormat(width, height, QVideoFrame::Format_NV12);d->m_frame.reset(new QVideoFrame(size, QSize(width, height), width, QVideoFrame::Format_NV12));d->m_testTimer = new QTimer(this);//读入一张yuv图像QFile file("./test.yuv");file.open(QIODevice::ReadOnly);QByteArray data = file.readAll();d->m_testData.resize(data.size());memcpy(d->m_testData.data(), data.constData(), size_t(data.size()));file.close();connect(d->m_testTimer, &QTimer::timeout, this, [=]{static int count = 0;//简单变化一下,模拟视频帧if (++count & 0x1) {for (auto &it : d->m_testData) {it *= 0.5;}} else {for (auto &it : d->m_testData) {it *= 2.0;}}if (d->m_frame->map(QAbstractVideoBuffer::WriteOnly)) {memcpy(d->m_frame->bits(), d->m_testData.data(), size_t(d->m_testData.size()));d->m_frame->unmap();emit newVideoFrame(*d->m_frame.get());};});connect(this, &VideoFrameProvider::newVideoFrame, this, &VideoFrameProvider::onNewVideoFrameReceived);d->m_testTimer->start(200);
}VideoFrameProvider::~VideoFrameProvider()
{if (d) delete d;
}QAbstractVideoSurface *VideoFrameProvider::videoSurface()
{return d->m_surface;
}void VideoFrameProvider::setVideoSurface(QAbstractVideoSurface *surface)
{if (d->m_surface && d->m_surface != surface && d->m_surface->isActive()) {d->m_surface->stop();}d->m_surface = surface;if (d->m_surface && d->m_format.isValid()) {d->m_format = d->m_surface->nearestFormat(d->m_format);d->m_surface->start(d->m_format);}
}QString VideoFrameProvider::videoUrl() const
{return d->m_videoUrl;
}void VideoFrameProvider::setVideoUrl(const QString &url)
{if (d->m_videoUrl != url) {d->m_videoUrl = url;emit videoUrlChanged();}
}void VideoFrameProvider::setFormat(int width, int heigth, QVideoFrame::PixelFormat pixFormat)
{QVideoSurfaceFormat format(QSize(width, heigth), pixFormat);d->m_format = format;if (d->m_surface) {if (d->m_surface->isActive()) {d->m_surface->stop();}d->m_format = d->m_surface->nearestFormat(format);d->m_surface->start(d->m_format);}
}void VideoFrameProvider::onNewVideoFrameReceived(const QVideoFrame &frame)
{if (d->m_surface)d->m_surface->present(frame);
}

        实际上,关键的地方在于能够提供正确的 QVideoFrame,并设置正确的 Format

        而 QVideoFrame 支持的格式相当多,例如 NV12NV21YUYV 等等,然后使用 QAbstractVideoSurface::present(const QVideoFrame &frame) 传递给 VideoOutput 即可呈现。

        另外需要注意的一点的是 QVideoFrame 的数据填充方式:

    if (d->m_frame->map(QAbstractVideoBuffer::WriteOnly)) {memcpy(d->m_frame->bits(), d->m_testData.data(), size_t(d->m_testData.size()));d->m_frame->unmap();emit newVideoFrame(*d->m_frame.get());};

        最后的使用就相当简单了:

import QtQuick 2.12
import QtQuick.Window 2.12
import QtMultimedia 5.8
import an.video 1.0Window {visible: truewidth: 640height: 480title: qsTr("VideoOutput")VideoFrameProvider {id: providervideoUrl: "rtsp://xxx.xxx.xxx/channel=1"}VideoOutput {anchors.fill: parentsource: provider}
}

        videoUrl 则是为了实现多路流视频的播放,这样在 QML 中相当简单和直观。


【结语】

        呼~总算写完了,我的 VideoFrameProvider 实现已经非常不错了。

        当然,如果要自己使用的话,只需把提供数据的部分改下即可。

        最后,附上项目链接(多多star呀..⭐_⭐):

        CSDN的:Qml中实现对原始视频图像格式(YUV/RGB)支持_VideoFrameProvider-C++文档类资源-CSDN下载

        Github的:GitHub - mengps/QmlControls: Qt / Qml 控件

这篇关于Qml 中实现对原始视频图像格式( YUV / RGB )支持的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1028091

相关文章

windos server2022里的DFS配置的实现

《windosserver2022里的DFS配置的实现》DFS是WindowsServer操作系统提供的一种功能,用于在多台服务器上集中管理共享文件夹和文件的分布式存储解决方案,本文就来介绍一下wi... 目录什么是DFS?优势:应用场景:DFS配置步骤什么是DFS?DFS指的是分布式文件系统(Distr

NFS实现多服务器文件的共享的方法步骤

《NFS实现多服务器文件的共享的方法步骤》NFS允许网络中的计算机之间共享资源,客户端可以透明地读写远端NFS服务器上的文件,本文就来介绍一下NFS实现多服务器文件的共享的方法步骤,感兴趣的可以了解一... 目录一、简介二、部署1、准备1、服务端和客户端:安装nfs-utils2、服务端:创建共享目录3、服

C#使用yield关键字实现提升迭代性能与效率

《C#使用yield关键字实现提升迭代性能与效率》yield关键字在C#中简化了数据迭代的方式,实现了按需生成数据,自动维护迭代状态,本文主要来聊聊如何使用yield关键字实现提升迭代性能与效率,感兴... 目录前言传统迭代和yield迭代方式对比yield延迟加载按需获取数据yield break显式示迭

Python实现高效地读写大型文件

《Python实现高效地读写大型文件》Python如何读写的是大型文件,有没有什么方法来提高效率呢,这篇文章就来和大家聊聊如何在Python中高效地读写大型文件,需要的可以了解下... 目录一、逐行读取大型文件二、分块读取大型文件三、使用 mmap 模块进行内存映射文件操作(适用于大文件)四、使用 pand

python实现pdf转word和excel的示例代码

《python实现pdf转word和excel的示例代码》本文主要介绍了python实现pdf转word和excel的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价... 目录一、引言二、python编程1,PDF转Word2,PDF转Excel三、前端页面效果展示总结一

Python xmltodict实现简化XML数据处理

《Pythonxmltodict实现简化XML数据处理》Python社区为提供了xmltodict库,它专为简化XML与Python数据结构的转换而设计,本文主要来为大家介绍一下如何使用xmltod... 目录一、引言二、XMLtodict介绍设计理念适用场景三、功能参数与属性1、parse函数2、unpa

C#实现获得某个枚举的所有名称

《C#实现获得某个枚举的所有名称》这篇文章主要为大家详细介绍了C#如何实现获得某个枚举的所有名称,文中的示例代码讲解详细,具有一定的借鉴价值,有需要的小伙伴可以参考一下... C#中获得某个枚举的所有名称using System;using System.Collections.Generic;usi

Go语言实现将中文转化为拼音功能

《Go语言实现将中文转化为拼音功能》这篇文章主要为大家详细介绍了Go语言中如何实现将中文转化为拼音功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 有这么一个需求:新用户入职 创建一系列账号比较麻烦,打算通过接口传入姓名进行初始化。想把姓名转化成拼音。因为有些账号即需要中文也需要英

C# 读写ini文件操作实现

《C#读写ini文件操作实现》本文主要介绍了C#读写ini文件操作实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧... 目录一、INI文件结构二、读取INI文件中的数据在C#应用程序中,常将INI文件作为配置文件,用于存储应用程序的

C#实现获取电脑中的端口号和硬件信息

《C#实现获取电脑中的端口号和硬件信息》这篇文章主要为大家详细介绍了C#实现获取电脑中的端口号和硬件信息的相关方法,文中的示例代码讲解详细,有需要的小伙伴可以参考一下... 我们经常在使用一个串口软件的时候,发现软件中的端口号并不是普通的COM1,而是带有硬件信息的。那么如果我们使用C#编写软件时候,如