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



  • 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 .



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



  • 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! */
    }
    } @



  • 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"@



  • [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 ?



  • 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 ?



  • 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



  • 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.



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



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



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



  • 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:).



  • thanks , Volker



  • 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"



  • 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);
    @



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



  • @leon.anavi the link is no longer valid!


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.