Qt World Summit: Submit your Presentation

Set Focus on TextInput in Table

  • Hello everyone,

    I have a table which can contain a TextInput or a ComboBox in a Column and I want to 'tab' through these rows and input my data. How can i force the table to only give focus to the TextInput or Comboboxes instead of the whole row?
    Weirdly enough, if I click into each TextInput once, the behavior is nearly what i want, I can navigate through the inputs with the key arrows up and down, I'm guessing the row "remembers" the last focused item.

    Here is how the table looks (only the 'Value' column is editable):

    Here is the code for the TextInput:

    import QtQuick 2.0
    import ".."
    FocusScope {
        property alias text: textInput.text
        property alias font: textInput.font
        x: rectangle.x; y: rectangle.y
        width: rectangle.width; height: rectangle.height
        Rectangle {
            id: rectangle
            anchors.fill: parent
            border.color: Style.table.itemBorderColor
            color: textInput.activeFocus ? "lightgray" : "white"
            TextInput {
                id: textInput
                focus: true
                anchors.left: parent.left
                anchors.right: parent.right
                anchors.verticalCenter: parent.verticalCenter
                anchors.leftMargin: 5
                anchors.rightMargin: 5
                color: parent.enabled ? "grey" : ""
                selectByMouse: true
                enabled: parent.enabled
                clip: true
                font.pixelSize: Style.fontSize

    Here's a abbreviated version on how the table loads the delegate:

    StepTableView {
        TableViewColumn {
            id: tcValue
            role: "value"
            title: qsTr("Value")
            delegate:   Component {
                Loader {
                    sourceComponent: {
                        // can happen if the model has not loaded yet
                        if (model === undefined || model === null || parent === null ) {
                        return Qt.createQmlObject("import QtQuick 2.0;" +
                                                  "Component {" +
                                                  "Item { Component.onCompleted: loadComponent(this, model, styleData)}}", parent);

  • I answered my own question here: https://stackoverflow.com/a/48147366/9181049

Log in to reply