Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Getting this error (qt.svg: Cannot open file 'qrc:/images/solar-system-animation.svg', because: No such file or directory)

Getting this error (qt.svg: Cannot open file 'qrc:/images/solar-system-animation.svg', because: No such file or directory)

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
7 Posts 4 Posters 285 Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • V Offline
    V Offline
    Vikas_one
    wrote on last edited by
    #1

    //svgitem.h
    #ifndef SVGITEM_H
    #define SVGITEM_H

    #include <QQuickPaintedItem>
    #include <QObject>
    #include <QSvgRenderer>

    class SvgItem : public QQuickPaintedItem {
    Q_OBJECT
    Q_PROPERTY(QString source READ source WRITE setSource NOTIFY sourceChanged)

    public:
    SvgItem(QQuickItem *parent = nullptr);
    void paint(QPainter *painter) override;

    QString source() const;
    void setSource(const QString &source);
    

    signals:
    void sourceChanged();

    private:
    QSvgRenderer *m_renderer;
    QString m_source;
    };

    #endif // SVGITEM_H

    //main.cpp
    #include <QGuiApplication>
    #include <QQmlApplicationEngine>
    #include "svgitem.h"

    int main(int argc, char *argv[])
    {
    #if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
    #endif
    QGuiApplication app(argc, argv);

    QQmlApplicationEngine engine;
    qmlRegisterType<SvgItem>("com.yourcompany.svgitem", 1, 0, "SvgItem");
    
    const QUrl url(QStringLiteral("qrc:/main.qml"));
    QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
                     &app, [url](QObject *obj, const QUrl &objUrl) {
        if (!obj && url == objUrl)
            QCoreApplication::exit(-1);
    }, Qt::QueuedConnection);
    engine.load(url);
    
    return app.exec();
    

    }

    //svgitem.cpp

    #include "svgitem.h"
    #include <QPainter>

    SvgItem::SvgItem(QQuickItem *parent)
    : QQuickPaintedItem(parent), m_renderer(new QSvgRenderer(this)) {}

    void SvgItem::paint(QPainter *painter) {
    if (m_renderer->isValid()) {
    m_renderer->render(painter);
    }
    }

    QString SvgItem::source() const {
    return m_source;
    }

    void SvgItem::setSource(const QString &source) {
    if (m_source != source) {
    m_source = source;
    m_renderer->load(source);
    emit sourceChanged();
    update();
    }
    }

    //Background.qml
    import QtQuick 2.15
    import com.yourcompany.svgitem 1.0

    Item {
    width: 600
    height: 400

    SvgItem  {
        id: background
        anchors.fill: parent
    
        source: "qrc:/images/solar-system-animation.svg"
    
        Component.onCompleted: {
            console.log("==========================?",background.source)
        }
    }
    

    }

    //main.qml
    import QtQuick 2.15
    import QtQuick.Controls 2.15
    import QtQuick.Layouts 1.15
    import QtQuick.Window 2.15

    Window {
    visible: true
    width: 1200
    height: 600
    title: "Blended QML Example"

    Item {
        anchors.fill: parent
    
        // Background QML
        Loader {
            source: "Background.qml"
            anchors.fill: parent
        }
    
        Loader{
            source: "Meter.qml"
            anchors.fill: parent
        }
    
    }
    

    }

    //Meter.qml
    import QtQuick 2.15
    import QtQuick.Controls 2.15
    import QtQuick.Layouts 1.15

    Rectangle{
    width: parent.width
    height: parent.height
    color: "transparent"
    RowLayout {
    id: rowLayout
    anchors.fill: parent

        Rectangle {
            id: leftguage
            width: 300
            height: 300
            radius: width / 2
            color: "white"
            border.color: "black"
        }
    
        Item{
            Layout.fillWidth: true
        }
    
        Rectangle {
            id: rightguage
            width: 300
            height: 300
            radius: width / 2
            color: "white"
            border.color: "black"
        }
    }
    

    }

    jsulmJ JonBJ 2 Replies Last reply
    0
    • V Vikas_one

      //svgitem.h
      #ifndef SVGITEM_H
      #define SVGITEM_H

      #include <QQuickPaintedItem>
      #include <QObject>
      #include <QSvgRenderer>

      class SvgItem : public QQuickPaintedItem {
      Q_OBJECT
      Q_PROPERTY(QString source READ source WRITE setSource NOTIFY sourceChanged)

      public:
      SvgItem(QQuickItem *parent = nullptr);
      void paint(QPainter *painter) override;

      QString source() const;
      void setSource(const QString &source);
      

      signals:
      void sourceChanged();

      private:
      QSvgRenderer *m_renderer;
      QString m_source;
      };

      #endif // SVGITEM_H

      //main.cpp
      #include <QGuiApplication>
      #include <QQmlApplicationEngine>
      #include "svgitem.h"

      int main(int argc, char *argv[])
      {
      #if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)
      QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
      #endif
      QGuiApplication app(argc, argv);

      QQmlApplicationEngine engine;
      qmlRegisterType<SvgItem>("com.yourcompany.svgitem", 1, 0, "SvgItem");
      
      const QUrl url(QStringLiteral("qrc:/main.qml"));
      QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
                       &app, [url](QObject *obj, const QUrl &objUrl) {
          if (!obj && url == objUrl)
              QCoreApplication::exit(-1);
      }, Qt::QueuedConnection);
      engine.load(url);
      
      return app.exec();
      

      }

      //svgitem.cpp

      #include "svgitem.h"
      #include <QPainter>

      SvgItem::SvgItem(QQuickItem *parent)
      : QQuickPaintedItem(parent), m_renderer(new QSvgRenderer(this)) {}

      void SvgItem::paint(QPainter *painter) {
      if (m_renderer->isValid()) {
      m_renderer->render(painter);
      }
      }

      QString SvgItem::source() const {
      return m_source;
      }

      void SvgItem::setSource(const QString &source) {
      if (m_source != source) {
      m_source = source;
      m_renderer->load(source);
      emit sourceChanged();
      update();
      }
      }

      //Background.qml
      import QtQuick 2.15
      import com.yourcompany.svgitem 1.0

      Item {
      width: 600
      height: 400

      SvgItem  {
          id: background
          anchors.fill: parent
      
          source: "qrc:/images/solar-system-animation.svg"
      
          Component.onCompleted: {
              console.log("==========================?",background.source)
          }
      }
      

      }

      //main.qml
      import QtQuick 2.15
      import QtQuick.Controls 2.15
      import QtQuick.Layouts 1.15
      import QtQuick.Window 2.15

      Window {
      visible: true
      width: 1200
      height: 600
      title: "Blended QML Example"

      Item {
          anchors.fill: parent
      
          // Background QML
          Loader {
              source: "Background.qml"
              anchors.fill: parent
          }
      
          Loader{
              source: "Meter.qml"
              anchors.fill: parent
          }
      
      }
      

      }

      //Meter.qml
      import QtQuick 2.15
      import QtQuick.Controls 2.15
      import QtQuick.Layouts 1.15

      Rectangle{
      width: parent.width
      height: parent.height
      color: "transparent"
      RowLayout {
      id: rowLayout
      anchors.fill: parent

          Rectangle {
              id: leftguage
              width: 300
              height: 300
              radius: width / 2
              color: "white"
              border.color: "black"
          }
      
          Item{
              Layout.fillWidth: true
          }
      
          Rectangle {
              id: rightguage
              width: 300
              height: 300
              radius: width / 2
              color: "white"
              border.color: "black"
          }
      }
      

      }

      jsulmJ Online
      jsulmJ Online
      jsulm
      Lifetime Qt Champion
      wrote on last edited by
      #2

      @Vikas_one Please format your code properly!
      Do you have a resource file and if so does it contain that svg file?

      V 1 Reply Last reply
      3
      • V Vikas_one

        //svgitem.h
        #ifndef SVGITEM_H
        #define SVGITEM_H

        #include <QQuickPaintedItem>
        #include <QObject>
        #include <QSvgRenderer>

        class SvgItem : public QQuickPaintedItem {
        Q_OBJECT
        Q_PROPERTY(QString source READ source WRITE setSource NOTIFY sourceChanged)

        public:
        SvgItem(QQuickItem *parent = nullptr);
        void paint(QPainter *painter) override;

        QString source() const;
        void setSource(const QString &source);
        

        signals:
        void sourceChanged();

        private:
        QSvgRenderer *m_renderer;
        QString m_source;
        };

        #endif // SVGITEM_H

        //main.cpp
        #include <QGuiApplication>
        #include <QQmlApplicationEngine>
        #include "svgitem.h"

        int main(int argc, char *argv[])
        {
        #if QT_VERSION < QT_VERSION_CHECK(6, 0, 0)
        QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
        #endif
        QGuiApplication app(argc, argv);

        QQmlApplicationEngine engine;
        qmlRegisterType<SvgItem>("com.yourcompany.svgitem", 1, 0, "SvgItem");
        
        const QUrl url(QStringLiteral("qrc:/main.qml"));
        QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
                         &app, [url](QObject *obj, const QUrl &objUrl) {
            if (!obj && url == objUrl)
                QCoreApplication::exit(-1);
        }, Qt::QueuedConnection);
        engine.load(url);
        
        return app.exec();
        

        }

        //svgitem.cpp

        #include "svgitem.h"
        #include <QPainter>

        SvgItem::SvgItem(QQuickItem *parent)
        : QQuickPaintedItem(parent), m_renderer(new QSvgRenderer(this)) {}

        void SvgItem::paint(QPainter *painter) {
        if (m_renderer->isValid()) {
        m_renderer->render(painter);
        }
        }

        QString SvgItem::source() const {
        return m_source;
        }

        void SvgItem::setSource(const QString &source) {
        if (m_source != source) {
        m_source = source;
        m_renderer->load(source);
        emit sourceChanged();
        update();
        }
        }

        //Background.qml
        import QtQuick 2.15
        import com.yourcompany.svgitem 1.0

        Item {
        width: 600
        height: 400

        SvgItem  {
            id: background
            anchors.fill: parent
        
            source: "qrc:/images/solar-system-animation.svg"
        
            Component.onCompleted: {
                console.log("==========================?",background.source)
            }
        }
        

        }

        //main.qml
        import QtQuick 2.15
        import QtQuick.Controls 2.15
        import QtQuick.Layouts 1.15
        import QtQuick.Window 2.15

        Window {
        visible: true
        width: 1200
        height: 600
        title: "Blended QML Example"

        Item {
            anchors.fill: parent
        
            // Background QML
            Loader {
                source: "Background.qml"
                anchors.fill: parent
            }
        
            Loader{
                source: "Meter.qml"
                anchors.fill: parent
            }
        
        }
        

        }

        //Meter.qml
        import QtQuick 2.15
        import QtQuick.Controls 2.15
        import QtQuick.Layouts 1.15

        Rectangle{
        width: parent.width
        height: parent.height
        color: "transparent"
        RowLayout {
        id: rowLayout
        anchors.fill: parent

            Rectangle {
                id: leftguage
                width: 300
                height: 300
                radius: width / 2
                color: "white"
                border.color: "black"
            }
        
            Item{
                Layout.fillWidth: true
            }
        
            Rectangle {
                id: rightguage
                width: 300
                height: 300
                radius: width / 2
                color: "white"
                border.color: "black"
            }
        }
        

        }

        JonBJ Offline
        JonBJ Offline
        JonB
        wrote on last edited by
        #3

        @Vikas_one
        Hi and welcome. Please use the forum's Code tags (</> toolbar button) when posting blocks of literal code.

        Are you aware that in source: "qrc:/images/solar-system-animation.svg" that means it is accessing a Qt embedded resource, not an actual external file? Have you designed and embedded that file into your QML application, however you do that with QML (I don't use it)?

        1 Reply Last reply
        2
        • jsulmJ jsulm

          @Vikas_one Please format your code properly!
          Do you have a resource file and if so does it contain that svg file?

          V Offline
          V Offline
          Vikas_one
          wrote on last edited by
          #4

          @jsulm
          Yes

          jsulmJ 1 Reply Last reply
          0
          • V Vikas_one

            @jsulm
            Yes

            jsulmJ Online
            jsulmJ Online
            jsulm
            Lifetime Qt Champion
            wrote on last edited by
            #5

            @Vikas_one It doesn't look like you're loading this resource file like shown here: https://doc.qt.io/qt-6/resources.html

            1 Reply Last reply
            0
            • B Online
              B Online
              Bob64
              wrote on last edited by
              #6

              Though that page doesn't show any QML examples as far as I can see.

              I recall having to try a few things when I first wanted to do this a few years ago. I don't know if what I arrived at is the "correct" approach, but the format that I found to work in QML and have stuck to ever since involves using a triple forward slash like this:

                  source: "qrc:///images/my-image.png"
              
              jsulmJ 1 Reply Last reply
              0
              • B Bob64

                Though that page doesn't show any QML examples as far as I can see.

                I recall having to try a few things when I first wanted to do this a few years ago. I don't know if what I arrived at is the "correct" approach, but the format that I found to work in QML and have stuck to ever since involves using a triple forward slash like this:

                    source: "qrc:///images/my-image.png"
                
                jsulmJ Online
                jsulmJ Online
                jsulm
                Lifetime Qt Champion
                wrote on last edited by
                #7
                This post is deleted!
                1 Reply Last reply
                0

                • Login

                • Login or register to search.
                • First post
                  Last post
                0
                • Categories
                • Recent
                • Tags
                • Popular
                • Users
                • Groups
                • Search
                • Get Qt Extensions
                • Unsolved