subsurface/mobile-widgets/qml/HintsTextEdit.qml
Dirk Hohndel e0f46b033d QML UI: attempt to add dark theme
This isn't great, yet, but a first step to show that this is possible
(and in doing so I found quite a few spots where the colors weren't
correctly propagating, yet).

Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
2017-06-21 17:20:07 -07:00

116 lines
2.6 KiB
QML

// SPDX-License-Identifier: GPL-2.0
import QtQuick 2.6
import QtQuick.Controls 2.0
import QtGraphicalEffects 1.0
import QtQuick.Layouts 1.2
import org.kde.kirigami 2.0 as Kirigami
TextField {
id: root
z: focus ? 999 : 0
property alias model: hintsView.model
property alias currentIndex: hintsView.currentIndex
inputMethodHints: Qt.ImhNoPredictiveText
onTextChanged: {
textUpdateTimer.restart();
}
onFocusChanged: frame.shouldShow = focus
onVisibleChanged: {
if (visible) {
focus = false
frame.shouldShow = false
}
}
Keys.onUpPressed: {
hintsView.currentIndex--;
}
Keys.onDownPressed: {
hintsView.currentIndex++;
}
Timer {
id: textUpdateTimer
interval: 300
onTriggered: {
if (root.text.length == 0) {
return;
}
for (var i = 0; i < hintsView.count; ++i) {
var m = model[i].match(root.text);
if (m !== null && model[i].startsWith(root.text)) {
hintsView.currentIndex = i;
root.text = model[i];
root.select(m[0].length, model[i].length);
textUpdateTimer.running = false;
break;
}
}
}
}
Frame {
id: frame
property bool shouldShow
z: 9000
y: -height - Kirigami.Units.gridUnit
opacity: root.focus && shouldShow ? 1 : 0
visible: opacity > 0
width: root.width
leftPadding: 0
rightPadding: 0
topPadding: 2
bottomPadding: 2
height: Math.min(Kirigami.Units.gridUnit * 14, Math.max(Kirigami.Units.gridUnit*4, hintsView.contentHeight + topPadding + bottomPadding))
Behavior on opacity {
NumberAnimation {
duration: 200
easing.type: Easing.OutQuad
}
}
background: Rectangle {
color: subsurfaceTheme.backgroundColor
radius: 2
layer.enabled: true
layer.effect: DropShadow {
anchors.fill: parent
anchors.bottomMargin: -Kirigami.Units.gridUnit * 2
horizontalOffset: 0
verticalOffset: 1
radius: Kirigami.Units.gridUnit
samples: 32
color: Qt.rgba(0, 0, 0, 0.5)
}
Rectangle {
color: subsurfaceTheme.backgroundColor
width: Kirigami.Units.gridUnit
height: width
rotation: 45
anchors {
verticalCenter: parent.bottom
left: parent.left
leftMargin: width
}
}
}
ListView {
id: hintsView
anchors.fill: parent
clip: true
onCurrentIndexChanged: root.text = currentIndex === -1 ? "" : model[currentIndex];
delegate: Kirigami.BasicListItem {
label: modelData
topPadding: 0
bottomPadding: 0
leftPadding: 0
rightPadding: 0
implicitHeight: Kirigami.Units.gridUnit*2
checked: hintsView.currentIndex == index
onClicked: {
hintsView.currentIndex = index
root.text = modelData
frame.shouldShow = false;
}
}
ScrollBar.vertical: ScrollBar { }
}
}
}