QML 에서 기본적으로 이미지를 표시하려면 Image 아이템을 사용하면된다. 로컬 파일 시스템이나 웹에 있는 이미지도 훌륭하게 표시할 수 있다. 애플리케이션이 시작될 때 Qt 리소스에서 Qml을 로드하는 경우, Qml뿐만 아니라 모든 이미지는 Qt리소스에서 로드된다.
자주는 아니지만 RGB 데이터를 표시해야 하는 경우가 있다. 이런 이미지를 화면에 나타내야 할 필요가 있을 경우 QQuickImageProvider 를 서브클래싱하고 QImage 를 제공하여 QML에서 표시할 수 있다.
아래 예제는 QQuickImageProvider 를 이용한 이미지 표시 방법을 보여준다.
imageprovider.h
#ifndef IMAGEPROVIDER_H
#define IMAGEPROVIDER_H
#include <QQuickImageProvider>
class ImageProvider : public QObject, public QQuickImageProvider
{
Q_OBJECT
public:
ImageProvider();
~ImageProvider();
static ImageProvider * instance();
QImage requestImage(const QString& id, QSize* size, const QSize& requestedSize);
QPixmap requestPixmap(const QString& id, QSize* size, const QSize& requestedSize);
};
#endif // IMAGEPROVIDER_H
imageprovider.cpp
#include "imageProvider.h"
#include <QFile>
#include <QImage>
#include <QPixmap>
#include <QDebug>
ImageProvider *ImageProviderInstance;
ImageProvider::ImageProvider()
:QQuickImageProvider(QQmlImageProviderBase::Image)
{
}
ImageProvider::~ImageProvider()
{
}
ImageProvider *ImageProvider::instance()
{
if(ImageProviderInstance)
{
return ImageProviderInstance;
}
else
{
ImageProviderInstance = new ImageProvider;
return ImageProviderInstance;
}
}
QImage ImageProvider::requestImage(const QString& id, QSize* size, const QSize& requestedSize)
{
QImage image(id);
QImage result;
if (requestedSize.isValid()) {
result = image.scaled(requestedSize, Qt::KeepAspectRatio);
} else {
result = image;
}
*size = result.size();
return result;
}
QPixmap ImageProvider::requestPixmap(const QString& id, QSize* size, const QSize& requestedSize)
{
QPixmap image(id);
QPixmap result;
if (requestedSize.isValid()) {
result = image.scaled(requestedSize, Qt::KeepAspectRatio);
} else {
result = image;
}
*size = result.size();
return result;
}
mainwindow.cpp 에 imageprovider객체 등록
context->engine()->addImageProvider(QString("extern"), ImageProvider::instance());
Qml 애플리케이션
Image {
id: img
x: 0
y: 25
width: 227
height: 230
anchors.horizontalCenter: parent.horizontalCenter
source: "image://extern/"+path
//doesn't find absolute path in windows source: "file://"+path
fillMode: Image.PreserveAspectFit
}