如何在Qml应用程序中显示Opencv摄像机馈送?

Question

我试图在Qml应用程序中显示opencv处理过的相机饲料和图像对象。

提要页是一个单独的页面，当按下按钮时，将Loader对象加载到主页面，默认情况下，提要页是不活动的。

下面是我使用的代码:

main.py

from PyQt5.QtGui import QGuiApplication, QImage
from PyQt5.QtQml import QQmlApplicationEngine
from PyQt5.QtCore import Qt, QObject, pyqtSignal, pyqtSlot, QTimer, QUrl, QThread, pyqtSignal, pyqtSlot
from PyQt5.QtWidgets import QApplication
from PyQt5.QtQuick import QQuickImageProvider, QQuickView

class CamFeedWorker(QThread):
image_update = pyqtSignal(QImage)
def __init__(self):
super(CamFeedWorker, self).__init__()
self.processor = FieldProcessor()  # Just gets the camera frame and does some processing
self.thread_active = True

def run(self):
self.thread_active = True
self.processor.init_cap()
while self.thread_active:
img = self.processor.frame_capture()
qt_img = QImage(img.data,
img.shape[1],
img.shape[0],
QImage.Format_RGB888
)
self.image_update.emit(qt_img)
def stop(self):
self.thread_active = False
sleep(0.2)
self.processor.cap.release()
self.quit()

class ImageProvider(QQuickImageProvider):
imageChanged = pyqtSignal(QImage)
def __init__(self):
super(ImageProvider, self).__init__(QQuickImageProvider.Image)
self.cam = CamFeedWorker() 
self.cam.image_update.connect(self.update_image)
def requestImage(self, id, requestedSize):
print("id: ", id)
print("requested size: ", requestedSize)
img = QImage(300, 300, QImage.Format_RGBA8888)
img.fill(Qt.black)
img = QImage("qml/pages/test.png")
return img, img.size()
def update_image(self, img):
self.imageChanged.emit(img)
class MainWindow(QObject):
def __init__(self):
QObject.__init__(self)
...

if __name__ == "__main__":
app = QGuiApplication(sys.argv)
engine = QQmlApplicationEngine()
main = MainWindow()
engine.rootContext().setContextProperty("backend", main)
# Image provider setup for camera feed:
engine.addImageProvider("MyImageProvider", ImageProvider())
engine.load(QUrl.fromLocalFile("qml/pages/FieldProcessingPage.qml"))
# Loading qml file
engine.load(os.fspath(Path(__file__).resolve().parent / "./qml/main.qml"))
if not engine.rootObjects():
sys.exit(-1)
sys.exit(app.exec_())

main.qml

一个普通的页面，每个子页面都有Loader和按钮，用于激活和查看页面，并取消激活其余的页面。

FieldProcessingPage.qml

import QtQuick 2.15
import QtQuick.Controls 2.15
Item {
id: fieldProcessingPage
Rectangle {
id: pageRectangle
anchors.fill: parent
implicitWidth: 800
implicitHeight: 600
Rectangle {
id: contentRectangle
anchors.fill: parent
Image {
id: feedImage
anchors.fill: parent
fillMode: Image.PreserveAspectFit
cache: false
source: "image://MyImageProvider/img"
property bool counter: false
function reloadImage() {
counter = !counter
source = "image://MyImageProvider/img?id=" + counter
}
}
}
}
Connections {
target: myImageProvider
function onImageChanged(image) {
feedImage.reloadImage()
}
}
}

当运行代码时，我得到这些错误消息:

file:qml/pages/FieldProcessingPage.qml:43:5: QML Connections: Detected function "onImageChanged" in Connections element. This is probably intended to be a signal handler but no signal of the target matches the name.
file:qml/pages/FieldProcessingPage.qml:26:13: QML Image: Failed to get image from provider: image://myimageprovider/img
file:FieldProcessingPage.qml:44: ReferenceError: myImageProvider is not defined

我实际上没有在python中找到一个例子，在qml上运行opencv的相机提要，所以我需要帮助来运行这个，谢谢。

Answer 1

首先，我发现你的代码对我的用例很有用，因为所有类似的解决方案都是c++。

我认为问题是FieldProcessingPage.qml中的目标连接针对的是类，而不是在渲染时默认实例化的类对象。

一个解决方法是创建一个类ImageProvider的对象，并引用它作为属性上下文以及默认的QQuickImageProvider。

main.py

if __name__ == "__main__":
app = QGuiApplication(sys.argv)
engine = QQmlApplicationEngine()
main = MainWindow()
myImageProvider = ImageProvider()
engine.rootContext().setContextProperty("backend", main)
engine.rootContext().setContextProperty("myImageProvider", myImageProvider)
# Image provider setup for camera feed:
engine.addImageProvider("MyImageProvider", myImageProvider)
engine.load(QUrl.fromLocalFile("qml/pages/FieldProcessingPage.qml"))
# Loading qml file
engine.load(os.fspath(Path(__file__).resolve().parent / "./qml/main.qml"))
if not engine.rootObjects():
sys.exit(-1)
sys.exit(app.exec_())