WebEngineView获取文本输入焦点

发布于 2025-01-26 09:17:17 字数 71 浏览 5 评论 0原文

如何检测使用QML WebEngineView显示的网页上的文本字段(输入)?

我需要此信息来显示/隐藏虚拟键盘。

How can I detect focus on the text field (input) on the webpage displayed using QML WebEngineView?

I need this information to display/hide the virtual keyboard.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

谎言 2025-02-02 09:17:17

要通过QML WebEngineView 将文本输入重点关注所需的网页是使用 webChannel 并在您的网页上运行一些JS代码。您无需修改​​页面源。

QML侧:

import QtWebEngine 1.5
import QtWebChannel 1.0
...
QtObject{
    id: someObject
    WebChannel.id: "backend"

    function showKeyboard() {
        console.log("Show the keyboard");
        inputEngine.showLiteralKeyboard = true
    }
    function hideKeyboard() {
        console.log("Hide the keyboard");
        inputEngine.hide()
    }
}

WebEngineView{
    id: webview
    url: "https://your-webpage.com/"
    anchors.fill: parent
    settings.javascriptEnabled: true
    webChannel: channel

    onLoadingChanged: {
        if(loadRequest.status === WebEngineView.LoadSucceededStatus){
            webview.runJavaScript(systemManager.qwebchannelSource())
            webview.runJavaScript("
                new QWebChannel(qt.webChannelTransport, function(channel){
                    var backend = channel.objects.backend;
                    var inputs = document.getElementsByTagName('input');
                    var index;

                    for(index=0; index < inputs.length; index++)
                    {
                        inputs[index].onfocus = function(){
                            backend.showKeyboard()
                        };
                        inputs[index].onblur = function(){
                            backend.hideKeyboard()
                        }
                    }
                })")
        }
    }
}

WebChannel{
    id: channel
    registeredObjects: [someObject]
}
...

SystemManager.cpp:包含加载和暴露QwebChannel.js来源的功能:

...
QString SystemManager::qwebchannelSource()
{
    QFile qwebchannelFile(":/qtwebchannel/qwebchannel.js");     // Load the JS API from the resources
    if(!qwebchannelFile.open(QIODevice::ReadOnly)){
        qDebug()<<"Couldn't load Qt's QWebChannel API!";
    }

    QString scriptSource = QString::fromLatin1(qwebchannelFile.readAll());
    qwebchannelFile.close();

    return scriptSource;
}
...

systemmanager.h标头exter ext and each函数:

...
Q_INVOKABLE QString qwebchannelSource();
...

注意: systemmanager 对象必须为暴露于qml

To getting text input focus on the webpage displayed via QML WebEngineView required is use WebChannel and run some js code on your webpage. You don't need to modify the page source.

QML side:

import QtWebEngine 1.5
import QtWebChannel 1.0
...
QtObject{
    id: someObject
    WebChannel.id: "backend"

    function showKeyboard() {
        console.log("Show the keyboard");
        inputEngine.showLiteralKeyboard = true
    }
    function hideKeyboard() {
        console.log("Hide the keyboard");
        inputEngine.hide()
    }
}

WebEngineView{
    id: webview
    url: "https://your-webpage.com/"
    anchors.fill: parent
    settings.javascriptEnabled: true
    webChannel: channel

    onLoadingChanged: {
        if(loadRequest.status === WebEngineView.LoadSucceededStatus){
            webview.runJavaScript(systemManager.qwebchannelSource())
            webview.runJavaScript("
                new QWebChannel(qt.webChannelTransport, function(channel){
                    var backend = channel.objects.backend;
                    var inputs = document.getElementsByTagName('input');
                    var index;

                    for(index=0; index < inputs.length; index++)
                    {
                        inputs[index].onfocus = function(){
                            backend.showKeyboard()
                        };
                        inputs[index].onblur = function(){
                            backend.hideKeyboard()
                        }
                    }
                })")
        }
    }
}

WebChannel{
    id: channel
    registeredObjects: [someObject]
}
...

systemmanager.cpp: Contains function to load and expose qwebchannel.js source:

...
QString SystemManager::qwebchannelSource()
{
    QFile qwebchannelFile(":/qtwebchannel/qwebchannel.js");     // Load the JS API from the resources
    if(!qwebchannelFile.open(QIODevice::ReadOnly)){
        qDebug()<<"Couldn't load Qt's QWebChannel API!";
    }

    QString scriptSource = QString::fromLatin1(qwebchannelFile.readAll());
    qwebchannelFile.close();

    return scriptSource;
}
...

systemManager.h Header part with exposing function:

...
Q_INVOKABLE QString qwebchannelSource();
...

NOTE: The SystemManager object must be exposed to QML.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文