QMLScatter example improved a bit

Change-Id: Iac8e6b0edce20d2ef0cd89999c59a485a6f3862a
Change-Id: Iac8e6b0edce20d2ef0cd89999c59a485a6f3862a
Reviewed-by: Miikka Heikkinen <miikka.heikkinen@digia.com>

3 files changed, 113 insertions, 98 deletions

diff --git a/examples/qmlscatter/qml/qmlscatter/button.qml b/examples/qmlscatter/qml/qmlscatter/button.qml
new file mode 100644
index 00000000..8e0e8b86
--- /dev/null
+++ b/examples/qmlscatter/qml/qmlscatter/button.qml
@@ -0,0 +1,59 @@
+/****************************************************************************
+**
+** Copyright (C) 2013 Digia Plc
+** All rights reserved.
+** For any questions to Digia, please use contact form at http://qt.digia.com
+**
+** This file is part of the QtDataVis3D module.
+**
+** Licensees holding valid Qt Enterprise licenses may use this file in
+** accordance with the Qt Enterprise License Agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and Digia.
+**
+** If you have questions regarding the use of this file, please use
+** contact form at http://qt.digia.com
+**
+****************************************************************************/
+
+import QtQuick 2.1
+
+Item {
+    id: button
+
+    property alias text: buttonText.text
+    property alias color: buttonRectangle.color
+    property alias radius: buttonRectangle.radius
+
+    property color defaultColor: "lightgray"
+    property color pressedColor: "gray"
+    property color borderColor: "silver"
+
+    signal clicked
+
+    height: 90
+
+    Rectangle {
+        id: buttonRectangle
+        width: parent.width
+        height: parent.height
+        color: defaultColor
+        radius: 5
+        border.color: borderColor
+
+        Text {
+            id: buttonText
+            wrapMode: Text.WordWrap
+            verticalAlignment: Text.AlignVCenter
+            horizontalAlignment: Text.AlignHCenter
+            anchors.fill: parent
+        }
+
+        MouseArea {
+            anchors.fill: parent
+            onPressed: buttonRectangle.color = pressedColor
+            onReleased: buttonRectangle.color = defaultColor
+            onClicked: button.clicked()
+        }
+    }
+}
diff --git a/examples/qmlscatter/qml/qmlscatter/main.qml b/examples/qmlscatter/qml/qmlscatter/main.qml
index fd2c6e2e..a85c2d21 100644
--- a/examples/qmlscatter/qml/qmlscatter/main.qml
+++ b/examples/qmlscatter/qml/qmlscatter/main.qml
@@ -17,13 +17,11 @@
 ****************************************************************************/
 
 import QtQuick 2.1
-import QtQuick.Controls 1.0
 import com.digia.QtDataVis3D 1.0
