Commit c7e24c22 authored by Bruno Coudoin's avatar Bruno Coudoin
Browse files

color_mix, added visual feedback on +/- buttons

- refactored button code to have it in its own qml class
parent e51777f3
/* GCompris - ColorButton.qml
*
* Copyright (C) 2014 Bruno Coudoin <bruno.coudoin@gcompris.net>
*
* Authors:
* Bruno Coudoin <bruno.coudoin@gcompris.net>
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation; either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program; if not, see <http://www.gnu.org/licenses/>.
*/
import QtQuick 2.0
Rectangle {
id: button
height: parent.height / 4
width: height
z: 3
radius: width / 2
border.color: "black"
property alias text: buttonText.text
signal clicked
Text {
id: buttonText
anchors.centerIn: parent
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
font.pointSize: Math.max(parent.height * 0.8, 10)
}
MouseArea {
id: mouseArea
anchors.centerIn: parent
height: 3 * parent.height
width: 3 * parent.width
hoverEnabled: true
onClicked: button.clicked()
}
states: [
State {
name: "notclicked"
PropertyChanges {
target: button
scale: 1.0
}
},
State {
name: "clicked"
when: mouseArea.pressed
PropertyChanges {
target: button
scale: 0.9
}
},
State {
name: "hover"
when: mouseArea.containsMouse
PropertyChanges {
target: button
scale: 1.2
}
}
]
Behavior on scale { NumberAnimation { duration: 70 } }
}
......@@ -61,63 +61,52 @@ Image {
saturation: 1
}
Rectangle {
id: up
height: parent.height / 4
width: height
z: 3
radius: width / 2
border.color: "black"
ColorButton {
text: "+"
anchors {
verticalCenter: parent.verticalCenter
right: parent.right
rightMargin: parent.width * 0.2
}
Text {
id: upText
anchors.centerIn: parent
text: "+"
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
font.pointSize: Math.max(parent.height * 0.8, 10)
}
MouseArea {
anchors.centerIn: parent
height: 2*parent.height
width: 2*parent.width
onClicked: currentStep = Math.min(currentStep + 1, maxSteps)
}
onClicked: currentStep = Math.min(currentStep + 1, maxSteps)
}
Rectangle {
id: down
height: up.height
width: height
z: 3
radius: width / 2
border.color: "black"
ColorButton {
text: "-"
anchors {
verticalCenter: parent.verticalCenter
left: parent.left
leftMargin: parent.width * 0.4
}
onClicked: currentStep = Math.max(currentStep - 1, 0)
}
Text {
id: downText
anchors.centerIn: parent
text: "-"
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
font.pointSize: upText.font.pointSize
}
// Rectangle {
// id: down
// height: up.height
// width: height
// z: 3
// radius: width / 2
// border.color: "black"
// anchors {
// verticalCenter: parent.verticalCenter
// left: parent.left
// leftMargin: parent.width * 0.4
// }
MouseArea {
anchors.centerIn: parent
height: 2*parent.height
width: 2*parent.width
onClicked: currentStep = Math.max(currentStep - 1, 0)
}
}
// Text {
// id: downText
// anchors.centerIn: parent
// text: "-"
// horizontalAlignment: Text.AlignHCenter
// verticalAlignment: Text.AlignVCenter
// font.pointSize: upText.font.pointSize
// }
// MouseArea {
// anchors.centerIn: parent
// height: 2*parent.height
// width: 2*parent.width
// }
// }
}
......@@ -2,7 +2,8 @@
APP_FILES += \
$$PWD/ActivityInfo.qml \
$$PWD/ColorMix.qml \
$$PWD/ColorChooser.qml \
$$PWD/ColorChooser.qml \
$$PWD/ColorButton.qml \
$$PWD/colormix.js \
$$PWD/colormix.svg \
$$PWD/resource/brush.svgz \
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment