QML 支持SVG格式的图片加载

        qml 下自带的Image的支持svg显示时是糊的，QT自带的svg库好像是阉割版的，只支持SVG 1.2 Tiny版本，也就意味着部分svg图片可能不适用。等着QT官方更新吧。我们要解决的问题是，Image其实不是真正加载svg，而是转过的图像。QT对svg的渲染，有特定的类QSvgRenderer，所以，我们只需要做一个自定义的qml控件即可。

svg_image.h文件：

#pragma once
#include <QQuickPaintedItem>
#include <QImage>
#include <QPainter>
#include <QQuickView>
#include <QtSvg/QSvgRenderer>

class SvgImage : public QQuickPaintedItem
{
    Q_OBJECT
    Q_PROPERTY(QString source READ readSource WRITE writeSource NOTIFY sourceChanged)
public:
    explicit SvgImage(QQuickItem *parent = nullptr);

    static void declareQML();
    QString readSource() const { return m_source; };
    void writeSource(QString sourcePath);

signals:
    void sourceChanged();

protected:
    void paint(QPainter *painter) override;

private:
    QSvgRenderer *m_pSvgRenderer = nullptr;
    QString m_source = "";
};

svg_image.cpp

#include "svg_image.h"
#include <qdebug.h>
#include <QTimer>
#include <QRegion>
#include <QPointF>

SvgImage::SvgImage(QQuickItem *parent) : QQuickPaintedItem(parent)
{
    m_pSvgRenderer = new QSvgRenderer(this);
}

void SvgImage::declareQML()
{
    qmlRegisterType<SvgImage>("SvgImage", 1, 0, "SvgImage");
}

void SvgImage::writeSource(QString sourcePath) {
    m_source = sourcePath;
    m_source.replace("qrc", "");
    m_pSvgRenderer->load(m_source);
    emit sourceChanged();
    update();
}

void SvgImage::paint(QPainter *painter)
{
    QRectF rect = QRectF(QPointF(x(),y()), QSizeF(width(), height()));
    //qDebug() << "width" << width();
    //qDebug() << "height" << height();
    m_pSvgRenderer->render(painter, rect);
}

将以上两个文件加入c++代码编译，并在C++初始化的时候调用注册接口SvgImage::declareQML()就好。在qml使用 按如下示例：

import SvgImage 1.0

   
    .
    .
    .


Rectangle {
    id: iconRectangle
    implicitHeight: 16
    implicitWidth: 16
    color: "transparent"

    SvgImage {
        id: iconImage
        anchors.fill: parent
    }
}

        觉得有用的朋友，记得帮俺点个赞。