qml如何使用opengl渲染视频流？

原创已于 2024-12-29 00:00:40 修改 · 1.5k 阅读

5 ·

CC 4.0 BY-SA版权

知识因分享而具有价值，回忆昨天，把握今天，期待明天。 —— 驭鲸·环球

文章标签：

#qml #opengl #qt

于 2022-01-05 20:28:34 首次发布

QML 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一种通过继承QQuickFramebufferObject并利用OpenGL在QML中渲染视频流的方法，提供了一个方便集成的组件。只需将视频流连接到newData槽函数。虽然Qt文档警告此方法可能不适用于非OpenGL的RHI后端，但作者认为OpenSceneGraph（OSG）可能是更好的选择。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

仓库地址：https://gitee.com/yujinghuanqiu/qmlvideoitem

通过继承 QQuickFramebufferObject 方式，实现了一个使用 opengl 渲染视频流的 qml 组件。

视频流直接连接 newData 槽函数即可。

仅需要头文件和源文件，方便集成使用。

个人觉得还是使用 OSG 的方式会更好些，qt QQuickFramebufferObject 文档中有下面这段话仅供参考。

Warning: This class is only functional when Qt Quick is rendering via OpenGL, either directly or through the RHI-based rendering path. It is not compatible with other RHI backends, such as, Vulkan or Metal.

class MyVideo : public QQuickFramebufferObject
{
    Q_OBJECT
public:
    explicit MyVideo(QQuickItem *parent = nullptr);
    virtual QQuickFramebufferObject::Renderer *createRenderer() const override;
    QSharedPointer<Context> context();
signals:

public slots:
    // 从文件加载图像
    void newData(const QString &filename);
    // 从内存加载图像
    void newData(const QImage &image);
private:
    QSharedPointer<Context> m_ctx;
};

qml 测试一张图片的显示。

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQml 2.12
import SceneGraphRender 1.0

Window {
    width: 640
    height: 480
    visible: true
    title: qsTr("QMLVideoItem")
    color: "#f0f0f0"
    MyVideoItem {
        anchors.fill: parent
        Component.onCompleted: {
            newData(":/desktop.png");
        }
    }
}