使用QT的QML实时显示海康威视网络摄像头的视频数据

需求背景:
开发的监控软件中有个监控页面需要实时显示网络摄像头的数据,整个监控软件是基于QT的QML语言开发的。在QML中播放视频使用MediaPlayer组件就可以,但网上看到的一些都是播放录制好的视频文件,对于实时播放摄像头数据介绍的比较少。

开发环境:
Debian11.3
Qt 5.15

海康威视网络摄像机视频流地址
若要从网络摄像头实时获取数据,需要知道摄像头的视频流地址,仅此而已。这里需要获取rtsp协议的地址,它是一种实时数据流传输协议。地址如下:

格式:
rtsp://用户名:密码@ip地址:554/Streaming/Channels/101
样例:
取第1个通道的主码流预览
rtsp://admin:123456789@10.10.6.100:554/Streaming/Channels/101

取第1个通道的子码流预览
rtsp://admin:123456789@10.10.6.100:554/Streaming/Channels/102

取第12个通道的主码流预览
rtsp://admin:123456789@10.10.6.100:554/Streaming/Channels/1201

QML代码实现

import QtQuick 2.12
import QtQuick.Controls 2.5
import QtMultimedia 5.0

Rectangle {
    x: 10
    y:10
    width: 1200
    height: 800
    color: "white"
    
    MediaPlayer {
        id: player
        autoPlay: true
        //source: "file:///home/test/test_camera.mp4" //播放本地视频文件
        source: "rtsp://admin:123456789@10.10.6.100:554/Streaming/Channels/101" //播放摄像头实时数据
        onError: {
            console.log(errorString)
        }
    }
    
    VideoOutput {
        anchors.fill: parent
        source: player
    }
}

啰嗦一句
从上面的QML代码看,播放网络实时视频流实际和播放本地的视频文件一样,都是把URL赋值给source属性。差异只是不同的数据源需要填写正确的视频流地址。

  • 2
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Qt6 中使用 QML 实时显示 OpenCV 获取的摄像头需要以下步骤: 1. 创建一个 QQuickImageProvider 类,用于将 OpenCV 获取的图像数据提供给 QML。 ```cpp class CameraImageProvider : public QQuickImageProvider { public: CameraImageProvider() : QQuickImageProvider(QQuickImageProvider::Pixmap) {} QPixmap requestPixmap(const QString &id, QSize *size, const QSize &requestedSize) override { Q_UNUSED(id) Q_UNUSED(requestedSize) cv::Mat image; // 获取摄像头图像数据 // ... // 将图像数据转换为 QPixmap QPixmap pixmap = QPixmap::fromImage(QImage(image.data, image.cols, image.rows, QImage::Format_RGB888)); *size = pixmap.size(); return pixmap; } }; ``` 2. 创建一个 QML 界面,使用 Image 控件显示摄像头图像。 ```qml import QtQuick 2.0 Image { id: cameraImage width: 640 height: 480 source: "image://camera/capture" fillMode: Image.PreserveAspectFit } ``` 3. 在 C++ 代码中注册 QQuickImageProvider 类,并将其作为上下文属性传递给 QML。 ```cpp int main(int argc, char *argv[]) { QApplication app(argc, argv); QQmlApplicationEngine engine; // 注册 QQuickImageProvider 类 CameraImageProvider cameraImageProvider; engine.addImageProvider("camera", &cameraImageProvider); // 将 QQuickImageProvider 实例作为上下文属性传递给 QML QQmlContext *context = engine.rootContext(); context->setContextProperty("cameraImageProvider", &cameraImageProvider); // 加载 QML 界面 const QUrl url(QStringLiteral("qrc:/main.qml")); QObject::connect(&engine, &QQmlApplicationEngine::objectCreated, &app, [url](QObject *obj, const QUrl &objUrl) { if (!obj && url == objUrl) QCoreApplication::exit(-1); }, Qt::QueuedConnection); engine.load(url); return app.exec(); } ``` 4. 在程序运行时,通过 OpenCV 获取摄像头图像数据,并在 QML 界面中实时显示。 ```cpp cv::VideoCapture cap(0); if (!cap.isOpened()) { // 摄像头打开失败 } while (true) { cv::Mat frame; cap.read(frame); // 将图像数据传递给 QML QCoreApplication::processEvents(); } ``` 以上是在 Qt6 中使用 QML 实时显示 OpenCV 获取的摄像头的基本步骤。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值