Question about selection in the new TableView QML type

winkle101

I am trying to isolate the specific cell selected when the user clicks on the table. I have a delegate set in my TableColumnView and it appears as though when a row is selected every column in that row is marked as selected. How do I determine which specific column was clicked?

I should also note that the reason I am not using MouseAreas or MouseEvents is because this is having a negative affect on my selection. For example, if my column delegate has a mouse area defined then the table never seems to receive a selection changed signal.

Jens

This is actually not currently supported by TableView. However it is not all that hard to do yourself. I made an example spreadsheet to give you an idea:

@import QtQuick 2.2
import QtQuick.Layouts 1.1
import QtQuick.Controls 1.1

TableView {
id: table

model: 100

width: 600
height: 400

TableViewColumn { }
TableViewColumn { }
TableViewColumn { }
TableViewColumn { }

property int currentColumn: 0

Keys.onRightPressed:
    if (currentColumn < table.columnCount - 1)
        currentColumn++;

Keys.onLeftPressed:
    if (currentColumn > 0)
        currentColumn--;

rowDelegate: Rectangle { // grid
    height: 20
    color: "#fff"
}

itemDelegate: Rectangle {
    property bool selected: styleData.row === table.currentRow && styleData.column === currentColumn
    color: "transparent"
    Rectangle {
        anchors.fill: parent
        color: selected  ? "#4488ee" : "transparent"
    }
    Label {
        id: label
        verticalAlignment: Text.AlignVCenter
        anchors.leftMargin: 4
        anchors.rightMargin: 4
        anchors.fill: parent
        elide: Text.ElideRight
        text: styleData.value
        color: selected ? "white" : "black"
    }
    Rectangle {
        anchors.right: parent.right
        height: parent.height ; width: 1
        color: selected ? "transparent" : "#eee"
    }
    Rectangle {
        width: parent.width ; height: 1
        color: selected ? "transparent" : "#eee"
    }

    MouseArea {
        anchors.fill: parent
        onClicked: {
            currentColumn = styleData.column
            currentRow = styleData.row
            table.forceActiveFocus();
        }
    }
}

}
@