Back to Qt.io
Contact Us Blog Download Qt
このページでは

InputPanel QML Type

仮想キーボードのUIを提供します。詳細...

Import Statement: import QtQuick.VirtualKeyboard
Inherits:

Item

プロパティ

信号

詳細な説明

キーボードのサイズは、利用可能な幅から自動的に計算されます。つまり、キーボードは現在のスタイルで指定されたアスペクト比を維持します。したがって、アプリケーションでは、InputPanelのwidth およびy 座標のみを設定し、height は設定しないでください。

このモジュールが提供する他のすべての QML タイプと同様に、InputPanel を使用する前に、環境変数 `QT_IM_MODULE ` を `qtvirtualkeyboard ` に設定する必要があります。詳細については、「プラグインの読み込み」を参照してください。

注： アプリケーション内で InputPanel のインスタンスは 1 つしか持つことができません 。このパネルはモーダルダイアログによってブロックされることはありませんが、z の値がより高いアイテムによって隠される可能性があります。

プロパティのドキュメント

active : bool [since QtQuick.VirtualKeyboard 2.0]

このプロパティは、入力パネルのアクティブ状態を表します。このプロパティがtrue の場合、キーボードをユーザーに表示する必要があります。

このプロパティは、QtQuick.VirtualKeyboard 2.0 で導入されました。

externalLanguageSwitchEnabled : bool [since QtQuick.VirtualKeyboard 2.4]

このプロパティは、外部の言語切り替えメカニズムを有効にします。このプロパティが `true` に設定されている場合、仮想キーボードは組み込みの言語ポップアップを表示せず、代わりに `externalLanguageSwitch ` シグナルを発行します。アプリケーションはこのシグナルを処理し、代わりにカスタム言語選択ダイアログを表示することができます。

このプロパティは、QtQuick.VirtualKeyboard 2.4 で導入されました。

シグナルのドキュメント

[since QtQuick.VirtualKeyboard 2.4] externalLanguageSwitch(var localeList, int currentIndex)

このシグナルは、externalLanguageSwitchEnabled がtrue であり、ユーザーが言語切り替えキーを押したときに発火します。

これは、仮想キーボードの組み込み言語ポップアップの代わりに、カスタム言語ダイアログを表示するためのフックとして機能します。

localeList パラメータには、選択可能なロケール名のリストが含まれています。特定の言語に関する詳細情報を取得するには、Qt.locale() 関数を使用します。currentIndex は、localeList 内の現在のロケールのインデックスです。この項目は、UI 上で現在の項目として強調表示される必要があります。

新しい言語を選択するには、VirtualKeyboardSettings.locale プロパティを使用します。

以下に、カスタム言語ダイアログの実装例を示します：

Dialog {
    id: languageDialog
    title: "Select Input Language"
    modality: Qt.ApplicationModal

    function show(localeList, currentIndex) {
        languageListModel.clear()
        for (var i = 0; i < localeList.length; i++) {
            languageListModel.append({localeName: localeList[i], displayName: Qt.locale(localeList[i]).nativeLanguageName})
        }
        languageListView.currentIndex = currentIndex
        languageListView.positionViewAtIndex(currentIndex, ListView.Center)
        languageDialog.visible = true
    }

    contentItem: ListView {
        id: languageListView
        model: ListModel {
            id: languageListModel
            function selectItem(index) {
                VirtualKeyboardSettings.locale = languageListModel.get(index).localeName
                languageDialog.visible = false
            }
        }
        delegate: Item {
            id: languageListItem
            width: languageNameTextMetrics.width * 17
            height: languageNameTextMetrics.height + languageListLabel.anchors.topMargin + languageListLabel.anchors.bottomMargin
            Text {
                id: languageListLabel
                anchors.left: parent.left
                anchors.top: parent.top
                anchors.leftMargin: languageNameTextMetrics.height / 2
                anchors.rightMargin: anchors.leftMargin
                anchors.topMargin: languageNameTextMetrics.height / 3
                anchors.bottomMargin: anchors.topMargin
                text: languageNameFormatter.elidedText
                color: "#5CAA15"
                font {
                    weight: Font.Normal
                    pixelSize: 28
                }
            }
            TextMetrics {
                id: languageNameTextMetrics
                font {
                    weight: Font.Normal
                    pixelSize: 28
                }
                text: "X"
            }
            TextMetrics {
                id: languageNameFormatter
                font {
                    weight: Font.Normal
                    pixelSize: 28
                }
                elide: Text.ElideRight
                elideWidth: languageListItem.width - languageListLabel.anchors.leftMargin - languageListLabel.anchors.rightMargin
                text: displayName
            }
            MouseArea {
                anchors.fill: parent
                hoverEnabled: true
                onClicked: {
                    if (index === -1)
                        return
                    parent.ListView.view.currentIndex = index
                    parent.ListView.view.model.selectItem(index)
                }
            }
            states: State {
                name: "current"
                when: languageListItem.ListView.isCurrentItem
                PropertyChanges {
                    target: languageListLabel
                    color: "black"
                }
            }
        }
    }
}

ダイアログは次のように宣言します：

LanguageDialog {
    id: languageDialog
    width: 400
    height: 400
}

アプリケーションの `InputPanel` に、以下のコードを追加します：

InputPanel {
    id: inputPanel
    externalLanguageSwitchEnabled: true
    onExternalLanguageSwitch: languageDialog.show(localeList, currentIndex)
    // ...
}

これで、言語切り替えキーが押された際に、カスタムダイアログが表示されるようになります。

注： 対応するハンドラは `onExternalLanguageSwitch` です。

このシグナルは、QtQuick.VirtualKeyboard 2.4 で導入されました。

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.