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. How to set the the path of images in qml file if the qml file is in resource ?

How to set the the path of images in qml file if the qml file is in resource ?

Scheduled Pinned Locked Moved QML and Qt Quick
18 Posts 10 Posters 48.1k 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.
  • B Offline
    B Offline
    brucewuu
    wrote on last edited by
    #1

    as we know , when the qml file is not in the resource file , we can set the path of images by relative path "relative to exe path" , or absoulte path , while when we want to hide the qml files and put them into resource file , if we still use the old way , it will try to find them
    from resource file , and failed to find them . I searched it on line , people suggested use "file:///home/xx.png" to set the absolute path of images , this way works on linux , while I set it on windows like "file:///C:/test/xx.png" , it couldn't find it , but if I run this in run edit on windows , it can find the image . How could I solve this problem ? if I want to set the relative path not using file:/// ,what should I do ?thanks for your help .

    wish all the best to you from
    bruce wuu
    Autodesk China Inc.
    SW Developer
    M&E Product Developerment Group
    Work 137 6411 8921
    bruce.wu@autodesk.com

    1 Reply Last reply
    0
    • L Offline
      L Offline
      leon.anavi
      wrote on last edited by
      #2

      Please read the following "thread":http://developer.qt.nokia.com/forums/viewthread/5617 because I believe it discuss the same issue.

      http://anavi.org/

      T 1 Reply Last reply
      0
      • S Offline
        S Offline
        spode
        wrote on last edited by
        #3

        hi. in qml you can display images with relative path so.

        X = image.png (or other extention)
        let's see this example:

        1. our .qml is in C:\user\nomeutente\progetto\cartellaprogetto\qml\main.qml .
          our X is in C:\user\nomeutente\progetto\cartellaprogetto\image\image.png
          here you write in main.qml
          @ //main.qml
          import QtQuick 1.0
          Rectangle {
          width: 100; height: 100

        Image {
        source: "../image/image.png" /*where "../" indicates that the last part of the current directory is trunced, so we have C:\user\nomeutente\progetto\cartellaprogetto and then we append /image/image.png, so the absolute path is C:\user\nomeutente\progetto\cartellaprogetto/image/image.png. note that you must use "/" as separator! */
        }
        } @

        1 Reply Last reply
        0
        • E Offline
          E Offline
          eirnanG
          wrote on last edited by
          #4

          i use this if its GIF
          @AnimatedImage { id: bath; x: 0; y: 0;
          width: 240; height: 316; source: "bath"}@

          and for PNG or JPEG

          @ Image {
          id: image1
          x: 52
          y: 56
          width: 100
          height: 100
          source: "Status.JPG"@

          1 Reply Last reply
          0
          • B Offline
            B Offline
            brucewuu
            wrote on last edited by
            #5

            [EDIT: moved this post here from another thread, Volker]

            sorry , I am afraid you guys misunderstand this question , if qml files is not embeded in the qrc files ,
            there is no problem referring the qml files and images file with relative or absolute path , but if we embeded the qml files into the qrc files , while the images files is not embeded in the qrc files , like
            qml refering using "qrc:/qml/myqml.qml" , images using "images/hello.png", and images folder is under exe folder , it can't find the image files .why I want to do it in this way , because I want to hide the qml files when I release my software , while I exposed the images files , because I want to provide skin options , customers can download new images from our website and replace the old image files , how can I solve this problem ?

            wish all the best to you from
            bruce wuu
            Autodesk China Inc.
            SW Developer
            M&E Product Developerment Group
            Work 137 6411 8921
            bruce.wu@autodesk.com

            1 Reply Last reply
            0
            • B Offline
              B Offline
              brucewuu
              wrote on last edited by
              #6

              but if we embeded the qml files into the qrc files , while the images files is not embeded in the qrc files , like
              qml refering using “qrc:/qml/myqml.qml” , images using “images/hello.png”, and images folder is under exe folder , it can’t find the image files .why I want to do it in this way , because I want to hide the qml files when I release my software , while I exposed the images files , because I want to provide skin options , customers can download new images from our website and replace the old image files , how can I solve this problem ?

              wish all the best to you from
              bruce wuu
              Autodesk China Inc.
              SW Developer
              M&E Product Developerment Group
              Work 137 6411 8921
              bruce.wu@autodesk.com

              1 Reply Last reply
              0
              • D Offline
                D Offline
                DenisKormalev
                wrote on last edited by
                #7

                You always can pass absolute path of your app folder (which you can retrieve in run-time) as context property to qml and concat it with your image path

                1 Reply Last reply
                0
                • G Offline
                  G Offline
                  goetz
                  wrote on last edited by
                  #8

                  If do not use an absolute path, Qt makes it relative to the surrounding QML code. And as this is in a resource, it searches for the image in the resources too.

                  http://www.catb.org/~esr/faqs/smart-questions.html

                  1 Reply Last reply
                  0
                  • B Offline
                    B Offline
                    brucewuu
                    wrote on last edited by
                    #9

                    thanks , Denis and Volker , you are right , now I can solve this with Denis's suggestion , thanks all of you guys .

                    wish all the best to you from
                    bruce wuu
                    Autodesk China Inc.
                    SW Developer
                    M&E Product Developerment Group
                    Work 137 6411 8921
                    bruce.wu@autodesk.com

                    1 Reply Last reply
                    0
                    • D Offline
                      D Offline
                      DenisKormalev
                      wrote on last edited by
                      #10

                      Volker, OP asks about using non-resourced images in resourced qml. I'm not sure it is possible with relative paths.

                      1 Reply Last reply
                      0
                      • B Offline
                        B Offline
                        brucewuu
                        wrote on last edited by
                        #11

                        agree with denis , maybe there is some function which can set the path of the images files , or some
                        protocol , like "relative:///"

                        wish all the best to you from
                        bruce wuu
                        Autodesk China Inc.
                        SW Developer
                        M&E Product Developerment Group
                        Work 137 6411 8921
                        bruce.wu@autodesk.com

                        1 Reply Last reply
                        0
                        • G Offline
                          G Offline
                          goetz
                          wrote on last edited by
                          #12

                          Relative paths rely on the "parent" path to be resolved. Basically it's an URL. You cannot use relative paths and switch the protocol (from qrc: to file:).

                          http://www.catb.org/~esr/faqs/smart-questions.html

                          1 Reply Last reply
                          0
                          • B Offline
                            B Offline
                            brucewuu
                            wrote on last edited by
                            #13

                            thanks , Volker

                            wish all the best to you from
                            bruce wuu
                            Autodesk China Inc.
                            SW Developer
                            M&E Product Developerment Group
                            Work 137 6411 8921
                            bruce.wu@autodesk.com

                            1 Reply Last reply
                            0
                            • J Offline
                              J Offline
                              jkosonen
                              wrote on last edited by
                              #14

                              Did you get this to work, for me it just says "QML Image: Protocol "C" is unknown"

                              But it works with:

                              source: "file:images/image.jpg"

                              1 Reply Last reply
                              0
                              • B Offline
                                B Offline
                                brucewuu
                                wrote on last edited by
                                #15

                                yes , now it works , you can use
                                @
                                QString imagePath = QDir::currentPath()+"/images/";
                                #if defined(Q_OS_MAC)
                                imagePath = "file://"+imagePath;
                                #endif
                                QDeclarativeContext::setContextProperty("imagePath",imagePath);
                                @

                                wish all the best to you from
                                bruce wuu
                                Autodesk China Inc.
                                SW Developer
                                M&E Product Developerment Group
                                Work 137 6411 8921
                                bruce.wu@autodesk.com

                                1 Reply Last reply
                                0
                                • M Offline
                                  M Offline
                                  misterion
                                  wrote on last edited by
                                  #16

                                  Also you can build this and use imagePath hack in Qt Creator and QmlViewer - https://github.com/misterion/QmlViewerDevHelper

                                  1 Reply Last reply
                                  0
                                  • L leon.anavi

                                    Please read the following "thread":http://developer.qt.nokia.com/forums/viewthread/5617 because I believe it discuss the same issue.

                                    T Offline
                                    T Offline
                                    TonyN
                                    wrote on last edited by
                                    #17

                                    @leon.anavi the link is no longer valid!

                                    1 Reply Last reply
                                    0
                                    • R Offline
                                      R Offline
                                      Raman
                                      wrote on last edited by
                                      #18

                                      This is really informative.

                                      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