Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Sending OpenCV images continuously from C++ to Qml
Forum Updated to NodeBB v4.3 + New Features

Sending OpenCV images continuously from C++ to Qml

Scheduled Pinned Locked Moved Solved QML and Qt Quick
18 Posts 6 Posters 9.1k Views 2 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • sierdzioS Offline
    sierdzioS Offline
    sierdzio
    Moderators
    wrote on last edited by
    #4

    Look at the documentation, then. It contains several examples https://doc.qt.io/qt-5/qquickimageprovider.html

    (Z(:^

    YunusY 1 Reply Last reply
    3
    • GrecKoG Offline
      GrecKoG Offline
      GrecKo
      Qt Champions 2018
      wrote on last edited by
      #5

      You should implement an object capable of adding frames on a QAbstractVideoSurface, here is a quick explanation on how to do it : https://forum.qt.io/post/474269 (ignore the QScreen::grabWindow part). The non trivial part is converting your frames to QVideoFrame.

      You could then use this object as a source of a QML VideoOutput.

      1 Reply Last reply
      2
      • sierdzioS sierdzio

        Look at the documentation, then. It contains several examples https://doc.qt.io/qt-5/qquickimageprovider.html

        YunusY Offline
        YunusY Offline
        Yunus
        wrote on last edited by Yunus
        #6

        @sierdzio Okey I tried to use ImageProvider example in here. Okey I can send my image but how can i update images when I changed the QImage in cpp part. Here is my files:

        LiveImageProvider.cpp

        // LiveImageProvider.cpp
        #include "liveimageprovider.h"
        #include <QDebug>
        /**
        * @brief Image provider that is used to handle the live image stream in the QML viewer.
         */
        LiveImageProvider::LiveImageProvider() : QQuickImageProvider(QQuickImageProvider::Image)
        {
            this->no_image = QImage(":/images/no_image.png");
            this->blockSignals(false);
        }
        
        
        QImage LiveImageProvider::requestImage(const QString &id, QSize *size, const QSize &requestedSize)
        {
            QImage result = this->image;
        
            if(result.isNull()) {
                result = this->no_image;
            }
        
            if(size) {
                *size = result.size();
            }
        
            if(requestedSize.width() > 0 && requestedSize.height() > 0) {
                result = result.scaled(requestedSize.width(), requestedSize.height(), Qt::KeepAspectRatio);
            }
        
            return result;
        }
        
        void LiveImageProvider::updateImage(const QImage &image)
        {
            if(this->image != image) {
                this->image = image;
                emit imageChanged();
            }
        }
        

        LiveImageProvider.h

        // LiveImageProvider.h
        #ifndef LIVEIMAGEPROVIDER_H
        #define LIVEIMAGEPROVIDER_H
        
        #include <QImage>
        #include <QQuickImageProvider>
        
        class LiveImageProvider : public QObject, public QQuickImageProvider
        {
            Q_OBJECT
        public:
            LiveImageProvider();
        
            QImage requestImage(const QString &id, QSize *size, const QSize &requestedSize) override;
        
        public slots:
            void updateImage(const QImage &image);
            int ulan();
        
        signals:
            void imageChanged();
        
        private:
            QImage image;
            QImage no_image;
        };
        
        #endif // LIVEIMAGEPROVIDER_H
        

        main.qml

        import QtQuick 2.9
        import QtQuick.Window 2.2
        import QtQuick.Controls 1.0
        
        
        Window {
            visible: true
            width: 1200
            height: 900
            title: qsTr("Hello World")
            Image {
              id: liveImage
              property bool counter: false
            
              asynchronous: true
              source: "image://live/image"
              anchors.fill: parent
              fillMode: Image.PreserveAspectFit
              cache: false
            
            
              function reload() {
                counter = !counter
                source = "image://live/image?id=" + counter
              }
              }
        }
        
        1 Reply Last reply
        0
        • SGaistS Offline
          SGaistS Offline
          SGaist
          Lifetime Qt Champion
          wrote on last edited by
          #7

          Hi,

          Out of curiosity, do you do any processing with OpenCV ?
          If not, what about using QtMultimedia and the Camera type ?

          Interested in AI ? www.idiap.ch
          Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

          YunusY 1 Reply Last reply
          2
          • sierdzioS Offline
            sierdzioS Offline
            sierdzio
            Moderators
            wrote on last edited by
            #8

            Hm indeed, looks like the image provider API does not contain any useful API to update the view continuously. You could hack around it with the solution you linked (https://forum.qt.io/topic/38978/solved-send-qimage-from-c-to-qml-via-qquickimageprovider-or-using-a-signal/4), which requests a new image periodically using a timer. But probably a better solution is to prepare a video surface like @GrecKo suggests, or to reimplement QQuickItem. Sorry for leading you down a suboptimal path!

            (Z(:^

            YunusY 1 Reply Last reply
            3
            • SGaistS SGaist

              Hi,

              Out of curiosity, do you do any processing with OpenCV ?
              If not, what about using QtMultimedia and the Camera type ?

              YunusY Offline
              YunusY Offline
              Yunus
              wrote on last edited by Yunus
              #9

              @sgaist Yeah, I m doing lots of task in Opencv and I need to send opencv images to qml continuously. I used this example. But I can only send images triggering with qml buttons. I want to send the images continuously like video.

              1 Reply Last reply
              0
              • sierdzioS sierdzio

                Hm indeed, looks like the image provider API does not contain any useful API to update the view continuously. You could hack around it with the solution you linked (https://forum.qt.io/topic/38978/solved-send-qimage-from-c-to-qml-via-qquickimageprovider-or-using-a-signal/4), which requests a new image periodically using a timer. But probably a better solution is to prepare a video surface like @GrecKo suggests, or to reimplement QQuickItem. Sorry for leading you down a suboptimal path!

                YunusY Offline
                YunusY Offline
                Yunus
                wrote on last edited by
                #10

                @sierdzio Thanks for ur help. I will try the example using timer I hope it works :(

                J.HilkJ 1 Reply Last reply
                0
                • YunusY Yunus

                  @sierdzio Thanks for ur help. I will try the example using timer I hope it works :(

                  J.HilkJ Offline
                  J.HilkJ Offline
                  J.Hilk
                  Moderators
                  wrote on last edited by
                  #11

                  @yunus

                  You can also take a look at one of my projects:
                  https://github.com/DeiVadder/Sindepile-Challenge-QML

                  I used that one to experiment with the QImageProvoder class and I update the ui each time a new image is available, not based on a timer.

                  If you don't really care about performance, you could also simply force an update each time possible, by reacting to the frameSwapped signal


                  Be aware of the Qt Code of Conduct, when posting : https://forum.qt.io/topic/113070/qt-code-of-conduct


                  Q: What's that?
                  A: It's blue light.
                  Q: What does it do?
                  A: It turns blue.

                  YunusY 1 Reply Last reply
                  0
                  • J.HilkJ J.Hilk

                    @yunus

                    You can also take a look at one of my projects:
                    https://github.com/DeiVadder/Sindepile-Challenge-QML

                    I used that one to experiment with the QImageProvoder class and I update the ui each time a new image is available, not based on a timer.

                    If you don't really care about performance, you could also simply force an update each time possible, by reacting to the frameSwapped signal

                    YunusY Offline
                    YunusY Offline
                    Yunus
                    wrote on last edited by
                    #12

                    @j-hilk @sierdzio Thank you so much. I am very glad to both. I think I fixed my problem. I solved using Imageprovider and QTimer using example here. And also @J-Hilk project is working well. I ll use one of these. Thank you Qt Forum, I am very happy to be able to fix this problem

                    1 Reply Last reply
                    1
                    • GrecKoG Offline
                      GrecKoG Offline
                      GrecKo
                      Qt Champions 2018
                      wrote on last edited by
                      #13

                      QQuickImageProvider is not the correct solution to display videos. Implementing a source for a VideoOutput is the sanest thing to do.
                      If we are advising convoluted ways to display a video, I'd like to propose writing a QAbstractTableModel containing each pixel value in its cells, and display that with a TableView and 1x1 Rectangle delegates.

                      YunusY J.HilkJ 2 Replies Last reply
                      2
                      • GrecKoG GrecKo

                        QQuickImageProvider is not the correct solution to display videos. Implementing a source for a VideoOutput is the sanest thing to do.
                        If we are advising convoluted ways to display a video, I'd like to propose writing a QAbstractTableModel containing each pixel value in its cells, and display that with a TableView and 1x1 Rectangle delegates.

                        YunusY Offline
                        YunusY Offline
                        Yunus
                        wrote on last edited by
                        #14

                        @grecko I also want the right way but I am new on Qt. Do you have an example to advise me about your method

                        1 Reply Last reply
                        0
                        • GrecKoG GrecKo

                          QQuickImageProvider is not the correct solution to display videos. Implementing a source for a VideoOutput is the sanest thing to do.
                          If we are advising convoluted ways to display a video, I'd like to propose writing a QAbstractTableModel containing each pixel value in its cells, and display that with a TableView and 1x1 Rectangle delegates.

                          J.HilkJ Offline
                          J.HilkJ Offline
                          J.Hilk
                          Moderators
                          wrote on last edited by
                          #15

                          @grecko awesome idea, may I suggest an add-on .

                          Will need some work on the model, but I suggest only updating every other row, for a 90's era interlacing effect!
                          šŸ˜‰


                          Be aware of the Qt Code of Conduct, when posting : https://forum.qt.io/topic/113070/qt-code-of-conduct


                          Q: What's that?
                          A: It's blue light.
                          Q: What does it do?
                          A: It turns blue.

                          1 Reply Last reply
                          1
                          • GrecKoG Offline
                            GrecKoG Offline
                            GrecKo
                            Qt Champions 2018
                            wrote on last edited by
                            #16

                            @Yunus Here's a post where I explain it textually : https://forum.qt.io/post/474269

                            Here is some sample code I wrote some time ago : https://gist.github.com/oKcerG/a5b59c7583c85ff03bdec238eed8bcd8

                            The import part is the videoSurface setter which starts the videoSurface, and then I periodically present a frame on it.

                            Make sure to chose a correct QVideoSurfaceFormat, and don't do like I did for generating a QVideoFrame ( QPixmap -> QImage -> QImage in the correct format -> QVideoFrame), that's way too much conversions, but I did that only as a quick proof of concept.

                            There must be a more direct way to convert cv::Mat to QVideoFrame, there might even be a copyless solution but that's not my domain of expertise.

                            1 Reply Last reply
                            2
                            • YunusY Offline
                              YunusY Offline
                              Yunus
                              wrote on last edited by
                              #17

                              Thank you I ll try

                              1 Reply Last reply
                              0
                              • M Offline
                                M Offline
                                Muhammet Ali Asan
                                wrote on last edited by
                                #18

                                As far as I understand you want to read video from camera, process frames using OpenCV then display output in QML. This solution you used is not good. It uses timer with a second interval and each timeout event will send image to QML.
                                2 Disadvantages :

                                • You are hardcoding your processing speed to 1 fps. Even camera provides more frames you are reading only 1 frame. To catch everything your timer ticks should be more frequent than your video reader.

                                • In a low power system or with a camera with low fps there will be synchronization problems.

                                You should use QAbstractVideoFilter . There is a good example in the page. Basically it allows you to process image while it is being sent to VideoOutput by Camera in Qml. And it will be definitely more easier and efficient than your solution.

                                1 Reply Last reply
                                0

                                • Login

                                • Login or register to search.
                                • First post
                                  Last post
                                0
                                • Categories
                                • Recent
                                • Tags
                                • Popular
                                • Users
                                • Groups
                                • Search
                                • Get Qt Extensions
                                • Unsolved