+import "."
 
 Item {
     id: mainview
-    width: 800
-    height: 700
     visible: true
 
     Item {
@@ -89,123 +87,80 @@ Item {
         }
     }
 
-    Rectangle {
+    Button {
         id: shadowToggle
-        width: 120
-        height: 30
-
-        TextArea {
-            id: shadowText
-            text: "Toggle Shadows On"
-            anchors.fill: parent
-        }
-
-        MouseArea {
-            anchors.fill: parent
-            onClicked: {
-                if (testscatter.shadowQuality === Scatter3D.ShadowNone) {
-                    testscatter.shadowQuality = Scatter3D.ShadowMedium;
-                    shadowText.text = "Toggle Shadows Off";
-                } else {
-                    testscatter.shadowQuality = Scatter3D.ShadowNone;
-                    shadowText.text = "Toggle Shadows On";
-                }
+        width: parent.width / 5
+        text: "Toggle Shadows On"
+        onClicked: {
+            if (testscatter.shadowQuality === Scatter3D.ShadowNone) {
+                testscatter.shadowQuality = Scatter3D.ShadowMedium;
+                text = "Toggle Shadows Off";
+            } else {
+                testscatter.shadowQuality = Scatter3D.ShadowNone;
+                text = "Toggle Shadows On";
             }
         }
     }
-    Rectangle {
+
+    Button {
         id: smoothToggle
-        width: 140
-        height: 30
+        width: parent.width / 5
+        defaultColor: "gainsboro"
+        text: "Toggle Smooth Objects On"
         anchors.left: shadowToggle.right
-
-        TextArea {
-            id: smoothText
-            text: "Toggle Smooth Objects On"
-            anchors.fill: parent
-        }
-
-        MouseArea {
-            anchors.fill: parent
-            onClicked: {
-                if (testscatter.objectSmooth === false) {
-                    smoothText.text = "Toggle Smooth Objects Off"
-                    testscatter.objectSmooth = true;
-                } else {
-                    smoothText.text = "Toggle Smooth Objects On"
-                    testscatter.objectSmooth = false;
-                }
+        onClicked: {
+            if (testscatter.objectSmooth === false) {
+                text = "Toggle Smooth Objects Off"
+                testscatter.objectSmooth = true;
+            } else {
+                text = "Toggle Smooth Objects On"
+                testscatter.objectSmooth = false;
             }
         }
     }
-    Rectangle {
+
+    Button {
         id: cameraToggle
-        width: 130
-        height: 30
+        width: parent.width / 5
+        text: "Toggle Camera Preset"
         anchors.left: smoothToggle.right
-
-        TextArea {
-            text: "Toggle Camera Preset"
-            anchors.fill: parent
-        }
-
-        MouseArea {
-            anchors.fill: parent
-            onClicked: {
-                if (testscatter.cameraPreset === Scatter3D.PresetFront) {
-                    testscatter.cameraPreset = Scatter3D.PresetIsometricRightHigh;
-                } else {
-                    testscatter.cameraPreset = Scatter3D.PresetFront;
-                }
+        onClicked: {
+            if (testscatter.cameraPreset === Scatter3D.PresetFront) {
+                testscatter.cameraPreset = Scatter3D.PresetIsometricRightHigh;
+            } else {
+                testscatter.cameraPreset = Scatter3D.PresetFront;
             }
         }
     }
-    Rectangle {
+
+    Button {
         id: themeToggle
-        width: 120
-        height: 30
+        width: parent.width / 5
+        defaultColor: "gainsboro"
+        text: "Toggle Theme"
         anchors.left: cameraToggle.right
-
-        TextArea {
-            text: "Toggle Theme"
-            anchors.fill: parent
-        }
-
-        MouseArea {
-            anchors.fill: parent
-            onClicked: {
-                if (testscatter.theme === Scatter3D.ThemeBlueCerulean) {
-                    testscatter.theme = Scatter3D.ThemeSystem;
-                } else {
-                    testscatter.theme = Scatter3D.ThemeBlueCerulean;
-                }
+        onClicked: {
+            if (testscatter.theme === Scatter3D.ThemeBlueCerulean) {
+                testscatter.theme = Scatter3D.ThemeSystem;
+            } else {
+                testscatter.theme = Scatter3D.ThemeBlueCerulean;
             }
         }
     }
-    Rectangle {
+
+    Button {
         id: backgroundToggle
-        width: 130
-        height: 30
+        width: parent.width / 5
+        text: "Toggle Background Off"
         anchors.left: themeToggle.right
-
-        TextArea {
-            id: backgroundText
-            text: "Toggle Background Off"
-            anchors.fill: parent
-        }
-
-        MouseArea {
-            anchors.fill: parent
-            onClicked: {
-                if (testscatter.backgroundVisible === true) {
-                    testscatter.backgroundVisible = false;
-                    backgroundText.text = "Toggle Background On";
-                } else {
-                    testscatter.backgroundVisible = true;
-                    backgroundText.text = "Toggle Background Off";
-                }
+        onClicked: {
+            if (testscatter.backgroundVisible === true) {
+                testscatter.backgroundVisible = false;
+                text = "Toggle Background On";
+            } else {
+                testscatter.backgroundVisible = true;
+                text = "Toggle Background Off";
             }
         }
     }
-
 }
diff --git a/examples/qmlscatter/qmlscatter.qrc b/examples/qmlscatter/qmlscatter.qrc
index 62f5931b..3208d88b 100644
--- a/examples/qmlscatter/qmlscatter.qrc
+++ b/examples/qmlscatter/qmlscatter.qrc
@@ -1,5 +1,6 @@
 <RCC>
     <qresource prefix="/qml">
         <file alias="main.qml">qml/qmlscatter/main.qml</file>
+        <file alias="Button.qml">qml/qmlscatter/Button.qml</file>
     </qresource>
 </RCC>