diff --git a/ui/StatusQ/sandbox/pages/StatusInputPage.qml b/ui/StatusQ/sandbox/pages/StatusInputPage.qml index 59167cd740..b12bf03e9e 100644 --- a/ui/StatusQ/sandbox/pages/StatusInputPage.qml +++ b/ui/StatusQ/sandbox/pages/StatusInputPage.qml @@ -212,4 +212,12 @@ Column { } input.edit.readOnly: true } + + StatusInputWithCursor { + id: cursor + input.placeholderText: "0.00 SNT" + Component.onCompleted: { + cursor.input.edit.forceActiveFocus() + } + } } diff --git a/ui/StatusQ/src/StatusQ/Controls/StatusBaseInput.qml b/ui/StatusQ/src/StatusQ/Controls/StatusBaseInput.qml index d35e38a3f9..4e0d3c4b93 100644 --- a/ui/StatusQ/src/StatusQ/Controls/StatusBaseInput.qml +++ b/ui/StatusQ/src/StatusQ/Controls/StatusBaseInput.qml @@ -25,6 +25,7 @@ Item { property alias edit: edit property alias text: edit.text + property alias background: background property alias color: edit.color property alias font: edit.font @@ -78,6 +79,7 @@ Item { 44, root.minimumHeight), root.maximumHeight) : 44 Rectangle { + id: background width: parent.width height: maximumHeight != 0 ? Math.min( minimumHeight diff --git a/ui/StatusQ/src/StatusQ/Controls/StatusInputWithCursor.qml b/ui/StatusQ/src/StatusQ/Controls/StatusInputWithCursor.qml new file mode 100644 index 0000000000..8413f050c5 --- /dev/null +++ b/ui/StatusQ/src/StatusQ/Controls/StatusInputWithCursor.qml @@ -0,0 +1,62 @@ +import QtQuick 2.14 +import QtQuick.Controls 2.14 + +import StatusQ.Core 0.1 +import StatusQ.Core.Theme 0.1 + +StatusInput { + id: cursorInput + + property string cursorColor: Theme.palette.primaryColor1 + + height: input.edit.height + leftPadding: 0 + rightPadding: 0 + + input.placeholderText: "" + input.edit.cursorVisible: true + input.edit.font.pixelSize: 32 + input.placeholderFont.pixelSize: 32 + input.leftPadding: 0 + input.rightPadding: 0 + input.topPadding: 0 + input.bottomPadding: 0 + input.edit.padding: 0 + input.background.color: "transparent" + input.background.border.width: 0 + input.edit.cursorDelegate: Rectangle { + id: cursor + visible: input.edit.cursorVisible + color: cursorColor + width: 2 + + SequentialAnimation { + loops: Animation.Infinite + running: input.edit.cursorVisible + + PropertyAction { + target: cursor + property: 'visible' + value: true + } + + PauseAnimation { + duration: 600 + } + + PropertyAction { + target: cursor + property: 'visible' + value: false + } + + PauseAnimation { + duration: 600 + } + + onStopped: { + cursor.visible = false + } + } + } +} diff --git a/ui/StatusQ/src/StatusQ/Controls/qmldir b/ui/StatusQ/src/StatusQ/Controls/qmldir index 8c677cf3f4..4b7b85a1a1 100644 --- a/ui/StatusQ/src/StatusQ/Controls/qmldir +++ b/ui/StatusQ/src/StatusQ/Controls/qmldir @@ -36,3 +36,4 @@ StatusWalletColorButton 0.1 StatusWalletColorButton.qml StatusWalletColorSelect 0.1 StatusWalletColorSelect.qml StatusColorSelectorGrid 0.1 StatusColorSelectorGrid.qml StatusSeedPhraseInput 0.1 StatusSeedPhraseInput.qml +StatusInputWithCursor 0.1 StatusInputWithCursor.qml