QML —— 使用Qt虚拟键盘示例（附完整源码）

示例效果

 

使用"虚拟键盘"注意 （例子的Qt版本:5.12.4）

注意一：
     /* 必须在main.cpp开始处加入如下代码，否则无法使用"虚拟键盘" */
     qputenv(“QT_IM_MODULE”,QByteArray(“qtvirtualkeyboard”));

 
注意二：
     键盘大小是根据宽度自动计算的，所以，应用程序应该只设置InputPanel 的宽度和y 坐标，不能设置高度。

 

源码

     main.cpp

#include <QGuiApplication>
#include <QQmlApplicationEngine>

int main(int argc, char *argv[])
{
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);

    // 必须加入否则无法使用"虚拟键盘"
    qputenv("QT_IM_MODULE",QByteArray("qtvirtualkeyboard"));

    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.12
import QtQuick.Window 2.12
import QtQuick.Layouts 1.12
import QtQuick.Controls 2.5

import QtQuick.VirtualKeyboard 2.2
import QtQuick.VirtualKeyboard.Settings 2.2

Window
{
    id: root
    visible: true
    width: 800
    height: 600
    title: qsTr("Hello World")

    ColumnLayout
    {
        anchors.top: parent.top
        anchors.topMargin: root.height * 0.2
        anchors.horizontalCenter: parent.horizontalCenter
        spacing: 25

        RowLayout
        {
            spacing: 25

            Text
            {
                text: qsTr("用户名:")
                font.family: "微软雅黑"
                font.pixelSize: 20
            }
            TextField
            {
                placeholderText: "输入用户名.."
                font.family: "微软雅黑"
                font.pixelSize: 16
                Layout.preferredWidth: root.width * 0.25

                background: Rectangle
                {
                    radius: 4
                    border.color: parent.focus  ? "#498ff8" : "#C4DBFC"
                }
            }
        }

        RowLayout
        {
            spacing: 25

            Text
            {
                text: qsTr("密   码:")
                font.family: "微软雅黑"
                font.pixelSize: 20
            }
            TextField
            {
                placeholderText: "输入密码.."
                font.family: "微软雅黑"
                font.pixelSize: 16
                Layout.preferredWidth: root.width * 0.25

                background: Rectangle
                {
                    radius: 4
                    border.color: parent.focus  ? "#498ff8" : "#C4DBFC"
                }
            }
        }
    }

    InputPanel
    {
        id: inputPannelID
        z: 99
        y: root.height      // 默认让其处于窗口最下方,貌似隐藏一样
        width: root.width
        visible: true       // 一直显示

        states: State 
        {
            name: "visible"
            when: inputPannelID.active
            PropertyChanges 
            {
                target: inputPannelID
                y: root.height-inputPannelID.height
            }
        }
        transitions: Transition 
        {
            from: ""
            to: "visible"
            reversible: true
            ParallelAnimation 
            {
                NumberAnimation 
                {
                    properties: "y"
                    duration: 250
                    easing.type: Easing.InOutQuad
                }
            }
        }


        Component.onCompleted:
        {
            VirtualKeyboardSettings.styleName = "retro"                         // 复古样式
            VirtualKeyboardSettings.wordCandidateList.alwaysVisible = true
            VirtualKeyboardSettings.activeLocales = ["en_US","zh_CN","ja_JP"]   // 英语、中文、日语 (若不设置,则语言就有很多种)
        }
    }
}

 

关注

笔者 - jxd