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. Is there a way to pass variables between GridView and Component(delegate)?
Forum Updated to NodeBB v4.3 + New Features

Is there a way to pass variables between GridView and Component(delegate)?

Scheduled Pinned Locked Moved QML and Qt Quick
5 Posts 3 Posters 2.4k Views 1 Watching
  • 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.
  • F Offline
    F Offline
    franziss
    wrote on last edited by
    #1

    Dear all, I seek your kind help in my problem. I have a grid view of icons, and when I click one of the icons, I will create a copy of the clicked icon.
    I need to know which icon I am selecting. But under mediaIconDelegate, MouseArea, the function grid1.indexAt does not work, and always produce 0 as result.

    Thank you for your help.

    @
    Component {
    id: mediaIconDelegate
    Item {
    width: grid1.cellWidth; height: grid1.cellHeight
    Column {
    anchors.fill: parent
    Image { source: portrait; anchors.horizontalCenter: parent.horizontalCenter;
    width: 64; height: 64
    }
    Text { text: name; anchors.horizontalCenter: parent.horizontalCenter }
    }

               MouseArea {
                   id: iconMouseArea
                   anchors.fill: parent
                   width: 64
                   height: 64
                   hoverEnabled: true
    
                   onEntered: {
        console.log(grid1.indexAt(mouseX, mouseY)); // this does not work, it always output 0
                       var iconObj = Qt.createComponent("icon.qml");
                       iconObj.createObject(parent);
                   }                   
               }
           }
       }
    
       GridView {
           id: grid1
           anchors.fill: parent
           cellWidth: 64; cellHeight: 64
    
           model: MediaIconModel {id:mediaIconModel}    
           delegate: mediaIconDelegate
       }
    

    @

    1 Reply Last reply
    0
    • C Offline
      C Offline
      Chuck Gao
      wrote on last edited by
      #2

      You can find a property named "currentIndex" there

      You can try this one:

      @GridView {
      id: grid1
      anchors.fill: parent
      cellWidth: 64; cellHeight: 64
      onCurrentIndexChanged: {
      // Do something
      }

      model: MediaIconModel {id:mediaIconModel}   
      delegate: mediaIconDelegate
      

      }@

      Chuck

      1 Reply Last reply
      0
      • C Offline
        C Offline
        Chuck Gao
        wrote on last edited by
        #3

        It's also basic but important to know QML's property binding feature :-) . Most of(I'm not sure if it's all) the properties will bind to onPROPERTY_NAMEChanged slot.

        Chuck

        1 Reply Last reply
        0
        • T Offline
          T Offline
          thisisbhaskar
          wrote on last edited by
          #4

          And unfortunately your delegate component should set currentIndex

              MouseArea {
                  id: iconMouseArea
                  .........................
                  onClicked: {
                        grid1.currentIndex = index // this sets currentIndex of grid1 to the item
                                                                  // on which we have clicked. This becomes 
                                                                  // currently selected item now
                      
                       if(GridView.isCurrentIndex) { // this will return true if this is currently selected item
                                  // create your icon here.
                        }
                  }
          
          1 Reply Last reply
          0
          • F Offline
            F Offline
            franziss
            wrote on last edited by
            #5

            Hi Chuck and thisisbhaskar,

            Thank you for your advice and help, now I can solve my problem. :)

            @
            MouseArea {
            id: iconMouseArea
            anchors.fill: parent
            width: 64
            height: 64
            hoverEnabled: true

                    onEntered: {
                       console.log(index); // this work! can use index
                        var iconObj = Qt.createComponent("icon.qml");
                        iconObj.createObject(parent);
                    }                  
                }
            

            @

            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