1
0
Fork 0

Usability tweaks for editing ratings

Adjust ratings text now has mouse hover, and sliders can be clicked
on the track to adjust the value directly
This commit is contained in:
James Turner 2017-12-08 16:02:00 +00:00
parent 48f52f14c4
commit 033d5f65d5
4 changed files with 33 additions and 7 deletions

View file

@ -18,18 +18,14 @@ ListHeaderBox
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
}, },
Text { ClickableText {
anchors.right: parent.right anchors.right: parent.right
anchors.rightMargin: Style.margin anchors.rightMargin: Style.margin
text: qsTr("Adjust minimum ratings") text: qsTr("Adjust minimum ratings")
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
MouseArea {
anchors.fill: parent
onClicked: { onClicked: {
editRatingsPanel.visible = true editRatingsPanel.visible = true
} }
}
}, },
// mouse are behind panel to consume clicks // mouse are behind panel to consume clicks

16
src/GUI/ClickableText.qml Normal file
View file

@ -0,0 +1,16 @@
import QtQuick 2.0
import "."
Text {
signal clicked();
color: mouse.containsMouse ? Style.themeColor : Style.baseTextColor
MouseArea {
id: mouse
hoverEnabled: true
anchors.fill: parent
onClicked: parent.clicked();
}
}

View file

@ -2,6 +2,7 @@ import QtQuick 2.0
import "." import "."
Item { Item {
id: root
property alias label: labelText.text property alias label: labelText.text
property int min: 0 property int min: 0
@ -39,6 +40,18 @@ Item {
width: parent.width * __percentFull width: parent.width * __percentFull
} }
MouseArea {
id: clickTrackArea
anchors.centerIn: parent
width: parent.width
height: root.height
onClicked: {
var frac = mouse.x / width;
root.value = min + 0.5 + (max - min) * frac;
}
}
// invisble item that moves directly with the mouse // invisble item that moves directly with the mouse
Item { Item {
id: dragThumb id: dragThumb

View file

@ -55,6 +55,7 @@
<file>UpdateAllPanel.qml</file> <file>UpdateAllPanel.qml</file>
<file>Style.qml</file> <file>Style.qml</file>
<file>qmldir</file> <file>qmldir</file>
<file>ClickableText.qml</file>
</qresource> </qresource>
<qresource prefix="/preview"> <qresource prefix="/preview">
<file alias="close-icon">preview-close.png</file> <file alias="close-icon">preview-close.png</file>