подружить qml и opencv

OpenCV, qml, Python 3, QML

#системные библиотеки
import cv2
import numpy as np
import sys
import threading

#PyQt библиотеки
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtQml import *
from PyQt5.QtQuick import *


class MyImageProvider(QQuickImageProvider):
    def __init__(self):
        super(MyImageProvider, self).__init__(QQuickImageProvider.Image)

    def requestImage(self, p_str, size):
        cap = cv2.VideoCapture(0)
        while True:
            ret, frame = cap.read()
            #image = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)
            height, width, channel = frame.shape
            #step = channel * width
            img = QImage(frame, width, height, QImage.Format_RGB888)
            #img.fill(Qt.green)
            return img, img.size()
            cv2.waitKey(1)

if __name__ == '__main__':
    app = QGuiApplication(sys.argv)
    MyImageProvider()
    engine = QQmlApplicationEngine()
    engine.addImageProvider("myprovider", MyImageProvider())
    engine.load(QUrl.fromLocalFile("tst.qml"))
    if len(engine.rootObjects()) == -1:
        sys.exit(-1)
    sys.exit(app.exec_())

import QtQuick 2.12
import QtQuick.Window 2.12

Window{
    visible: true
    width: 800
    height: 600
    title: ("QML OPENCV")
    color: "green"
    Image
    {
         //anchors.fill : parent
         source: "image://myprovider/test.png"
    }
}

Рекомендуем хостинг TIMEWEB

Стабильный хостинг, на котором располагается социальная сеть EVILEG. Для проектов на Django рекомендуем VDS хостинг.

Добрый день.
Да... OpenCV, конечно, интересная тема. Но вот я от неё далёк.
QQuickImageProvider использутеся для предоставления изображений, но точно не для потока этих самых изображений. В каком-то смысле все те примеры выглядят как костыли, поскольку QQuickImageProvider используется не по своему прямому назначению. Но тем не менее это должно работать.

Обратите своё внимание на то, что в примере с утечкой памяти имеется сигнал, который сообщает об изменении изображения на каждый новый кадр. Вам нужно сделать тоже самое. Вам нуэно использовать сигналы и слоты для этого. Не помню, вы уже кажется смотрели ту статью по сигналам и слотам PyQt5 - Урок 007. Работаем с QML QtQuick (Сигналы и слоты)

Добрый.
Да, я пытался связаться через сигналы и слоты, но у меня не выходит перевести программу с плюсов на питон. Если не затруднит помочь в переводе, то есть вероятность, что получится написать конечный результат. :)

Думаю, что в QQuickImageProvider следует добавить сигнал, что-то вроде такого

class MyImageProvider(QQuickImageProvider):
    frameChanged = pyqtSignal()

А потом как минимум подключить к этому сигналу обработчик в QML и посмотреть, сыпется ли что-то нибудь в консоль QML

Window
{
    visible: true
    width: 640
    height: 480
    title: ("QML OPENCV")
    color: "green"
    id: root

    // ...

    Connections
    {
        target: myprovider
        property int frameCounter: 0

        onFrameChanged:
        {
            frameCounter ^= 1;
            console.log(frameCounter); // проверяем здесь изменение счётчика
        }
    }
}

Тогда уже можно будет пытаться сообразить что-нибудь дальше

А через "console.log" Вы куда выводите сообщения? В PyCharm? Я работаю в основном в стандартной IDLE Python. Такое не срабатывает в стандартной IDLE. PyCharm у меня стоит.

вообще - это тоже должно сыпаться в консоль и без разницы, какую IDE использовать. К IDE это не должно иметь никакого отношения. Если вывода нет, то скорее всего не работает.

А да, ещё этот сигнал нужно вызывать

class MyImageProvider(QQuickImageProvider):
    frameChanged = pyqtSignal()

    def __init__(self):
        super(MyImageProvider, self).__init__(QQuickImageProvider.Image)

    def requestImage(self, p_str, size):
        cap = cv2.VideoCapture(0)
        while True:
            ret, frame = cap.read()
            #image = cv2.cvtColor(frame, cv2.COLOR_BGR2RGB)
            height, width, channel = frame.shape
            #step = channel * width
            img = QImage(frame, width, height, QImage.Format_RGB888)
            #img.fill(Qt.green)
            self.frameChanged.emit() # вызвать сигнал
            return img, img.size() # а вот из-за этого у вас выполняется выход из функции, 
            cv2.waitKey(1) # до выполнения этого кода метод никогда не доходит

И кстати сам запрос изображения у вас как-то странно написан

Вы сейчас разбираете некий костыль, посоветовали с сигналами и слотами поработать, вот и хочу с ними разобраться, если так имеет место быть более правильное решение.) Я могу по-новому написать, чтобы было понятнее работать.

что предоставлено, с тем и работаю. не писать же мне с нуля ваш проект ))

Это понятное дело.)
Я сделал вот так, чтобы проверить, работает ли счётчик.
Код программы:

# системные библиотеки
import cv2
import numpy as np
import sys
import threading

# PyQt библиотеки
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtQml import *
from PyQt5.QtQuick import *


class MyImageProvider(QQuickImageProvider):
    def __init__(self):
        super(MyImageProvider, self).__init__(QQuickImageProvider.Image)

    frameChanged = pyqtSignal()

    def reauestSignal(self):

        self.frameChanged.emit()    #вызываю сигнал

if __name__ == '__main__':

    # создаём экземпляр приложения
    app = QGuiApplication(sys.argv)
    # создаём QML движок
    engine = QQmlApplicationEngine()
    # создаём объект vision
    videoProvider = MyImageProvider()
    # и регистрируем его в контексте QML
    engine.rootContext().setContextProperty("myprovider", videoProvider)
    #engine.addImageProvider("myprovider", videoProvider)
    # загружаем файл qml в движок
    engine.load("test.qml")

    engine.quit.connect(app.quit)
    sys.exit(app.exec_())

