QtVirtualKeyboard使用平台WebGL冻结QML应用程序，但桌面工作正常。如何解冻或绕过它？

Question

长版本

我使用WebGL作为平台在浏览器中运行QML应用程序。一切都很好，直到我尝试集成QtVirtualKeyboard来填充一些文本字段和可编辑的组合框。在浏览器中运行项目时，收到的第一条消息是：

This plugin does not support dynamic OpenGL loading!

但是，我怀疑此错误消息/警告没有链接到VirtualKeyboard ( VK )，因为删除VK的所有痕迹并不会使消息消失。下面可以查看浏览器窗口的屏幕截图。

下一条消息发生在单击文本输入字段时：

This plugin does not support setting window masks

一半的屏幕保持黑色-这是在刷新时VK将被定位的区域。再来一次-下面的截图。

刷新后，还会出现三条消息。我将省略前两个键，因为它们基本上是在说“您按了Alt键和F5键”。第三个信息是：

requestActivate() called for  QtVirtualKeyboard::InputView(0x4a16590)  which has Qt::WindowDoesNotAcceptFocus set.

现在，keyboad是可见的，但是每次在VK上敲击一个键时，都会出现新的消息，而不会将文本写到textfield：

This plugin does not support setting window masks
This plugin does not support setting window masks
qt.virtualkeyboard: InputContext::sendKeyClick(): no focus to send key click - QGuiApplication::focusWindow() is: QtVirtualKeyboard::InputView(0x4a16590)
This plugin does not support setting window masks

除此之外，一旦项目处于这种状态，来自我的键盘的输入似乎就会被忽略。硬重置(关闭程序并重新启动)恢复功能，直到调用VK为止，刷新页面不会触发文本字段中的任何文本。我得到的最后一个视图如下：

我创造了一个最小的例子来说明这个问题。它是Qt 4.13.2创建的一个稍微修改过的空QML项目。

在桌面上运行它应该有效，如果项目收到命令行参数-platform webgl:port=80，就会出现问题行为。我使用的是MSVC2019 32位和QT5.15.1。这个问题在Microsoft 44.18362.387.0和Firefox 68.5.0esr (32位)中是可以重现的。

ChromeVersion86.0.4240.111 (64位)有点不同:当输入没有直接显示时，刷新网页之后进入内容。但是，最小化键盘不起作用，所以这不是解决方案。

# TestVirtualKeyboard.pro (autogenerated by QtCreator)
QT += quick virtualkeyboard

CONFIG += c++11

# You can make your code fail to compile if it uses deprecated APIs.
# In order to do so, uncomment the following line.
#DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000    # disables all the APIs deprecated before Qt 6.0.0

SOURCES += \
        main.cpp

RESOURCES += qml.qrc

# Additional import path used to resolve QML modules in Qt Creator's code model
QML_IMPORT_PATH =

# Additional import path used to resolve QML modules just for Qt Quick Designer
QML_DESIGNER_IMPORT_PATH =

# Default rules for deployment.
qnx: target.path = /tmp/$${TARGET}/bin
else: unix:!android: target.path = /opt/$${TARGET}/bin
!isEmpty(target.path): INSTALLS += target

// main.cpp
#include <QGuiApplication>
#include <QQmlApplicationEngine>

int main(int argc, char *argv[])
{
  qputenv("QSG_RENDER_LOOP", "threaded"); // Addendum for Windows, does not change the problematic behavior
  qputenv("QT_IM_MODULE", QByteArray("qtvirtualkeyboard"));

  QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);

  QGuiApplication app(argc, argv);

  QQmlApplicationEngine engine;
  const QUrl url(QStringLiteral("qrc:/main.qml"));
  QObject::connect(&engine, &QQmlApplicationEngine::objectCreated,
                   &app, [url](QObject *obj, const QUrl &objUrl) {
    if (!obj && url == objUrl)
      QCoreApplication::exit(-1);
  }, Qt::QueuedConnection);
  engine.load(url);

  return app.exec();
}

// main.qml
import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.VirtualKeyboard 2.15
import QtQuick.Controls 2.5

Window {
    id: window
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")
    color: "grey"

    TextInput {
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.top: parent.top
        width: 320
        height: 30

        Rectangle {
            anchors.centerIn: parent
            width: parent.width + 4
            height: parent.height + 4
            color: "white"
            border.color: "black"
            border.width: 1
            radius: 2
            z: -1
        }
    }
}

TL，DR: QtVirtualKeyboard可以在桌面应用程序中运行，但如果平台是WebGL并选择可编辑的文本元素，则会冻结应用程序。

问题：是否有办法使QtVirtualKeyboard在Qt/WebGL应用程序中运行，或者是否有另一种方法/工具可用于在Touch设备上获得Qt/WebGL应用程序的键盘功能？不需要写我自己的键盘元素的奖励点数。

到目前为止我尝试过的：

我搜索了一些流行的搜索引擎，但是出现了short.

• Multiple浏览器，没有发现与统一相关的令人满意的success.

• Some问题，这将是另一个论坛的交叉。这些似乎不适用于我的问题，因为我怀疑Qt/QML/WebGL和Unity会有很大的不同，而且我没有统一的经验。

• 我不确定这个问题是如何关联的：

Answer 1

在Qt支持的帮助下，我开始工作了。按照我的做法，调用会导致应用程序试图使键盘成为应用程序顶部的顶级窗口。这也是桌面案例的处理方式，但在那里它是有效的。

为了避免这种行为，必须将键盘嵌入到QML窗口中。为此，可以向QML窗口添加一个InputPanel，如下所示：

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.VirtualKeyboard 2.15
import QtQuick.Controls 2.5

Window {
    id: window
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")
    color: "grey"

    TextInput {
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.top: parent.top
        width: 320
        height: 30

        Rectangle {
            anchors.centerIn: parent
            width: parent.width + 4
            height: parent.height + 4
            color: "white"
            border.color: "black"
            border.width: 1
            radius: 2
            z: -1
        }
    }

    InputPanel {
        width: window.width
        y: window.height - height
        visible: active
    }
}

这对我起了作用。