From 3c57e2abd9c2a503cc98270f928833cea5afdcad Mon Sep 17 00:00:00 2001 From: Marco Martin Date: Thu, 11 May 2017 12:07:29 +0200 Subject: [PATCH] add a qtvirtualkeyboard plugin --- CMakeLists.txt | 2 + .../images/backspace-868482.svg | 23 + .../images/check-868482.svg | 8 + .../images/enter-868482.svg | 13 + .../images/globe-868482.svg | 28 + .../images/handwriting-868482.svg | 18 + .../images/hidekeyboard-868482.svg | 55 + .../images/search-868482.svg | 14 + .../images/selectionhandle-bottom.svg | 201 ++++ .../images/shift-80c342.svg | 12 + .../images/shift-868482.svg | 12 + .../images/shift-c5d6b6.svg | 12 + .../images/textmode-868482.svg | 33 + qtvirtualkeyboardplugin/style.qml | 977 ++++++++++++++++++ 14 files changed, 1408 insertions(+) create mode 100644 qtvirtualkeyboardplugin/images/backspace-868482.svg create mode 100644 qtvirtualkeyboardplugin/images/check-868482.svg create mode 100644 qtvirtualkeyboardplugin/images/enter-868482.svg create mode 100644 qtvirtualkeyboardplugin/images/globe-868482.svg create mode 100644 qtvirtualkeyboardplugin/images/handwriting-868482.svg create mode 100644 qtvirtualkeyboardplugin/images/hidekeyboard-868482.svg create mode 100644 qtvirtualkeyboardplugin/images/search-868482.svg create mode 100644 qtvirtualkeyboardplugin/images/selectionhandle-bottom.svg create mode 100644 qtvirtualkeyboardplugin/images/shift-80c342.svg create mode 100644 qtvirtualkeyboardplugin/images/shift-868482.svg create mode 100644 qtvirtualkeyboardplugin/images/shift-c5d6b6.svg create mode 100644 qtvirtualkeyboardplugin/images/textmode-868482.svg create mode 100644 qtvirtualkeyboardplugin/style.qml diff --git a/CMakeLists.txt b/CMakeLists.txt index 0b984b69..27dc33fb 100644 --- a/CMakeLists.txt +++ b/CMakeLists.txt @@ -48,6 +48,8 @@ install(DIRECTORY wallpaper/ DESTINATION "${WALLPAPER_INSTALL_DIR}/org.kde.plasm install( DIRECTORY kwinmultitasking/ DESTINATION ${DATA_INSTALL_DIR}/kwin/scripts/org.kde.phone.multitasking ) install( FILES kwinmultitasking/metadata.desktop DESTINATION ${SERVICES_INSTALL_DIR} RENAME kwin-script-org.kde.phone.multitasking.desktop ) +install( DIRECTORY qtvirtualkeyboardplugin/ DESTINATION ${KDE_INSTALL_QMLDIR}/QtQuick/VirtualKeyboard/Styles/org.kde.plasma ) + add_subdirectory(bin) #add_subdirectory(services) add_subdirectory(applets) diff --git a/qtvirtualkeyboardplugin/images/backspace-868482.svg b/qtvirtualkeyboardplugin/images/backspace-868482.svg new file mode 100644 index 00000000..fb607bea --- /dev/null +++ b/qtvirtualkeyboardplugin/images/backspace-868482.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/qtvirtualkeyboardplugin/images/check-868482.svg b/qtvirtualkeyboardplugin/images/check-868482.svg new file mode 100644 index 00000000..c8af5f3e --- /dev/null +++ b/qtvirtualkeyboardplugin/images/check-868482.svg @@ -0,0 +1,8 @@ + + + + + + + diff --git a/qtvirtualkeyboardplugin/images/enter-868482.svg b/qtvirtualkeyboardplugin/images/enter-868482.svg new file mode 100644 index 00000000..75080f6a --- /dev/null +++ b/qtvirtualkeyboardplugin/images/enter-868482.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + diff --git a/qtvirtualkeyboardplugin/images/globe-868482.svg b/qtvirtualkeyboardplugin/images/globe-868482.svg new file mode 100644 index 00000000..2d26586e --- /dev/null +++ b/qtvirtualkeyboardplugin/images/globe-868482.svg @@ -0,0 +1,28 @@ + + + + + + + + + + diff --git a/qtvirtualkeyboardplugin/images/handwriting-868482.svg b/qtvirtualkeyboardplugin/images/handwriting-868482.svg new file mode 100644 index 00000000..d7af73ca --- /dev/null +++ b/qtvirtualkeyboardplugin/images/handwriting-868482.svg @@ -0,0 +1,18 @@ + + + + + + + + + + diff --git a/qtvirtualkeyboardplugin/images/hidekeyboard-868482.svg b/qtvirtualkeyboardplugin/images/hidekeyboard-868482.svg new file mode 100644 index 00000000..d6996b1a --- /dev/null +++ b/qtvirtualkeyboardplugin/images/hidekeyboard-868482.svg @@ -0,0 +1,55 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/qtvirtualkeyboardplugin/images/search-868482.svg b/qtvirtualkeyboardplugin/images/search-868482.svg new file mode 100644 index 00000000..6ee0ba97 --- /dev/null +++ b/qtvirtualkeyboardplugin/images/search-868482.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + diff --git a/qtvirtualkeyboardplugin/images/selectionhandle-bottom.svg b/qtvirtualkeyboardplugin/images/selectionhandle-bottom.svg new file mode 100644 index 00000000..312e3ab5 --- /dev/null +++ b/qtvirtualkeyboardplugin/images/selectionhandle-bottom.svg @@ -0,0 +1,201 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + + diff --git a/qtvirtualkeyboardplugin/images/shift-80c342.svg b/qtvirtualkeyboardplugin/images/shift-80c342.svg new file mode 100644 index 00000000..07eb508e --- /dev/null +++ b/qtvirtualkeyboardplugin/images/shift-80c342.svg @@ -0,0 +1,12 @@ + + + + + + + + + + diff --git a/qtvirtualkeyboardplugin/images/shift-868482.svg b/qtvirtualkeyboardplugin/images/shift-868482.svg new file mode 100644 index 00000000..f0ce6930 --- /dev/null +++ b/qtvirtualkeyboardplugin/images/shift-868482.svg @@ -0,0 +1,12 @@ + + + + + + + + + + diff --git a/qtvirtualkeyboardplugin/images/shift-c5d6b6.svg b/qtvirtualkeyboardplugin/images/shift-c5d6b6.svg new file mode 100644 index 00000000..6cfc345d --- /dev/null +++ b/qtvirtualkeyboardplugin/images/shift-c5d6b6.svg @@ -0,0 +1,12 @@ + + + + + + + + + + diff --git a/qtvirtualkeyboardplugin/images/textmode-868482.svg b/qtvirtualkeyboardplugin/images/textmode-868482.svg new file mode 100644 index 00000000..2f9428c2 --- /dev/null +++ b/qtvirtualkeyboardplugin/images/textmode-868482.svg @@ -0,0 +1,33 @@ + + + + + + + + + + + + + + + + + diff --git a/qtvirtualkeyboardplugin/style.qml b/qtvirtualkeyboardplugin/style.qml new file mode 100644 index 00000000..f5b09b5c --- /dev/null +++ b/qtvirtualkeyboardplugin/style.qml @@ -0,0 +1,977 @@ +/**************************************************************************** +** +** Copyright (C) 2016 The Qt Company Ltd. +** Contact: https://www.qt.io/licensing/ +** +** This file is part of the Qt Virtual Keyboard module of the Qt Toolkit. +** +** $QT_BEGIN_LICENSE:GPL$ +** Commercial License Usage +** Licensees holding valid commercial Qt licenses may use this file in +** accordance with the commercial license agreement provided with the +** Software or, alternatively, in accordance with the terms contained in +** a written agreement between you and The Qt Company. For licensing terms +** and conditions see https://www.qt.io/terms-conditions. For further +** information use the contact form at https://www.qt.io/contact-us. +** +** GNU General Public License Usage +** Alternatively, this file may be used under the terms of the GNU +** General Public License version 3 or (at your option) any later version +** approved by the KDE Free Qt Foundation. The licenses are as published by +** the Free Software Foundation and appearing in the file LICENSE.GPL3 +** included in the packaging of this file. Please review the following +** information to ensure the GNU General Public License requirements will +** be met: https://www.gnu.org/licenses/gpl-3.0.html. +** +** $QT_END_LICENSE$ +** +****************************************************************************/ + +import QtQuick 2.7 +import QtQuick.VirtualKeyboard 2.1 +import QtQuick.VirtualKeyboard.Styles 2.1 + +KeyboardStyle { + id: currentStyle + readonly property bool compactSelectionList: [InputEngine.Pinyin, InputEngine.Cangjie, InputEngine.Zhuyin].indexOf(InputContext.inputEngine.inputMode) !== -1 + readonly property string fontFamily: "Sans" + readonly property real keyBackgroundMargin: Math.round(13 * scaleHint) + readonly property real keyContentMargin: Math.round(45 * scaleHint) + readonly property real keyIconScale: scaleHint * 0.6 + readonly property string resourcePrefix: "qrc:/QtQuick/VirtualKeyboard/content/styles/default/" + + readonly property string inputLocale: InputContext.locale + property color inputLocaleIndicatorColor: "white" + property Timer inputLocaleIndicatorHighlightTimer: Timer { + interval: 1000 + onTriggered: inputLocaleIndicatorColor = "gray" + } + onInputLocaleChanged: { + inputLocaleIndicatorColor = "white" + inputLocaleIndicatorHighlightTimer.restart() + } + + keyboardDesignWidth: 2560 + keyboardDesignHeight: 2560 + keyboardRelativeLeftMargin: 114 / keyboardDesignWidth + keyboardRelativeRightMargin: 114 / keyboardDesignWidth + keyboardRelativeTopMargin: 13 / keyboardDesignHeight + keyboardRelativeBottomMargin: 86 / keyboardDesignHeight + + keyboardBackground: Rectangle { + color: "black" + } + + keyPanel: KeyPanel { + Rectangle { + id: keyBackground + radius: 5 + color: "#383533" + anchors.fill: parent + anchors.margins: keyBackgroundMargin + Text { + id: keySmallText + text: control.smallText + visible: control.smallTextVisible + color: "gray" + anchors.right: parent.right + anchors.top: parent.top + anchors.margins: keyContentMargin / 3 + font { + family: fontFamily + weight: Font.Normal + pixelSize: 38 * scaleHint + capitalization: control.uppercased ? Font.AllUppercase : Font.MixedCase + } + } + Text { + id: keyText + text: control.displayText + color: "white" + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + anchors.fill: parent + anchors.leftMargin: keyContentMargin + anchors.topMargin: control.smallTextVisible ? keyContentMargin * 1.2 : keyContentMargin + anchors.rightMargin: keyContentMargin + anchors.bottomMargin: control.smallTextVisible ? keyContentMargin * 0.8 : keyContentMargin + font { + family: fontFamily + weight: Font.Normal + pixelSize: 52 * scaleHint + capitalization: control.uppercased ? Font.AllUppercase : Font.MixedCase + } + } + } + states: [ + State { + name: "pressed" + when: control.pressed + PropertyChanges { + target: keyBackground + opacity: 0.75 + } + PropertyChanges { + target: keyText + opacity: 0.5 + } + }, + State { + name: "disabled" + when: !control.enabled + PropertyChanges { + target: keyBackground + opacity: 0.75 + } + PropertyChanges { + target: keyText + opacity: 0.05 + } + } + ] + } + + backspaceKeyPanel: KeyPanel { + Rectangle { + id: backspaceKeyBackground + radius: 5 + color: "#23211E" + anchors.fill: parent + anchors.margins: keyBackgroundMargin + Image { + id: backspaceKeyIcon + anchors.centerIn: parent + sourceSize.width: 159 * keyIconScale + sourceSize.height: 88 * keyIconScale + smooth: false + source: resourcePrefix + "images/backspace-868482.svg" + } + } + states: [ + State { + name: "pressed" + when: control.pressed + PropertyChanges { + target: backspaceKeyBackground + opacity: 0.80 + } + PropertyChanges { + target: backspaceKeyIcon + opacity: 0.6 + } + }, + State { + name: "disabled" + when: !control.enabled + PropertyChanges { + target: backspaceKeyBackground + opacity: 0.8 + } + PropertyChanges { + target: backspaceKeyIcon + opacity: 0.2 + } + } + ] + } + + languageKeyPanel: KeyPanel { + Rectangle { + id: languageKeyBackground + radius: 5 + color: "#35322f" + anchors.fill: parent + anchors.margins: keyBackgroundMargin + Image { + id: languageKeyIcon + anchors.centerIn: parent + sourceSize.width: 144 * keyIconScale + sourceSize.height: 144 * keyIconScale + smooth: false + source: resourcePrefix + "images/globe-868482.svg" + } + } + states: [ + State { + name: "pressed" + when: control.pressed + PropertyChanges { + target: languageKeyBackground + opacity: 0.80 + } + PropertyChanges { + target: languageKeyIcon + opacity: 0.75 + } + }, + State { + name: "disabled" + when: !control.enabled + PropertyChanges { + target: languageKeyBackground + opacity: 0.8 + } + PropertyChanges { + target: languageKeyIcon + opacity: 0.2 + } + } + ] + } + + enterKeyPanel: KeyPanel { + Rectangle { + id: enterKeyBackground + radius: 5 + color: "#1e1b18" + anchors.fill: parent + anchors.margins: keyBackgroundMargin + Image { + id: enterKeyIcon + visible: enterKeyText.text.length === 0 + anchors.centerIn: parent + readonly property size enterKeyIconSize: { + switch (control.actionId) { + case EnterKeyAction.Go: + case EnterKeyAction.Send: + case EnterKeyAction.Next: + case EnterKeyAction.Done: + return Qt.size(170, 119) + case EnterKeyAction.Search: + return Qt.size(148, 148) + default: + return Qt.size(211, 80) + } + } + sourceSize.width: enterKeyIconSize.width * keyIconScale + sourceSize.height: enterKeyIconSize.height * keyIconScale + smooth: false + source: { + switch (control.actionId) { + case EnterKeyAction.Go: + case EnterKeyAction.Send: + case EnterKeyAction.Next: + case EnterKeyAction.Done: + return resourcePrefix + "images/check-868482.svg" + case EnterKeyAction.Search: + return resourcePrefix + "images/search-868482.svg" + default: + return resourcePrefix + "images/enter-868482.svg" + } + } + } + Text { + id: enterKeyText + visible: text.length !== 0 + text: control.actionId !== EnterKeyAction.None ? "" : control.displayText + clip: true + fontSizeMode: Text.HorizontalFit + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + color: "#80c342" + font { + family: fontFamily + weight: Font.Normal + pixelSize: 44 * scaleHint + capitalization: Font.AllUppercase + } + anchors.fill: parent + anchors.margins: Math.round(42 * scaleHint) + } + } + states: [ + State { + name: "pressed" + when: control.pressed + PropertyChanges { + target: enterKeyBackground + opacity: 0.80 + } + PropertyChanges { + target: enterKeyIcon + opacity: 0.6 + } + PropertyChanges { + target: enterKeyText + opacity: 0.6 + } + }, + State { + name: "disabled" + when: !control.enabled + PropertyChanges { + target: enterKeyBackground + opacity: 0.8 + } + PropertyChanges { + target: enterKeyIcon + opacity: 0.2 + } + PropertyChanges { + target: enterKeyText + opacity: 0.05 + } + } + ] + } + + hideKeyPanel: KeyPanel { + Rectangle { + id: hideKeyBackground + radius: 5 + color: "#1e1b18" + anchors.fill: parent + anchors.margins: keyBackgroundMargin + Image { + id: hideKeyIcon + anchors.centerIn: parent + sourceSize.width: 144 * keyIconScale + sourceSize.height: 127 * keyIconScale + smooth: false + source: resourcePrefix + "images/hidekeyboard-868482.svg" + } + } + states: [ + State { + name: "pressed" + when: control.pressed + PropertyChanges { + target: hideKeyBackground + opacity: 0.80 + } + PropertyChanges { + target: hideKeyIcon + opacity: 0.6 + } + }, + State { + name: "disabled" + when: !control.enabled + PropertyChanges { + target: hideKeyBackground + opacity: 0.8 + } + PropertyChanges { + target: hideKeyIcon + opacity: 0.2 + } + } + ] + } + + shiftKeyPanel: KeyPanel { + Rectangle { + id: shiftKeyBackground + radius: 5 + color: "#1e1b18" + anchors.fill: parent + anchors.margins: keyBackgroundMargin + Image { + id: shiftKeyIcon + anchors.centerIn: parent + sourceSize.width: 144 * keyIconScale + sourceSize.height: 134 * keyIconScale + smooth: false + source: resourcePrefix + "images/shift-868482.svg" + } + states: [ + State { + name: "capslock" + when: InputContext.capsLock + PropertyChanges { + target: shiftKeyBackground + color: "#5a892e" + } + PropertyChanges { + target: shiftKeyIcon + source: resourcePrefix + "images/shift-c5d6b6.svg" + } + }, + State { + name: "shift" + when: InputContext.shift + PropertyChanges { + target: shiftKeyIcon + source: resourcePrefix + "images/shift-80c342.svg" + } + } + ] + } + states: [ + State { + name: "pressed" + when: control.pressed + PropertyChanges { + target: shiftKeyBackground + opacity: 0.80 + } + PropertyChanges { + target: shiftKeyIcon + opacity: 0.6 + } + }, + State { + name: "disabled" + when: !control.enabled + PropertyChanges { + target: shiftKeyBackground + opacity: 0.8 + } + PropertyChanges { + target: shiftKeyIcon + opacity: 0.2 + } + } + ] + } + + spaceKeyPanel: KeyPanel { + Rectangle { + id: spaceKeyBackground + radius: 5 + color: "#35322f" + anchors.fill: parent + anchors.margins: keyBackgroundMargin + Text { + id: spaceKeyText + text: Qt.locale(InputContext.locale).nativeLanguageName + color: currentStyle.inputLocaleIndicatorColor + Behavior on color { PropertyAnimation { duration: 250 } } + anchors.centerIn: parent + font { + family: fontFamily + weight: Font.Normal + pixelSize: 48 * scaleHint + } + } + } + states: [ + State { + name: "pressed" + when: control.pressed + PropertyChanges { + target: spaceKeyBackground + opacity: 0.80 + } + }, + State { + name: "disabled" + when: !control.enabled + PropertyChanges { + target: spaceKeyBackground + opacity: 0.8 + } + } + ] + } + + symbolKeyPanel: KeyPanel { + Rectangle { + id: symbolKeyBackground + radius: 5 + color: "#1e1b18" + anchors.fill: parent + anchors.margins: keyBackgroundMargin + Text { + id: symbolKeyText + text: control.displayText + color: "white" + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + anchors.fill: parent + anchors.margins: keyContentMargin + font { + family: fontFamily + weight: Font.Normal + pixelSize: 44 * scaleHint + capitalization: Font.AllUppercase + } + } + } + states: [ + State { + name: "pressed" + when: control.pressed + PropertyChanges { + target: symbolKeyBackground + opacity: 0.80 + } + PropertyChanges { + target: symbolKeyText + opacity: 0.6 + } + }, + State { + name: "disabled" + when: !control.enabled + PropertyChanges { + target: symbolKeyBackground + opacity: 0.8 + } + PropertyChanges { + target: symbolKeyText + opacity: 0.2 + } + } + ] + } + + modeKeyPanel: KeyPanel { + Rectangle { + id: modeKeyBackground + radius: 5 + color: "#1e1b18" + anchors.fill: parent + anchors.margins: keyBackgroundMargin + Text { + id: modeKeyText + text: control.displayText + color: "white" + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + anchors.fill: parent + anchors.margins: keyContentMargin + font { + family: fontFamily + weight: Font.Normal + pixelSize: 44 * scaleHint + capitalization: Font.AllUppercase + } + } + Rectangle { + id: modeKeyIndicator + implicitHeight: parent.height * 0.1 + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: parent.bottom + anchors.leftMargin: parent.width * 0.4 + anchors.rightMargin: parent.width * 0.4 + anchors.bottomMargin: parent.height * 0.12 + color: "#80c342" + radius: 3 + visible: control.mode + } + } + states: [ + State { + name: "pressed" + when: control.pressed + PropertyChanges { + target: modeKeyBackground + opacity: 0.80 + } + PropertyChanges { + target: modeKeyText + opacity: 0.6 + } + }, + State { + name: "disabled" + when: !control.enabled + PropertyChanges { + target: modeKeyBackground + opacity: 0.8 + } + PropertyChanges { + target: modeKeyText + opacity: 0.2 + } + } + ] + } + + handwritingKeyPanel: KeyPanel { + Rectangle { + id: hwrKeyBackground + radius: 5 + color: "#35322f" + anchors.fill: parent + anchors.margins: keyBackgroundMargin + Image { + id: hwrKeyIcon + anchors.centerIn: parent + readonly property size hwrKeyIconSize: keyboard.handwritingMode ? Qt.size(124, 96) : Qt.size(156, 104) + sourceSize.width: hwrKeyIconSize.width * keyIconScale + sourceSize.height: hwrKeyIconSize.height * keyIconScale + smooth: false + source: resourcePrefix + (keyboard.handwritingMode ? "images/textmode-868482.svg" : "images/handwriting-868482.svg") + } + } + states: [ + State { + name: "pressed" + when: control.pressed + PropertyChanges { + target: hwrKeyBackground + opacity: 0.80 + } + PropertyChanges { + target: hwrKeyIcon + opacity: 0.6 + } + }, + State { + name: "disabled" + when: !control.enabled + PropertyChanges { + target: hwrKeyBackground + opacity: 0.8 + } + PropertyChanges { + target: hwrKeyIcon + opacity: 0.2 + } + } + ] + } + + characterPreviewMargin: 0 + characterPreviewDelegate: Item { + property string text + id: characterPreview + Rectangle { + id: characterPreviewBackground + anchors.fill: parent + color: "#5d5b59" + radius: 5 + Text { + id: characterPreviewText + color: "white" + text: characterPreview.text + fontSizeMode: Text.HorizontalFit + horizontalAlignment: Text.AlignHCenter + verticalAlignment: Text.AlignVCenter + anchors.fill: parent + anchors.margins: Math.round(48 * scaleHint) + font { + family: fontFamily + weight: Font.Normal + pixelSize: 82 * scaleHint + } + } + } + } + + alternateKeysListItemWidth: 99 * scaleHint + alternateKeysListItemHeight: 150 * scaleHint + alternateKeysListDelegate: Item { + id: alternateKeysListItem + width: alternateKeysListItemWidth + height: alternateKeysListItemHeight + Text { + id: listItemText + text: model.text + color: "#868482" + font { + family: fontFamily + weight: Font.Normal + pixelSize: 52 * scaleHint + } + anchors.centerIn: parent + } + states: State { + name: "current" + when: alternateKeysListItem.ListView.isCurrentItem + PropertyChanges { + target: listItemText + color: "white" + } + } + } + alternateKeysListHighlight: Rectangle { + color: "#5d5b59" + radius: 5 + } + alternateKeysListBackground: Rectangle { + color: "#1e1b18" + radius: 5 + } + + selectionListHeight: 85 * scaleHint + selectionListDelegate: SelectionListItem { + id: selectionListItem + width: Math.round(selectionListLabel.width + selectionListLabel.anchors.leftMargin * 2) + Text { + id: selectionListLabel + anchors.left: parent.left + anchors.leftMargin: Math.round((compactSelectionList ? 50 : 140) * scaleHint) + anchors.verticalCenter: parent.verticalCenter + text: decorateText(display, wordCompletionLength) + color: "#80c342" + font { + family: fontFamily + weight: Font.Normal + pixelSize: 44 * scaleHint + } + function decorateText(text, wordCompletionLength) { + if (wordCompletionLength > 0) { + return text.slice(0, -wordCompletionLength) + '' + text.slice(-wordCompletionLength) + '' + } + return text + } + } + Rectangle { + id: selectionListSeparator + width: 4 * scaleHint + height: 36 * scaleHint + radius: 2 + color: "#35322f" + anchors.verticalCenter: parent.verticalCenter + anchors.right: parent.left + } + states: State { + name: "current" + when: selectionListItem.ListView.isCurrentItem + PropertyChanges { + target: selectionListLabel + color: "white" + } + } + } + selectionListBackground: Rectangle { + color: "#1e1b18" + } + selectionListAdd: Transition { + NumberAnimation { property: "y"; from: wordCandidateView.height; duration: 200 } + NumberAnimation { property: "opacity"; from: 0; to: 1; duration: 200 } + } + selectionListRemove: Transition { + NumberAnimation { property: "y"; to: -wordCandidateView.height; duration: 200 } + NumberAnimation { property: "opacity"; to: 0; duration: 200 } + } + + navigationHighlight: Rectangle { + color: "transparent" + border.color: "yellow" + border.width: 5 + } + + traceInputKeyPanelDelegate: TraceInputKeyPanel { + traceMargins: keyBackgroundMargin + Rectangle { + id: traceInputKeyPanelBackground + radius: 5 + color: "#35322f" + anchors.fill: parent + anchors.margins: keyBackgroundMargin + Text { + id: hwrInputModeIndicator + visible: control.patternRecognitionMode === InputEngine.HandwritingRecoginition + text: InputContext.inputEngine.inputMode === InputEngine.Latin ? "Abc" : "123" + color: "white" + anchors.left: parent.left + anchors.top: parent.top + anchors.margins: keyContentMargin + font { + family: fontFamily + weight: Font.Normal + pixelSize: 44 * scaleHint + capitalization: { + if (InputContext.capsLock) + return Font.AllUppercase + if (InputContext.shift) + return Font.MixedCase + return Font.AllLowercase + } + } + } + } + Canvas { + id: traceInputKeyGuideLines + anchors.fill: traceInputKeyPanelBackground + opacity: 0.1 + onPaint: { + var ctx = getContext("2d") + ctx.lineWidth = 1 + ctx.strokeStyle = Qt.rgba(0xFF, 0xFF, 0xFF) + ctx.clearRect(0, 0, width, height) + var i + if (control.horizontalRulers) { + for (i = 0; i < control.horizontalRulers.length; i++) { + ctx.beginPath() + ctx.moveTo(0, control.horizontalRulers[i]) + ctx.lineTo(width, control.horizontalRulers[i]) + ctx.stroke() + } + } + if (control.verticalRulers) { + for (i = 0; i < control.verticalRulers.length; i++) { + ctx.beginPath() + ctx.moveTo(control.verticalRulers[i], 0) + ctx.lineTo(control.verticalRulers[i], height) + ctx.stroke() + } + } + } + } + } + + traceCanvasDelegate: TraceCanvas { + id: traceCanvas + onAvailableChanged: { + if (!available) + return + var ctx = getContext("2d") + if (parent.canvasType === "fullscreen") { + ctx.lineWidth = 10 + ctx.strokeStyle = Qt.rgba(0, 0, 0) + } else { + ctx.lineWidth = 10 * scaleHint + ctx.strokeStyle = Qt.rgba(0xFF, 0xFF, 0xFF) + } + ctx.lineCap = "round" + ctx.fillStyle = ctx.strokeStyle + } + autoDestroyDelay: 800 + onTraceChanged: if (trace === null) opacity = 0 + Behavior on opacity { PropertyAnimation { easing.type: Easing.OutCubic; duration: 150 } } + } + + popupListDelegate: SelectionListItem { + property real cursorAnchor: popupListLabel.x + popupListLabel.width + id: popupListItem + width: popupListLabel.width + popupListLabel.anchors.leftMargin * 2 + height: popupListLabel.height + popupListLabel.anchors.topMargin * 2 + Text { + id: popupListLabel + anchors.left: parent.left + anchors.top: parent.top + anchors.leftMargin: popupListLabel.height / 2 + anchors.topMargin: popupListLabel.height / 3 + text: decorateText(display, wordCompletionLength) + color: "#5CAA15" + font { + family: fontFamily + weight: Font.Normal + pixelSize: Qt.inputMethod.cursorRectangle.height * 0.8 + } + function decorateText(text, wordCompletionLength) { + if (wordCompletionLength > 0) { + return text.slice(0, -wordCompletionLength) + '' + text.slice(-wordCompletionLength) + '' + } + return text + } + } + states: State { + name: "current" + when: popupListItem.ListView.isCurrentItem + PropertyChanges { + target: popupListLabel + color: "black" + } + } + } + + popupListBackground: Item { + Rectangle { + width: parent.width + height: parent.height + color: "white" + border { + width: 1 + color: "#929495" + } + } + } + + popupListAdd: Transition { + NumberAnimation { property: "opacity"; from: 0; to: 1.0; duration: 200 } + } + + popupListRemove: Transition { + NumberAnimation { property: "opacity"; to: 0; duration: 200 } + } + + languagePopupListEnabled: true + + languageListDelegate: SelectionListItem { + 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 { + family: fontFamily + weight: Font.Normal + pixelSize: 44 * scaleHint + } + } + TextMetrics { + id: languageNameTextMetrics + font { + family: fontFamily + weight: Font.Normal + pixelSize: 44 * scaleHint + } + text: "X" + } + TextMetrics { + id: languageNameFormatter + font { + family: fontFamily + weight: Font.Normal + pixelSize: 44 * scaleHint + } + elide: Text.ElideRight + elideWidth: languageListItem.width - languageListLabel.anchors.leftMargin - languageListLabel.anchors.rightMargin + text: displayName + } + states: State { + name: "current" + when: languageListItem.ListView.isCurrentItem + PropertyChanges { + target: languageListLabel + color: "black" + } + } + } + + languageListBackground: Rectangle { + color: "white" + border { + width: 1 + color: "#929495" + } + } + + languageListAdd: Transition { + NumberAnimation { property: "opacity"; from: 0; to: 1.0; duration: 200 } + } + + languageListRemove: Transition { + NumberAnimation { property: "opacity"; to: 0; duration: 200 } + } + + selectionHandle: Image { + sourceSize.width: 20 + source: resourcePrefix + "images/selectionhandle-bottom.svg" + } + + fullScreenInputContainerBackground: Rectangle { + color: "#FFF" + } + + fullScreenInputBackground: Rectangle { + color: "#FFF" + } + + fullScreenInputMargins: Math.round(15 * scaleHint) + + fullScreenInputPadding: Math.round(30 * scaleHint) + + fullScreenInputCursor: Rectangle { + width: 1 + color: "#000" + visible: parent.blinkStatus + } + + fullScreenInputFont.pixelSize: 58 * scaleHint +}