[Interest] Custom SpinBoxStyle questions
Frédéric Martinsons
frederic.martinsons at sigfox.com
Mon Sep 1 11:04:09 CEST 2014
Hello interest,
I've been doing a custom QML SpinBox (dedicated to look like the android
SpinBox, up arrow above the text, down arrow below and no background) but I
have trouble concerning the style component 'incrementControl' and
'decrementControl'.
The documentation says : "The button used to increment/decrement the value"
, but I did not manage to control the value via my custom mouse area (I try
propagateComposedEvents and accepted=false but without success). Moreover
the mouses area of the SpinBox seems existing alongside (but not at the
same place) my custom one and still be reactive.
I try also to completely remove my mouse area but the spin boxes one didn't
seem to be attached to my Image inside incrementControl or decrementControl.
Have you ever tried to made a custom spin box style ? And if yes how did
you do ? Any help would be greatly appreciated.
Here is a my sample code:
SpinBox {
id: spinBox
anchors.centerIn: parent
implicitWidth: 50
implicitHeight: 50
value: 0
style: spinBoxStyle
onValueChanged: console.log("Value is now: "+ value)
}
Component {
id: spinBoxStyle
SpinBoxStyle {
background: Rectangle {
id: bg
visible: false
implicitWidth: control.width
implicitHeight: control.height
}
decrementControl: Item {
implicitWidth: 50
implicitHeight: 50
anchors.top: parent.bottom
Image {
id: downArrow
source: "down-arrow.png"
sourceSize.width: parent.width
sourceSize.height: parent.height
anchors.centerIn: parent
opacity: control.value==control.minimumValue ? 0.5 : 1
}
MouseArea {
id: mouse
anchors.fill:parent
}
Rectangle {
color: "#11ffffff"
anchors.fill: parent
visible: mouse.pressed
}
}
incrementControl: Item {
implicitWidth: 50
implicitHeight: 50
Image {
id: upArrow
source: "up-arrow.png"
sourceSize.width: parent.width
sourceSize.height: parent.height
anchors.centerIn:parent
opacity: control.value==control.maximumValue ? 0.5 : 1
}
MouseArea {
id: mouse
anchors.fill:parent
}
Rectangle {
color: "#11ffffff"
anchors.fill: parent
visible: mouse.pressed
}
}
}
}
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.qt-project.org/pipermail/interest/attachments/20140901/144fcf06/attachment.html>
More information about the Interest
mailing list