問題描述

我創建了一個 Publisher 類，它定期發出一個 QImage 對象.

但是，我很難將 QImage 繪制到 QML 元素.看起來 Image 和 Canvas QML 組件需要 QUrl 而不是 QImage，但我不需要確定如何將我的 QImage 轉換為 QUrl.Edit4:當我說 QUrl 時，并不是說我要嘗試將圖像轉換為 URL.那是胡說八道.我的意思是我想生成對這個圖像的引用，它不在磁盤上，而 QML 組件要求的數據類型是一個 URL.

我做了一些研究，發現 QQuickImageProvider 提供了一個解決方案，但我沒有找到任何文檔來解釋如何將我的 QImage 信號轉換為 QUrl 我可以用來繪圖.任何示例代碼或參考文檔將不勝感激.

感謝您的幫助！

編輯 1:

我看過這里:http://qt-project.org/doc/qt-5.0/qtquick/qquickimageprovider.html 并且我不知道如何將 QImage 傳遞給快速圖像提供程序并從中創建一個 QUrl.

編輯2.這是標題.實施應該不重要.

類發布者{Q_OBJECT民眾:發布者(QObject* parent = 0);虛擬?發布者(無效)；Q_信號:void newImage(const QImage& newImage);};

Edit 3. 這是我的 QML 代碼，但我不知道如何繪制我的 QImage，所以這段代碼沒有意義.

我的 main.cpp 文件:

int main(int argc, char *argv[]){QGuiApplication app(argc, argv);qmlRegisterType("組件", 1, 0, "Publisher");QtQuick2ApplicationViewer 查看器；viewer.setMainQmlFile(QStringLiteral("qml/QQuickViewExample/main.qml"));查看器.showExpanded();返回 app.exec();}

我的 main.qml 文件:

