Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. How to insert loaded components from separate file into a Grid in QML?

How to insert loaded components from separate file into a Grid in QML?

Scheduled Pinned Locked Moved Solved General and Desktop
qml componentsarrange in grid
4 Posts 3 Posters 1.3k 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.
  • A Offline
    A Offline
    Alper
    wrote on 14 May 2016, 09:58 last edited by
    #1

    i have a code here that loads component from separate qml file into main.qml.
    i created a grid to contain loaded component:

        Grid {
            id: scr
            width: 900
            height: parent.height
            x: 0
            y:0       
        }
    

    the qml code to load component:

                var component = Qt.createComponent("qrc:/MyFile.qml");
                var object  = component.createObject(scr,{"objectName": "someID"});
    

    the component loads several times, i want it to arrange in grid, but it doesn't.

    Thanks in advance

    P 1 Reply Last reply 14 May 2016, 10:33
    0
    • A Alper
      14 May 2016, 09:58

      i have a code here that loads component from separate qml file into main.qml.
      i created a grid to contain loaded component:

          Grid {
              id: scr
              width: 900
              height: parent.height
              x: 0
              y:0       
          }
      

      the qml code to load component:

                  var component = Qt.createComponent("qrc:/MyFile.qml");
                  var object  = component.createObject(scr,{"objectName": "someID"});
      

      the component loads several times, i want it to arrange in grid, but it doesn't.

      Thanks in advance

      P Offline
      P Offline
      p3c0
      Moderators
      wrote on 14 May 2016, 10:33 last edited by
      #2

      @Alper The posted code looks fine. What's in MyFile.qml ?
      Do you get any errors ?

      157

      1 Reply Last reply
      1
      • ? Offline
        ? Offline
        A Former User
        wrote on 14 May 2016, 10:42 last edited by
        #3

        Hi! This works for me:

        main.qml

        import QtQuick 2.6
        import QtQuick.Window 2.2
        
        Window {
            id: mainWindow
            visible: true
        
            property int globalId: 0
        
            signal ready(int gid)
        
            Grid {
                id: grid
                anchors.fill: parent
            }
        
            MouseArea {
                anchors.fill: parent
                onClicked: {
                    var component = Qt.createComponent("qrc:///MyFile.qml");
                    var object  = component.createObject(grid, {"objectName":"someIdentifier_"+(globalId++)} );
                    ready(globalId)
                }
            }
        }
        

        MyFile.qml

        import QtQuick 2.0
        
        Rectangle {
            width: 50
            height: 50
            color: "blue"
        
            function saySomething() {
                console.log("something")
            }
        }
        
        A 1 Reply Last reply 14 May 2016, 10:46
        1
        • ? A Former User
          14 May 2016, 10:42

          Hi! This works for me:

          main.qml

          import QtQuick 2.6
          import QtQuick.Window 2.2
          
          Window {
              id: mainWindow
              visible: true
          
              property int globalId: 0
          
              signal ready(int gid)
          
              Grid {
                  id: grid
                  anchors.fill: parent
              }
          
              MouseArea {
                  anchors.fill: parent
                  onClicked: {
                      var component = Qt.createComponent("qrc:///MyFile.qml");
                      var object  = component.createObject(grid, {"objectName":"someIdentifier_"+(globalId++)} );
                      ready(globalId)
                  }
              }
          }
          

          MyFile.qml

          import QtQuick 2.0
          
          Rectangle {
              width: 50
              height: 50
              color: "blue"
          
              function saySomething() {
                  console.log("something")
              }
          }
          
          A Offline
          A Offline
          Alper
          wrote on 14 May 2016, 10:46 last edited by
          #4

          @Wieland Wow.. Thanks!

          1 Reply Last reply
          0

          2/4

          14 May 2016, 10:33

          • Login

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