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. QML: Image not showing from resource file
QtWS25 Last Chance

QML: Image not showing from resource file

Scheduled Pinned Locked Moved Solved QML and Qt Quick
7 Posts 3 Posters 891 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.
  • M Offline
    M Offline
    MyNameIsRichard
    wrote on last edited by
    #1

    With a very simple project images from a resource file are not showing on the controls.

    QtCreator information

    Qt Creator 11.0.3
    Based on Qt 6.4.3 (GCC 10.3.1 20210422 (Red Hat 10.3.1-1), x86_64)
    
    Built on Sep 27 2023 06:36:40
    
    From revision 68359f96a9
    

    My Main.qml

    import QtQuick
    import QtQuick.Window
    import QtQuick.Controls
    import QtQuick.Layouts
    
    ApplicationWindow {
        width: 640
        height: 480
        visible: true
        title: qsTr("Daily Pics")
    
        header: ToolBar {
            height: 50
    
            RowLayout {
                spacing: 20
                anchors.fill: parent
    
                ToolButton {
                    icon.source: "qrc:///images/drawer.png"
                }
            }
        }
    }
    

    My resource.qrc

    <RCC>
        <qresource prefix="/">
            <file>images/drawer.png</file>
        </qresource>
    </RCC>
    
    

    The image exists in the images folder

    J.HilkJ 1 Reply Last reply
    0
    • M MyNameIsRichard

      With a very simple project images from a resource file are not showing on the controls.

      QtCreator information

      Qt Creator 11.0.3
      Based on Qt 6.4.3 (GCC 10.3.1 20210422 (Red Hat 10.3.1-1), x86_64)
      
      Built on Sep 27 2023 06:36:40
      
      From revision 68359f96a9
      

      My Main.qml

      import QtQuick
      import QtQuick.Window
      import QtQuick.Controls
      import QtQuick.Layouts
      
      ApplicationWindow {
          width: 640
          height: 480
          visible: true
          title: qsTr("Daily Pics")
      
          header: ToolBar {
              height: 50
      
              RowLayout {
                  spacing: 20
                  anchors.fill: parent
      
                  ToolButton {
                      icon.source: "qrc:///images/drawer.png"
                  }
              }
          }
      }
      

      My resource.qrc

      <RCC>
          <qresource prefix="/">
              <file>images/drawer.png</file>
          </qresource>
      </RCC>
      
      

      The image exists in the images folder

      J.HilkJ Offline
      J.HilkJ Offline
      J.Hilk
      Moderators
      wrote on last edited by
      #2

      @MyNameIsRichard try less slashes :D or more simply:

      right click on the drawer.png in your projects view, select: copy url,
      paste that url as source, profit


      Be aware of the Qt Code of Conduct, when posting : https://forum.qt.io/topic/113070/qt-code-of-conduct


      Q: What's that?
      A: It's blue light.
      Q: What does it do?
      A: It turns blue.

      M 1 Reply Last reply
      0
      • J.HilkJ J.Hilk

        @MyNameIsRichard try less slashes :D or more simply:

        right click on the drawer.png in your projects view, select: copy url,
        paste that url as source, profit

        M Offline
        M Offline
        MyNameIsRichard
        wrote on last edited by
        #3

        @J-Hilk What I found online showed three slashes so today I learned about copy URL. It made no difference though, the image is still not showing. I even deleted the build directory, just in case...

        J.HilkJ 1 Reply Last reply
        0
        • M MyNameIsRichard

          @J-Hilk What I found online showed three slashes so today I learned about copy URL. It made no difference though, the image is still not showing. I even deleted the build directory, just in case...

          J.HilkJ Offline
          J.HilkJ Offline
          J.Hilk
          Moderators
          wrote on last edited by
          #4

          @MyNameIsRichard I think you have to give your button a height and width or use the Layout.preferredWidth properties


          Be aware of the Qt Code of Conduct, when posting : https://forum.qt.io/topic/113070/qt-code-of-conduct


          Q: What's that?
          A: It's blue light.
          Q: What does it do?
          A: It turns blue.

          M 1 Reply Last reply
          0
          • J.HilkJ J.Hilk

            @MyNameIsRichard I think you have to give your button a height and width or use the Layout.preferredWidth properties

            M Offline
            M Offline
            MyNameIsRichard
            wrote on last edited by
            #5

            @J-Hilk Still no difference I'm afraid. The button's hover effect shows up and it's clickable, just no image :(

            1 Reply Last reply
            0
            • MarkkyboyM Offline
              MarkkyboyM Offline
              Markkyboy
              wrote on last edited by
              #6

              I note you are using QT6 ( I gave up when I couldn't even get a drop shadow to show on a rectangle), but along the way, I found this video; https://www.youtube.com/watch?v=UDCRQiMMiZ4 this helped me at least get images to display.

              Don't just sit there standing around, pick up a shovel and sweep up!

              I live by the sea, not in it.

              M 1 Reply Last reply
              0
              • M MyNameIsRichard has marked this topic as solved on
              • MarkkyboyM Markkyboy

                I note you are using QT6 ( I gave up when I couldn't even get a drop shadow to show on a rectangle), but along the way, I found this video; https://www.youtube.com/watch?v=UDCRQiMMiZ4 this helped me at least get images to display.

                M Offline
                M Offline
                MyNameIsRichard
                wrote on last edited by
                #7

                @Markkyboy That provided the solution.

                Add the following to CMakeLists.txt

                set(CMAKE_AUTOMOC ON)
                set(CMAKE_AUTORCC ON)
                
                1 Reply Last reply
                1

                • Login

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