Uploaded image for project: 'Qt'
  1. Qt
  2. QTBUG-103499

Android a11y: Flickable items outside of view are not selectable

    XMLWordPrintable

Details

    • Bug
    • Resolution: Unresolved
    • P3: Somewhat important
    • None
    • 5.15.2, 6.3.0
    • None
    • Tested on Android 11 (Samsung S20), Qt 5.15.2 and Qt 6.3.0.
    • Android

    Description

      QML Flickable cannot be used in an accessible way with Android TalkBack and iOS VoiceOver. Only the currently visible items are cycled through when swiping to next/previous items. Hidden items above or below the currently shown items are ignored.

      Expected behavior: When swiping to the next item while focusing the last visible item in a Flickable component the next hidden focusable item gets focused. The flickable view scrolls to the new focused item.

      I think the problems lies in qtdeclarative/src/qtquick/accessibility. accessibleUnignoredChildren() in QAccessibleQuickItem extracts the a11y-hierarchy by recursively traversing all children of QQuickItem. In the case of Flickable this may be the wrong approach: "Items declared as children of a Flickable are automatically parented to the Flickable's contentItem. This should be taken into account when operating on the children of the Flickable; it is usually the children of contentItem that are relevant." (https://doc.qt.io/qt-6/qml-qtquick-flickable.html)

      QML Example:

       

      import QtQuick 2.0
      import QtQuick.Window 2.12
      
      Window {
          width: 400
          height: 600
          visible: true
      
      Rectangle {
              id: container
              width: 500
              height: 400
              color: "#343434"
      
              Flickable {
                  id: flickable
                  height: parent.height
                  width: parent.width
                  anchors.bottom: parent.bottom
      
                  contentWidth: content.width
                  contentHeight: content.height
      
                  Column {
                      id: content
                      width: parent.width
      
                      Rectangle {
                          height: 500
                          width: 200
                          color: "#FF0000"
                          Accessible.name: "Rect1"
                          Accessible.role: Accessible.StaticText
                          Accessible.focusable: true
                      }
      
                      Rectangle {
                          height: 500
                          width: 200
                          color: "#00FF00"
                          Accessible.name: "Rect2"
                          Accessible.role: Accessible.StaticText
                          Accessible.focusable: true
                      }
      
                      Rectangle {
                          height: 500
                          width: 200
                          color: "#0000FF"
                          Accessible.name: "Rect3"
                          Accessible.role: Accessible.StaticText
                          Accessible.focusable: true
                      }
                  }
              }
          }
      }
      

       

      Attachments

        Issue Links

          For Gerrit Dashboard: QTBUG-103499
          # Subject Branch Project Status CR V

          Activity

            People

              smd Jan Arve
              jtrillma Jens Trillmann
              Votes:
              1 Vote for this issue
              Watchers:
              3 Start watching this issue

              Dates

                Created:
                Updated: