QT 5.8.0-1: QML ListView does not receive focus with TAB



  • Hello!

    I have simple application with two pages. When I pushed on the page2 page, I expect that I can traverse focus through TextField, Button, ListView, ToolButton with the TAB key. But actually the focus is traversing through TextField, Button, ToolButton in circle without visiting ListView. What is wrong and how it can be fixed? Thank you in advance!
    Here is the minimal code which reproduce the problem:

    import QtQuick 2.7
    import QtQuick.Controls 2.0
    import QtQuick.Layouts 1.0
    
    ApplicationWindow {
        visible: true
        width: 640
        height: 480
        title: qsTr("Hello World")
        onActiveFocusItemChanged: console.log("active focus: ", activeFocusItem)
        header : ToolBar {
            leftPadding: 20
            rightPadding: 20
            RowLayout {
                anchors.fill: parent
                Label {
                    text: stackView.currentItem.title
                    Layout.columnSpan: 1
                    Layout.rowSpan: 1
                    horizontalAlignment: Qt.AlignLeft
                    verticalAlignment: Qt.AlignVCenter
                    Layout.fillWidth: true
                }
    
                ToolButton {
                    text: "Exit"
                    onClicked: {
                        console.log("exit")
                    }
                }
            }
        }
    
        StackView {
            objectName: 'stackView'
            id: stackView
            anchors.fill: parent
            initialItem:  page1
            onCurrentItemChanged: {
                console.log("changed")
                currentItem.forceActiveFocus()
    
            }
            Component {
                id: page1
                Item {
                    objectName: 'pushButtonContainer'
                    Button {
                        objectName: 'pushButton'
                        text: "PUSH"
                        onClicked: stackView.push(page2)
                    }
                }
            }
            Component {
                id: page2
                FocusScope {
                    property alias listView: listView
    
                    ColumnLayout {
                        id: columnLayout
                        anchors.fill: parent
    
                        RowLayout {
                            id: rowLayout
                            x: 29
                            y: 18
                            width: 100
                            height: 100
                            Layout.fillWidth: true
    
                            TextField {
                                focus: true
                                id: textField
                                text: qsTr("Text Field")
                                Layout.fillWidth: true
                            }
    
                            Button {
                                id: button
                                focus: true
                                text: qsTr("Button")
                            }
                        }
    
                        ListView {
                            id: listView
                            Layout.fillHeight: true
                            Layout.fillWidth: true
                            focus: true
                            clip: true
                            snapMode: ListView.SnapOneItem
                            ScrollIndicator.vertical: ScrollIndicator {}
                            model: ListModel {
                                ListElement {
                                    contind: "IVII"
                                    mwhouseid_number: '123455'
                                    district: '1'
                                    line: '2'
                                    slot: '3'
                                    layer: '4'
                                }
                                ListElement {
                                    contind: "DDDD"
                                    mwhouseid_number: '343434'
                                    district: '1'
                                    line: '2'
                                }
                            }
                            delegate: FocusScope {
                                focus: true
                                width: parent.width
                                height: 40
                                Row {
                                    spacing: 10
                                    anchors.verticalCenter: parent.verticalCenter
                                    Text {
                                        text: (model.district ? model.district : '') + "-" + (model.line ? model.line : '') + "-" + (model.slot ? model.slot : '') + "-" + (model.layer ? model.layer : '')
                                        width: 100
                                    }
                                    Text {
                                        text: model.contind + "-" + model.mwhouseid_number
                                        width: 100
                                    }
                                }
                            }
    
                        }
    
                    }
                }
            }
        }
    
    }


  • Set activeFocusOnTab: true on the items you want to enable tab navigation for.



  • This post is deleted!


  • @jpnurmi thank you so much! it works! you saved my day!


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.