導入QtQuick 2.0導入組件 1.0長方形 {id : testRect寬度:360高度:360圖片{anchors.fill:父級編號:myImage出版商{編號:myPubonNewImage:{myImage.source = newImage;#我知道這行不通，它需要一個 QUrl 而不是 QImage}}}}

換句話說，您有一個類發出攜帶 QImage 的信號，并想用該圖像更新 QML 中的項目?有多種解決方案，其中沒有一個涉及將 QImage 轉換為 QUrl"(無論這意味著什么，您肯定不需要獲取帶有圖像數據的 data URL...)

使用圖像提供程序

這意味著您可以在 QML 文件中使用普通的 Image 項目.

1. 創建一個 QQuickImageProvider 子類；給它一個 QImage 成員(提供者的圖像)，覆蓋 requestImage 以提供該圖像(實際請求的 id 并不重要，請參閱下面)，以及一個接收 QImage 并更新成員的槽.
2. 將您的 Publisher 信號連接到您的提供商的插槽
3. 通過QQmlEngine::addImageProvider將提供者安裝到QML引擎中(見QQuickView::engine)；再次 id 并不重要，只要使用一個合理的

4. 在 QML 中，只需使用帶有這樣的源的普通 Image 元素

   圖片{編號:myImage來源:圖像://providerIdPassedToAddImageProvider/foobar"}

   foobar 將傳遞給您的提供者，但同樣，這并不重要.

5. 我們快到了，我們現在只需要一種方法將圖像更新推送到 QML 世界(否則圖像將永遠不知道何時更新自己).請參閱我的回答，了解如何使用Connections 元素和一點 JS.

   請注意，通常您不需要使 Publisher 成為 QML 類型，您只需要在 C++ 中創建 一個 實例并通過以下方式將其公開給 QML 世界QQmlContext::setContextProperty.

使用自定義 Qt Quick 2 項目

QQuickPaintedItem 可能是最方便的工作，因為它提供了一個采用 QPainter 的 paint 方法.因此，大計劃是

1. 子類QQuickPaintedItem:子類存儲要繪制的QImage，并有一個槽位設置新的QImage.此外，它的 paint 實現只是使用 QPainter::drawImage 繪制圖像.
2. 通過 qmlRegisterType 將子類暴露給 QML 世界(以便您可以在 QML 中使用它)

3. 想辦法將攜帶新圖像的信號連接到物品的插槽.

   這可能是棘手的部分.

   要在 C++ 中執行連接，您需要一種方法來確定該項目已創建(并獲得指向它的指針)；通常通過將 objectName 屬性分配給某個值，然后在根對象上使用 findChild(由 QQuickView::rootObject()) 以獲取指向項目本身的指針.然后你就可以照常使用connect.

   或者，可以改為在 QML 中執行連接，就像上面一樣，通過向 QML 世界公開的發布者 C++ 對象上的 Connections 元素:

   MyItem {編號:我的項目}連接{目標: thePublisherObjectExposedFromC++onNewImage: myItem.setImage(image)}

   無論您何時創建 MyItem 實例，這都有其優勢；但我不能 100% 確定它會起作用，因為我不確定您是否可以處理 QML 中的 QImage 類型.

I created a class Publisher which periodically emits a QImage object.

However I'm having a tough time drawing the QImage to a QML element. It appears that the Image and Canvas QML components require a QUrl instead of a QImage, but I'm not sure how to convert my QImage to a QUrl. Edit4: When I say QUrl, I don't mean I'm trying to convert an image to a URL. That's nonsense. I mean I want to generate a reference to this image, which is not on disk, and the data type that QML components are asking for is a URL.

I've done some research and found that QQuickImageProvider provides a solution, but I haven't found any documentation explaining how to convert my QImage signal to a QUrl that I can use for drawing. Any example code or reference documentation would be appreciated.

Thanks for your help!

Edit1:

I've taken a look here: http://qt-project.org/doc/qt-5.0/qtquick/qquickimageprovider.html and I do not see how I pass a QImage to the quick image provider and from it create a QUrl.

Edit2. Here is the header. The implementation should not be important.

class Publisher
{
    Q_OBJECT

public:
    Publisher(QObject* parent = 0);

    virtual ~Publisher(void);

Q_SIGNALS:

    void newImage(const QImage& newImage);
};

Edit 3. Here is my QML code, but I don't know how to draw my QImage, so this code is kind of meaningless.

my main.cpp file:

int main(int argc, char *argv[])
{
    QGuiApplication app(argc, argv);

    qmlRegisterType<Publisher>("Components", 1, 0, "Publisher");

    QtQuick2ApplicationViewer viewer;
    viewer.setMainQmlFile(QStringLiteral("qml/QQuickViewExample/main.qml"));
    viewer.showExpanded();

    return app.exec();
}

my main.qml file:

import QtQuick 2.0
import Components 1.0

Rectangle {
    id : testRect
    width: 360
    height: 360

    Image{
        anchors.fill: parent
        id: myImage

        Publisher {
            id: myPub

            onNewImage: {
                myImage.source = newImage;  #I know this doesnt work, it needs a QUrl and not a QImage
            }
        }
    }
}

In other words, you have a class emitting a signal carrying a QImage and want to update an item in QML with that image? There are various solutions, none of which involves "converting a QImage to a QUrl" (whatever that means, surely you don't need to get a data URL carrying your image data...)

Use an image provider

This means you can use a plain Image item in your QML files.

1. Create a QQuickImageProvider subclass; give it a QImage member (the image to provider), override requestImage to provide that image (the actual id requested does not really matter, see below), and a slot that receives a QImage and updates the member.
2. Connect your Publisher signal to your provider's slot
3. Install the provider into the QML engine via QQmlEngine::addImageProvider (see QQuickView::engine); again the id does not really matter, just use a sensible one

4. In QML, just use a plain Image element with a source like this

   Image {
       id: myImage
       source: "image://providerIdPassedToAddImageProvider/foobar"
   }
   

   foobar will be passed to your provider, but again, it doesn't really matter.

5. We're almost there, we now only need a way to push the image updates to the QML world (otherwise Image will never know when to update itself). See my answer here for how to do that with a Connections element and a bit of JS.

   Note that in general you don't need to make Publisher a QML type, you just need to create one instance in C++ and expose it to the QML world via QQmlContext::setContextProperty.

Use a custom Qt Quick 2 Item

QQuickPaintedItem is probably the most convenient for the job as it offers a paint method taking a QPainter. Hence the big plan is

1. Subclass QQuickPaintedItem: the subclass stores the QImage to be painted and has a slot that sets the new QImage. Also its paint implementation simply paints the image using QPainter::drawImage.
2. Expose the subclass to the QML world via qmlRegisterType (so that you can use it in QML)

3. Figure out a way to connect the signal carrying the new image to the items' slot.

   This might be the tricky part.

   To perform the connection in C++ you need a way to figure out that the item has been created (and get a pointer to it); usually one does this by means of assigning the objectName property to some value, then using findChild on the root object (as returned by QQuickView::rootObject()) to get a pointer to the item itself. Then you can use connect as usual.

   Or, could instead perform the connection in QML, just like above, via a Connections element on the publisher C++ object exposed to the QML world:

   MyItem {
       id: myItem
   }        
   
   Connections {
       target: thePublisherObjectExposedFromC++
       onNewImage: myItem.setImage(image)
   }
   

   This has the advantage of working no matter when you create the MyItem instance; but I'm not 100% sure it will work because I'm not sure you can handle the QImage type in QML.

這篇關于Qt/QML:將 QImage 從 C++ 發送到 QML 并在 GUI 上顯示 QImage的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！