get cursor position in WebEngineView qml

Question

I have a program in Qt and a WebEngineView in it .I want to when my user clicked on a inputbox in webEngine a keyboard have been loaded and the inputbox get its contents from my keyboard (i wrote my own keyboard) but i can't do it .i try codes in bellow but don't work

WebEngineView {
    anchors.fill:parent
    id:webEng
    url: "https://example.com"
    visible: true
    MouseArea {
        id : mousearea
        anchors.fill: parent
        onClicked: {
           mykeyboard.visible=true;
        }  
    }
}

This attempt looks a little strange. If you want to get event from a page element (inputbox in your case) why you write the code when you click on all the page? You should base the logic on Javascript event, from the page itself. Use WebChannel or maybe WebEngineScript for that. — folibis
@folibis sorry can you example some Javascript event that i can use it — zohee

Julien Déramond Julien Déramond · Accepted Answer · 2018-08-27T12:03:27

This is not a complete answer but this code could help:

import QtQuick 2.10
import QtWebView 1.1
import QtQuick.Controls 1.4
import QtWebEngine 1.7

Item {
    width: 1280
    height: 720

    WebView { // or WebEngineView {
        id: webview
        width: 1280
        height: 720
        url: "http://google.com"
        visible: true

        onLoadingChanged: {
            if (loadRequest.status === WebView.LoadSucceededStatus) {
                console.log("Loaded!!")

                webview.runJavaScript('
                    var input = document.getElementById("lst-ib");
                    input.addEventListener("click", function() {
                        alert("Clicked!");
                    });
                    '
                )
            }
        }
    }

    Rectangle {
        id: myDummyKeyboard
        anchors.bottom: parent.bottom
        width: parent.width
        height: 100
        color: "gray"
        visible: true
        border.width: 20
        Button {
            anchors.centerIn: parent
            text: "Dummy"
            onClicked: {
                webview.runJavaScript('document.getElementById("lst-ib").value += "' + text + '"');
            }
        }
    }
}

The part in the WebView (or WebEnginView) allows to display an alert when the input is clicked. But, something is missing, to link it to a QML handler. The solution is maybe to use WebChannel or maybe WebEngineScript as said by @folibis in the comments.
The part defined by myDummyKeyboard allows to add a string into the input when the user is clicking the button in the rectangle (fake keyboard).

get cursor position in WebEngineView qml

1 Answers