人脸识别系统开发(5) — QML显示QImage

文章目录

• 1. 定义一个QQuickImageProvider派生类，实现requestImage和requestPixmap接口，返回需要显示的图片。
• 2. 调用addImageProvider函数向QML引擎中添加该ImageProvider类的实例。
• 3. QML中Image元素的source设置为providerId
• 动态更新

QML显示QImage的流程大致如下：

1. 定义一个QQuickImageProvider派生类，实现requestImage和requestPixmap接口，返回需要显示的图片。

示例：

#pragma once
#include <QImage>
#include <QMap>
#include <QQuickImageProvider>

class GrapImageProvider : public QQuickImageProvider, public QObject
{
public:
    static GrapImageProvider* instance();
    virtual ~GrapImageProvider();

    QImage requestImage(const QString &id, QSize *size, const QSize &requestedSize);
    QPixmap requestPixmap(const QString &id, QSize *size, const QSize &requestedSize);
public:
    void addImage(const QString &id, const QImage &image);
protected:
    QMap<QString, QImage> m_mapImages;
private:
    GrapImageProvider();
    static GrapImageProvider *m_pInstance;
};

2. 调用addImageProvider函数向QML引擎中添加该ImageProvider类的实例。

void QQmlEngine::addImageProvider(const QString &providerId, QQmlImageProviderBase *provider)

示例：

engine.addImageProvider(QLatin1String("GrapImageProvider"), GrapImageProvider::instance());

3. QML中Image元素的source设置为providerId

示例：

Image {
    id: imgGrap;
    anchors.fill: parent;
    smooth: true;
    fillMode: Image.PreserveAspectFit;
    source: "image://GrapImageProvider/";
    visible: false;
}

动态更新

如果图片内容需要动态更新，可以在source的内容后面加上一个整数ID，如:

source: "image://GrapImageProvider/1";

source: "image://GrapImageProvider/2";

这个ID会作为requestImage和requestPixmap函数的第一个参数带入。

完整代码：链接：https://pan.baidu.com/s/1qZQ1Xec 密码：ejjk