Add:gui/qml:Added button with latch

git-svn-id: http://svn.code.sf.net/p/navit/code/trunk/navit/navit@3112 ffa7fe5e-494d-0410-b361-a75ebd5db220

2 files changed, 79 insertions, 2 deletions

diff --git a/gui/qml/skins/navit/Makefile.am b/gui/qml/skins/navit/Makefile.am
index 25c7c16a..110c4e99 100644
--- a/gui/qml/skins/navit/Makefile.am
+++ b/gui/qml/skins/navit/Makefile.am
@@ -4,7 +4,7 @@ SKIN = navit
 
 qmldir=$(skinsdir)/$(SKIN)
 
-qml_DATA = ButtonIcon.qml ToggleSwitch.qml ListSelector.qml Slider.qml Cellar.qml main.qml point.qml command.qml PageAbout.qml PageBookmarksAdd.qml PageBookmarks.qml PageNavigation.qml PageRoute.qml PageSearch.qml PageSearchSelector.qml PageSettingsDisplay.qml PageSettingsLocale.qml PageSettings.qml PageSettingsRules.qml PageSettingsTools.qml PageSettingsVehicle.qml
+qml_DATA = ButtonIcon.qml ToggleSwitch.qml ToggleButton.qml ListSelector.qml Slider.qml Cellar.qml main.qml point.qml command.qml PageAbout.qml PageBookmarksAdd.qml PageBookmarks.qml PageNavigation.qml PageRoute.qml PageSearch.qml PageSearchSelector.qml PageSettingsDisplay.qml PageSettingsLocale.qml PageSettings.qml PageSettingsRules.qml PageSettingsTools.qml PageSettingsVehicle.qml PagePoi.qml
 qml_DATA += background.svg knob.svg
 
 do_button_subst = sed -e 's,matchProperties,properties,g' \
@@ -22,4 +22,14 @@ if QT_DECLARATIVE_NEWAPI
 	$(do_button_subst) < ToggleSwitch.qml.in > ToggleSwitch.qml
 else 
 	cp ToggleSwitch.qml.in ToggleSwitch.qml
-endif
\ No newline at end of file
+endif
+
+ToggleButton.qml: ToggleButton.qml.in
+if QT_DECLARATIVE_NEWAPI
+	$(do_button_subst) < ToggleButton.qml.in > ToggleButton.qml
+else 
+	cp ToggleButton.qml.in ToggleButton.qml
+endif
+
+clean-local:
+	-$(RM) ButtonIcon.qml ToggleSwitch.qml ToggleButton.qml
diff --git a/gui/qml/skins/navit/ToggleButton.qml.in b/gui/qml/skins/navit/ToggleButton.qml.in
new file mode 100644
index 00000000..0edb0a22
--- /dev/null
+++ b/gui/qml/skins/navit/ToggleButton.qml.in
@@ -0,0 +1,67 @@
+
+import Qt 4.6
+
+ Item {
+     id: togglebutton
+     width: imgItem.width + txtItem.width + gui.width/24; height: imgItem.height
+
+     property string stOn: "false"
+     property string text: "Toggle button"
+    property string icon: "Icon.png"
+
+     signal changed
+
+     function toggle() {
+         if (togglebutton.state == "on")
+             togglebutton.state = "off";
+         else 
+	     togglebutton.state = "on";
+     }
+
+     function startup () {
+	 if (togglebutton.stOn == "1" ) 
+       		togglebutton.stOn = "true";
+	 else 
+		togglebutton.stOn = "false";
+         if (togglebutton.stOn == "true")
+             togglebutton.state = "on";
+         else
+             togglebutton.state = "off";
+     }
+
+     Component.onCompleted: startup();
+
+    MouseRegion { id: mr; anchors.fill: parent; onReleased: toggle() }
+
+   Image {
+	id: imgItem; source: gui.iconPath+togglebutton.icon; anchors.top: togglebutton.top; anchors.horizontalCenter: togglebutton.horizontalCenter;
+	width: gui.height/32; height: gui.height/32
+   }
+
+    Text {
+        id: txtItem; text: togglebutton.text; anchors.top: imgItem.bottom; anchors.horizontalCenter: togglebutton.horizontalCenter; 
+	color: "White"; font.pointSize: gui.height/64; horizontalAlignment: Qt.AlignHCenter
+    }
+
+     states: [
+         State {
+             name: "on"
+             PropertyChanges { target: imgItem; opacity: 1 }
+	     PropertyChanges { target: txtItem; opacity: 1 }
+	     PropertyChanges { target: togglebutton; stOn: "true" }
+	     StateChangeScript { script: togglebutton.changed(); }
+         },
+         State {
+             name: "off"
+             PropertyChanges { target: imgItem; opacity: 0.3 }
+	     PropertyChanges { target: txtItem; opacity: 0.3 }
+	     PropertyChanges { target: togglebutton; stOn: "false" }
+	     StateChangeScript { script: togglebutton.changed(); }
+         }
+     ]
+
+    transitions: Transition {
+        NumberAnimation { matchProperties: "scale"; easing: "easeOutExpo"; duration: 200 }
+        NumberAnimation { matchProperties: "opacity"; easing: "easeInQuad"; duration: 200 }
+    }
+ }