Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

ChartView keyboard events



  • Hi,

    I want to implement zooming/scrolling functionality on my use of ChartView and would like to provide the option of keyboard control. How to I detect a keyboard event on a ChartView?

    I tried the probably naive approach of adding a Keys.onPressed handler to the ChartView but it does not get triggered. Unlike an Item, ChartView has no focus property, so I tried overlaying a transparent rectangle on the ChartView, setting focus: true on it and moving the keyboard event handler to the rectangle instead, but still no luck. Frustratingly the documentation for ChartView.scrollDown (for example) says "This is a convenience method suitable for key navigation, for example", which suggests that it should be possible.

    Thanks in advance for any tips.



  • I use separate input controls like RangeSlider QML Type for my axis config's.

    I also have a wrapper MouseArea that I use for Key inputs to interact with that, not my chart.
    I manually give and take focus according to the mouse, so keys don't interact after you've left the chart (MouseArea ) region.:

    MouseArea {
                   id: itemMouseArea   ;
                   anchors.fill: parent;
                   propagateComposedEvents: true
                   hoverEnabled: true  ;
                   onEntered: {
                       forceActiveFocus()
                   }
                   onExited: {
                       if (configVisible === false) {
                           itemMouseArea.focus = false;
                       }
                   }
                   Keys.onPressed: {
                       if (event.key === Qt.Key_Left) {
                           row.updateShared(++slider.value);
                       }
                       if (event.key === Qt.Key_Right) {
                           if ( slider.value > 1){
                               row.updateShared(--slider.value);
                           }
                       }
                       event.accepted = true;
                   }
               }
    


  • I use separate input controls like RangeSlider QML Type for my axis config's.

    I also have a wrapper MouseArea that I use for Key inputs to interact with that, not my chart.
    I manually give and take focus according to the mouse, so keys don't interact after you've left the chart (MouseArea ) region.:

    MouseArea {
                   id: itemMouseArea   ;
                   anchors.fill: parent;
                   propagateComposedEvents: true
                   hoverEnabled: true  ;
                   onEntered: {
                       forceActiveFocus()
                   }
                   onExited: {
                       if (configVisible === false) {
                           itemMouseArea.focus = false;
                       }
                   }
                   Keys.onPressed: {
                       if (event.key === Qt.Key_Left) {
                           row.updateShared(++slider.value);
                       }
                       if (event.key === Qt.Key_Right) {
                           if ( slider.value > 1){
                               row.updateShared(--slider.value);
                           }
                       }
                       event.accepted = true;
                   }
               }
    


  • @6thC Thank you!

    I already had a MouseArea on the plot area of my ChartView but I hadn't thought to try to handle key events there. I think the idea of using the mouse enter and exit handlers to manually manage the focus - and in particular the forceActiveFocus call - were what I was missing and what I needed.


Log in to reply