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. QT 5.8.0-1: QML ListView does not receive focus with TAB
Forum Updated to NodeBB v4.3 + New Features

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

Scheduled Pinned Locked Moved Solved QML and Qt Quick
4 Posts 2 Posters 1.7k 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.
  • AnatolySA Offline
    AnatolySA Offline
    AnatolyS
    wrote on last edited by
    #1

    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
                                    }
                                }
                            }
    
                        }
    
                    }
                }
            }
        }
    
    }
    
    1 Reply Last reply
    0
    • jpnurmiJ Offline
      jpnurmiJ Offline
      jpnurmi
      wrote on last edited by
      #2

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

      AnatolySA 1 Reply Last reply
      4
      • AnatolySA Offline
        AnatolySA Offline
        AnatolyS
        wrote on last edited by
        #3
        This post is deleted!
        1 Reply Last reply
        0
        • jpnurmiJ jpnurmi

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

          AnatolySA Offline
          AnatolySA Offline
          AnatolyS
          wrote on last edited by
          #4

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

          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