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. cell index of tableview on click
Forum Updated to NodeBB v4.3 + New Features

cell index of tableview on click

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

    Hi everyone,
    I managed to get it. Here is a piece of my code.

        TableView {
                id: logslist
                anchors.fill: parent
                anchors.topMargin: header.height
                columnSpacing: 0
                rowSpacing: 0
                clip: true
                model: ChangesTableModel {}
                boundsBehavior: Flickable.StopAtBounds
                onWidthChanged: logslist.forceLayout()
                MouseArea {
                    anchors.fill: parent
                    onClicked: {
                        console.log(logslist.cellAtPos(mouseX, mouseY))
                    }
                }
                columnWidthProvider: function (column) {
                    return Math.max(80, logslist.model ? logslist.width/logslist.model.columnCount() : 0)
                }
        
                delegate: Rectangle {
                    id:mycell
                    implicitWidth: logslist.columnWidthProvider(column)
                    implicitHeight: celltext.height
                    border.color: "gray"
                    border.width: 1
                    color: choosenTheme < 1 ? "white" : "#303030"
                    //color: (heading === true) ? "red" : "green"
                    Text {
                        id: celltext
                        padding: 2
                        text: tabledata
                        verticalAlignment: Text.AlignVCenter
                        elide: Text.ElideRight
                        color: choosenTheme < 1 ? "black" : "white"
                        font.pixelSize: 12
                    }
                }
                ScrollBar.vertical: ScrollBar {}
                ScrollBar.horizontal: ScrollBar {}
            }
    

    The key is this line: console.log(logslist.cellAtPos(mouseX, mouseY))

    It returns the correct values as long as I don't scroll the table view. When I scroll it then the result is -1, -1. Accoring to Qt documentaction:

    "Returns the cell at the given position in the view. If no cell intersects with position, the return value will be point(-1, -1)"

    Any advice how to solve it?

    1 Reply Last reply
    0
    • R Offline
      R Offline
      Rocky Plantchair
      wrote on last edited by
      #3

      Hi, I solved the problem in a different way. I past my code, if it can help anybody.

      import QtQuick
      import QtQuick.Controls 2.15
      import QtQuick.Layouts 1.15
      import QtQuick.Controls.Material 2.15
      import ChangesTableModel 1.0
      
      Item {
          id: mainview
          anchors.fill: parent
      
          Row {
              id: header
              width: logslist.contentWidth
              height: 50
              x: -logslist.contentX
              z: 1
              spacing: 0
              Repeater {
                  model: ["Here", "are", "my", "headers", ":-)"]
                  Rectangle {
                      width: 80
                      height: parent.height
                      color: "orange"
                      Text {
                          anchors.centerIn: parent
                          wrapMode: Text.WrapAtWordBoundaryOrAnywhere
                          text: modelData
                      }
                  }
              }
          }
          TableView {
              id: logslist
              anchors.fill: parent
              anchors.topMargin: header.height
              columnSpacing: 0
              rowSpacing: 0
              clip: true
              model: ChangesTableModel {}
              boundsBehavior: Flickable.StopAtBounds
              onWidthChanged: logslist.forceLayout()
              columnWidthProvider: function (column) {return 80}
      
              delegate: Rectangle {
                  id:mycell
                  implicitWidth: logslist.columnWidthProvider(column)
                  implicitHeight: celltext.height
                  border.color: "gray"
                  border.width: 1
                  color: choosenTheme < 1 ? "white" : "#303030"
                  //color: (heading === true) ? "red" : "green"
                  Text {
                      id: celltext
                      padding: 2
                      text: tabledata
                      verticalAlignment: Text.AlignVCenter
                      elide: Text.ElideRight
                      color: choosenTheme < 1 ? "black" : "white"
                      font.pixelSize: 12
                  }
                  MouseArea {
                      anchors.fill: parent
                      onClicked: {
                          console.log("cell[" + mycell.x / mycell.implicitWidth + ","
                                      + mycell.y / mycell.implicitHeight + "]")
                      }
                  }
              }
              ScrollBar.vertical: ScrollBar {}
              ScrollBar.horizontal: ScrollBar {}
          }
      }
      

      The solution was to move the MouseArea from the TableView to the delegate: Rectangle and then calculate the cell from their position and with and height.

      1 Reply Last reply
      1
      • R Offline
        R Offline
        Rocky Plantchair
        wrote on last edited by Rocky Plantchair
        #2
        This post is deleted!
        1 Reply Last reply
        0
        • R Offline
          R Offline
          Rocky Plantchair
          wrote on last edited by
          #3

          Hi, I solved the problem in a different way. I past my code, if it can help anybody.

          import QtQuick
          import QtQuick.Controls 2.15
          import QtQuick.Layouts 1.15
          import QtQuick.Controls.Material 2.15
          import ChangesTableModel 1.0
          
          Item {
              id: mainview
              anchors.fill: parent
          
              Row {
                  id: header
                  width: logslist.contentWidth
                  height: 50
                  x: -logslist.contentX
                  z: 1
                  spacing: 0
                  Repeater {
                      model: ["Here", "are", "my", "headers", ":-)"]
                      Rectangle {
                          width: 80
                          height: parent.height
                          color: "orange"
                          Text {
                              anchors.centerIn: parent
                              wrapMode: Text.WrapAtWordBoundaryOrAnywhere
                              text: modelData
                          }
                      }
                  }
              }
              TableView {
                  id: logslist
                  anchors.fill: parent
                  anchors.topMargin: header.height
                  columnSpacing: 0
                  rowSpacing: 0
                  clip: true
                  model: ChangesTableModel {}
                  boundsBehavior: Flickable.StopAtBounds
                  onWidthChanged: logslist.forceLayout()
                  columnWidthProvider: function (column) {return 80}
          
                  delegate: Rectangle {
                      id:mycell
                      implicitWidth: logslist.columnWidthProvider(column)
                      implicitHeight: celltext.height
                      border.color: "gray"
                      border.width: 1
                      color: choosenTheme < 1 ? "white" : "#303030"
                      //color: (heading === true) ? "red" : "green"
                      Text {
                          id: celltext
                          padding: 2
                          text: tabledata
                          verticalAlignment: Text.AlignVCenter
                          elide: Text.ElideRight
                          color: choosenTheme < 1 ? "black" : "white"
                          font.pixelSize: 12
                      }
                      MouseArea {
                          anchors.fill: parent
                          onClicked: {
                              console.log("cell[" + mycell.x / mycell.implicitWidth + ","
                                          + mycell.y / mycell.implicitHeight + "]")
                          }
                      }
                  }
                  ScrollBar.vertical: ScrollBar {}
                  ScrollBar.horizontal: ScrollBar {}
              }
          }
          

          The solution was to move the MouseArea from the TableView to the delegate: Rectangle and then calculate the cell from their position and with and height.

          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