QML WebView keyboard focus



  • Hello,

    I' m want to use a QML WebView in an application which is controlled only via a keyboard (a remote control). No mouse, no touchscreen.
    Page navigation must be handled via tab key and later via spatial navigation.

    I can make a WebView object and give it keyboard focus but when i press the tab key, nothing happens. Only after clicking via a mouse, a link on the webpage, keys are handled and the WebView object indicates it has no longer active focus.

    Does somebody now how to give keyboard focus to the webpage without using a mouse event. ? I Googled on the subject but couldn't find any hints.

    Kind regard

    Theo van der Weijst



  • How are you giving it keyboard focus, how do you check it has focus? Could you post some code fragments?

    I would imagine the webpage inside the webview frame is getting the focus after the mouseclick, you could try to call element.focus in your HTML somewhere, possibly in onload or something similar.

    Check the mdc on "element.focus":https://developer.mozilla.org/en/DOM/element.focus



  • This is my test code.

    The tab key is only handled by the browser after selecting a link with a mouse click. The Webview object focus becomes false in that case.

    import Qt 4.7
    import QtWebKit 1.0

    FocusScope {
    width: 1280
    height: 600
    focus: true

    WebView {
        id: web_view1
        x: 35
        y: 20
        width: 1280
        height: 600
        url: "http://www.google.com"
        focus: true
        onActiveFocusChanged:{
            console.log("Focus = "+ focus);
        }
        Keys.onPressed:{
            console.log("Key pressed");                 
        }
    }


  • width: 1280 height: 600 focus: true WebView { id: web_view1 x: 35 y: 20 width: 1280 height: 600 url: ”http://www.google.com” focus: true onActiveFocusChanged:{ console.log(“Focus = ”+ focus); } Keys.onPressed:{ console.log(“Key pressed”); } }


  • Moderators

    TheoVanDerWeijst: Could you please use @ to mark up your code (or use the leftmost icon in the post a reply editor? It makes code so much easier to read. Thanks!



  • Hi, Thanks for the tip. I didn't see the "code" icon.

    I did some more experimenting and it seems that key navigation is working as wanted when the Webview object is NOT part of the FocusScope.

    @
    import Qt 4.7
    import QtWebKit 1.0

    FocusScope {
    width: 1280
    height: 600
    focus: true

    WebView {
    id: web_view1
    x: 35
    y: 20
    width: 1280
    height: 600
    url: ”http://www.google.com
    focus: true
    onActiveFocusChanged:{
    console.log(“Focus = ”+ focus);
    }
    Keys.onPressed:{
    console.log(“Key pressed”);
    }
    }
    }
    @


Log in to reply
 

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