Qt / QML：发送QImage从C ++到QML和显示QImage在GUI [英] Qt/QML : Send QImage From C++ to QML and Display The QImage On GUI

问题描述

我创建了一个类 Publisher ，它定期发出一个 QImage 对象。

然而，我有一个艰难的时候绘制 QImage 到一个QML元素。看起来 Image 和 Canvas QML组件需要一个 QUrl 而不是 QImage ，但我不知道如何将我的 QImage 转换为 QUrl 。编辑4：当我说QUrl，我不意味着我试图将图像转换为URL。这是废话。我的意思是我想生成一个引用这个图像，这不是在磁盘上，并且QML组件要求的数据类型是一个URL。

做了一些研究，发现 QQuickImageProvider 提供了一个解决方案，但我还没有找到任何文档解释如何转换我的 QImage 信号到可以用于绘图的 QUrl 。

感谢您的帮助！

>

我看了一下： http： //qt-project.org/doc/qt-5.0/qtquick/qquickimageprovider.html ，我没有看到我如何传递QImage到快速图像提供程序，并从它创建一个QUrl。

Edit2。这里是标题。实施不应该很重要。

  class Publisher 
 {
 Q_OBJECT 
 $ b b public：
 Publisher（QObject * parent = 0）; 
 
 virtual〜Publisher（void）; 
 
 Q_SIGNALS：
 
 void newImage（const QImage& newImage）; 
}; 
  

编辑3.这是我的QML代码，但我不知道如何绘制我的QImage，所以这段代码是没有意义的。

我的main.cpp文件：

  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））; 
 view.showExpanded（）; 
 
 return app.exec（）; 
} 
  

my main.qml file ：

  import QtQuick 2.0 
 import Components 1.0 
 
 Rectangle {
 id：testRect 
 width：360 
 height：360 
 
图片{
 anchors.fill：parent 
 id：myImage 
 
 Publisher {
 id：myPub 
 
 onNewImage：{
 myImage.source = newImage; ＃我知道这不工作，它需要一个QUrl而不是一个QImage 
} 
} 
} 
} 
  

解决方案

换句话说，你有一个类发出一个信号携带一个QImage，并想更新一个项目在QML与该图像？有各种解决方案，没有一个涉及将QImage转换为QUrl（无论什么意思，肯定你不需要得到一个数据携带您的图像数据...）

使用图片提供程序

这意味着您可以使用一个简单的 Image 项目。

1. 创建 QQuickImageProvider 子类;给它一个 QImage 成员（图像到提供者），重写 requestImage 提供该图像（实际 id 请求并不重要，见下文）和一个接收 QImage 并更新成员的槽。


2. 将发布者信号连接到您的提供者插槽


3. 通过<$ c将提供者安装到QML引擎$ c> QQmlEngine :: addImageProvider （见 QQuickView :: engine ）; id 并不重要，只需使用一个明智的



4. 在QML中，只需使用一个简单的 Image 具有此类源的元素

    图像{
    id：myImage 
    source：image：// providerIdPassedToAddImageProvider / foobar
   } 
     




我们将会向您的供应商传递code> foobar 我们现在只需要一种方法来推动图像更新到QML世界（否则Image永远不会知道什么时候更新自己）。请参阅我的回答，了解如何使用连接元素和一点JS。





请注意，一般来说，您不需要使 Publisher 一个QML类型，您只需要创建



ol>



使用自订的Qt Quick 2项目





QQuickPaintedItem 可能是最方便的工作，因为它提供了一个 paint 方法取一个 QPainter 。因此，大计划是



1. 子类 QQuickPaintedItem ：子类存储 QImage 被绘制，并有一个槽，设置新的QImage。它的 paint 实现只是使用 QPainter :: drawImage 来绘制图像。


2. 通过 qmlRegisterType （以便您可以在QML中使用它）将子类暴露给QML世界。



3. 以将携带新图像的信号连接到项目的插槽。

   
   
   

   这可能是棘手的部分。

   
   
   

   要在C ++中执行连接，该项目已被创建（并获得一个指针）;通常通过将 objectName 属性赋值为某个值，然后在根对象上使用 findChild 由 QQuickView :: rootObject（）返回，以获取该项本身的指针。然后，您可以照常使用 connect 。

   
   
   

   在QML中，就像上面一样，通过暴露给QML世界的发布者C ++对象上的 Connections 元素：

     MyItem {
    id：myItem 
   } 
    
    Connections {
    target：thePublisherObjectExposedFromC ++ 
    onNewImage：myItem.setImage image）
   } 
     

   这具有无论何时创建MyItem实例;但我不是100％肯定它会工作，因为我不确定你可以处理 QImage 类型在QML。







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和显示QImage在GUI的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！