xml-ph-0000@deepl.internal での仮想キーボードQt Quick

この例には、デスクトッププラットフォーム用と組み込みプラットフォーム用の2つの実装があります。前者のバージョンでは、仮想キーボードを使用して複数のテキストフィールドにテキストを入力できますが、後者のバージョンでは、同じUIを使用しつつ、カスタム仮想キーボードInputPanel を採用しています。以下のコードスニペットは、CONFIGオプションに基づいて適切な実装を選択するようにプロジェクトを設定する方法を示しています：

• qmake では (basic.pro)：

  !qtConfig(vkb-desktop) {
      DEFINES += MAIN_QML=\\\"basic-b2qt.qml\\\"
  } else {
      DEFINES += MAIN_QML=\\\"Basic.qml\\\"
  }

• CMake の場合 (CMakeLists.txt)：

  if(NOT QT_FEATURE_vkb_desktop)
      target_compile_definitions(basic PUBLIC
          MAIN_QML="basic-b2qt.qml"
      )
  endif()
      ...
  if(QT_FEATURE_vkb_desktop)
      target_compile_definitions(basic PUBLIC
          MAIN_QML="Basic.qml"
      )
  endif()

この例では、.qml ファイルをロードする前に、QT_IM_MODULE 環境変数を設定することで仮想キーボードを有効にしています：

#include <QQuickView>
#include <QGuiApplication>
#include <QQmlEngine>

int main(int argc, char *argv[])
{
    qputenv("QT_IM_MODULE", QByteArray("qtvirtualkeyboard"));

    QGuiApplication app(argc, argv);
    QQuickView view(QString("qrc:/%2").arg(MAIN_QML));
    if (view.status() == QQuickView::Error)
        return -1;
    view.setResizeMode(QQuickView::SizeRootObjectToView);

    view.show();

    return app.exec();
}

これに加え、カスタムTextField およびTextArea 項目を使用して、EnterKeyAction の添付プロパティを通じて[ENTER]キーの動作を設定しています。

import QtQuick
import QtQuick.Controls
import QtQuick.VirtualKeyboard
import "content"

Rectangle {
    ...
                TextField {
                    width: parent.width
                    placeholderText: "One line field"
                    enterKeyAction: EnterKeyAction.Next
                    onAccepted: passwordField.focus = true
                }
    ...
                TextArea {
                    id: textArea
                    width: parent.width
                    placeholderText: "Multiple line field"
                    height: Math.max(206, implicitHeight)
                }
}

TextField およびTextArea コントロールは、それぞれQt Quick Controls 2の各タイプを拡張し、enterKeyEnabled およびenterKeyAction プロパティを備えています。スニペット内のTextField およびTextArea のインスタンスでは、これらのプロパティを設定することで、デフォルトの動作を変更できます。

例の動作確認

以下の手順でサンプルを実行できます。

• Qt Creator

  Welcome モードを開き、Examples からこのサンプルを選択します。詳細については、Qt Creator の「チュートリアル：ビルドと実行」を参照してください。

• Qt Extension for Visual Studio Code

  Command Palette から `Qt: Open Qt examples ` コマンドを実行し、リストからこのサンプルを選択します。詳細については、Qt Extension for Visual Studio Code の「チュートリアル: ビルドと実行」を参照してください。

code.qt.io のサンプルプロジェクト