Код формы:

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12

Window
{
    visible: true
    width: 640
    height: 480
    title: ("QML OPENCV")
    color: "green"
    id: root

    // ...

    TextArea 
    {
        id: debug_area
        x: 183
        y: 361
        width: 275
        height: 145
        text: qsTr("Debug\n")
        selectByMouse: true
    }

    Connections
    {
        target: myprovider
        property int frameCounter: 0

        onFrameChanged:
        {
            frameCounter ^= 1;
            debug_area.text += frameCounter; // проверяем здесь изменение счётчика
        }
    }
}

Не хочет работать.

Я сделал простой вывод текста по испусканию сигнала...
Чего не хватает программе?)
Python:

# системные библиотеки
import cv2
import numpy as np
import sys
import threading

# PyQt библиотеки
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtQml import *
from PyQt5.QtQuick import *


class MyImageProvider(QObject):
    def __init__(self):
        QObject.__init__(self)

    frameChanged = pyqtSignal()


if __name__ == '__main__':

    # создаём экземпляр приложения
    app = QGuiApplication(sys.argv)
    # создаём QML движок
    engine = QQmlApplicationEngine()
    # создаём объект vision
    videoProvider = MyImageProvider()
    # и регистрируем его в контексте QML
    engine.rootContext().setContextProperty("myprovider", videoProvider)
    #engine.addImageProvider("myprovider", videoProvider)
    # загружаем файл qml в движок
    engine.load("test.qml")

    engine.quit.connect(app.quit)
    sys.exit(app.exec_())

QML:

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12

Window
{
    visible: true
    width: 640
    height: 480
    title: ("QML OPENCV")
    color: "green"
    id: root

    //здесь увидим информацию
    TextArea 
    {
        id: debug_area
        x: 183
        y: 10
        width: 200
        height: 400
        text: qsTr("Debug\n")
        selectByMouse: true
    }
    Button
    {
        x: 10
        y: 10
        width: 100
        height: 50
        text: qsTr("Debug Btn")
        onClicked:
        {
            debug_area.text += "BTN is WORK\n"
        }
    }
    Connections
    {
        target: myprovider
        property int frameCounter: 0

        onFrameChanged:
        {
            debug_area.text = "Signal is work"
            //frameCounter += 1;
            //debug_area.text = frameCounter; // проверяем здесь изменение счётчика
        }
    }
}

Есть на qml что-то типа window.onload? Чтобы при загрузке формы срабатывал сигнал. По нажатию кнопки всё прекрасно работает... А вот при загрузке формы нет...

Да, с console.log() я разобрался, счётчик ничего не показывает

У всех компонентов есть встраиваемый обработчик Component.onCompleted, который выполняется, когда объект полностью создан

Window {
    Component.onCompleted: {
        console.log("Window Completed Running!")
    }
}

Наверное сигнал всё-таки не вызывается правильно

А не подскажете, как вызвать правильно? :)

Сделал вот такой вариант и он работает, только мне непонятно, почему в консоли пишется undefined...
Форма:

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.12

Window
{
    visible: true
    width: 640
    height: 480
    title: ("QML OPENCV")
    color: "green"
    id: root

    Component.onCompleted:
    {
        console.log("onload")
        console.log(myprovider.say())
    }

    Connections
    {
        target: myprovider

        /*onFrameChanged:
        {   
        }*/
    }
}

Скрипт:

# системные библиотеки
import cv2
import numpy as np
import sys
import threading

# PyQt библиотеки
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtQml import *
from PyQt5.QtQuick import *


class MyImageProvider(QObject):

    def __init__(self):
        QObject.__init__(self)

    #frameChanged = pyqtSignal()

    @pyqtSlot()
    def say(self):
        print("blablabla")

if __name__ == '__main__':

    # создаём экземпляр приложения
    app = QGuiApplication(sys.argv)
    # создаём QML движок
    engine = QQmlApplicationEngine()
    # создаём объект vision
    videoProvider = MyImageProvider()
    # и регистрируем его в контексте QML
    engine.rootContext().setContextProperty("myprovider", videoProvider)
    #engine.addImageProvider("myprovider", videoProvider)
    # загружаем файл qml в движок
    engine.load("test.qml")

    engine.quit.connect(app.quit)
    sys.exit(app.exec_())

undefined пишет потому, что метод сам по себе ничего не возвращает, то есть void, напишите так

Component.onCompleted:
{
    console.log("onload")
    console.log(myprovider)
}

Вернул код инструкции, если я правильно понял.

Вернулся указатель на ваш объект. Ну слот срабатывает. Вам теперь нужно дальше развить вашу задачу. У меня к сожалению нет времени разбираться с opencv, поэтому не могу ответить на некоторые вопросы.

С opencv я разберусь. :) У меня пока только вопросы по сигналам и слотам.)

На сколько мне известно в opencv с камеры подпются картинки через определенное время и так выходит видео. По идее можно по получении этой картинки передавать ее в qml. Прикрепить сигнал к получению картинки или таймеру и так подовать сигнал в qml об необходимости обновления.

Если смотреть глубже, то там подаётся массив байтов(bytes в питоне). Ну, а по простому, то да. Я пока не разобрался как переменную передавать в qml форму. В этой самой переменной, пускай будет frame, как раз хранится поток с веб-камеры. Как только я передам её на форму, то по идее, элемент в котором будет "отображаться" данная переменная, нужно же перерисовывать, чтобы кадры обновлялись.