From a9bb6f0952e261aa09f7bba589f07736f814b7b3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tomi=20Korpip=C3=A4=C3=A4?= <tomi.korpipaa@theqtcompany.com>
Date: Fri, 15 Jan 2016 11:43:27 +0200
Subject: Made controls easier to use on touch devices

Change-Id: Ife9b72e390a9d9c0f012d6b9ac4a421fad9f0315
Task-number: QTRD-3782
Reviewed-by: Miikka Heikkinen <miikka.heikkinen@theqtcompany.com>
---
 .../qml/qmlsurfacelayers/NewButton.qml             |  4 +-
 .../qmlsurfacelayers/qml/qmlsurfacelayers/main.qml | 69 +++++++++++++++++++---
 2 files changed, 64 insertions(+), 9 deletions(-)

diff --git a/examples/datavisualization/qmlsurfacelayers/qml/qmlsurfacelayers/NewButton.qml b/examples/datavisualization/qmlsurfacelayers/qml/qmlsurfacelayers/NewButton.qml
index 19309cca..4b1dd5a3 100644
--- a/examples/datavisualization/qmlsurfacelayers/qml/qmlsurfacelayers/NewButton.qml
+++ b/examples/datavisualization/qmlsurfacelayers/qml/qmlsurfacelayers/NewButton.qml
@@ -35,11 +35,12 @@ Item {
     id: newbutton
 
     property alias text: buttonText.text
+    property real fontSize: 12
 
     signal clicked
 
     implicitWidth: buttonText.implicitWidth + 5
-    implicitHeight: buttonText.implicitHeight + 10
+    implicitHeight: buttonText.implicitHeight * 2
 
     Button {
         id: buttonText
@@ -50,6 +51,7 @@ Item {
             label: Component {
                 Text {
                     text: buttonText.text
+                    font.pointSize: fontSize
                     clip: true
                     wrapMode: Text.WordWrap
                     verticalAlignment: Text.AlignVCenter
diff --git a/examples/datavisualization/qmlsurfacelayers/qml/qmlsurfacelayers/main.qml b/examples/datavisualization/qmlsurfacelayers/qml/qmlsurfacelayers/main.qml
index dbff4fe4..e5c48562 100644
--- a/examples/datavisualization/qmlsurfacelayers/qml/qmlsurfacelayers/main.qml
+++ b/examples/datavisualization/qmlsurfacelayers/qml/qmlsurfacelayers/main.qml
@@ -30,6 +30,7 @@
 import QtQuick 2.1
 import QtQuick.Layouts 1.0
 import QtQuick.Controls 1.0
+import QtQuick.Controls.Styles 1.0
 import QtDataVisualization 1.0
 import "."
 
@@ -38,6 +39,8 @@ Item {
     width: 1280
     height: 720
 
+    property real fontSize: 12
+
     Item {
         id: surfaceView
         width: mainview.width - buttonLayout.width
@@ -140,25 +143,48 @@ Item {
 
         //! [3]
         GroupBox {
-            title: "Layer Selection"
+            flat: true
             Layout.fillWidth: true
             Column {
+                spacing: 10
+
+                Label {
+                    font.pointSize: fontSize
+                    font.bold: true
+                    text: "Layer Selection"
+                }
+
                 CheckBox {
                     id: layerOneToggle
-                    text: "Show Ground Layer"
                     checked: true
+                    style: CheckBoxStyle {
+                        label: Label {
+                            font.pointSize: fontSize
+                            text: "Show Ground Layer"
+                        }
+                    }
                 }
 
                 CheckBox {
                     id: layerTwoToggle
-                    text: "Show Sea Layer"
                     checked: true
+                    style: CheckBoxStyle {
+                        label: Label {
+                            font.pointSize: fontSize
+                            text: "Show Sea Layer"
+                        }
+                    }
                 }
 
                 CheckBox {
                     id: layerThreeToggle
-                    text: "Show Tectonic Layer"
                     checked: true
+                    style: CheckBoxStyle {
+                        label: Label {
+                            font.pointSize: fontSize
+                            text: "Show Tectonic Layer"
+                        }
+                    }
                 }
             }
         }
@@ -166,12 +192,25 @@ Item {
 
         //! [5]
         GroupBox {
-            title: "Layer Style"
+            flat: true
             Layout.fillWidth: true
             Column {
+                spacing: 10
+
+                Label {
+                    font.pointSize: fontSize
+                    font.bold: true
+                    text: "Layer Style"
+                }
+
                 CheckBox {
                     id: layerOneGrid
-                    text: "Show Ground as Grid"
+                    style: CheckBoxStyle {
+                        label: Label {
+                            font.pointSize: fontSize
+                            text: "Show Ground as Grid"
+                        }
+                    }
                     onCheckedChanged: {
                         if (checked)
                             layerOneSeries.drawMode = Surface3DSeries.DrawWireframe
@@ -182,7 +221,12 @@ Item {
 
                 CheckBox {
                     id: layerTwoGrid
-                    text: "Show Sea as Grid"
+                    style: CheckBoxStyle {
+                        label: Label {
+                            font.pointSize: fontSize
+                            text: "Show Sea as Grid"
+                        }
+                    }
                     onCheckedChanged: {
                         if (checked)
                             layerTwoSeries.drawMode = Surface3DSeries.DrawWireframe
@@ -193,7 +237,12 @@ Item {
 
                 CheckBox {
                     id: layerThreeGrid
-                    text: "Show Tectonic as Grid"
+                    style: CheckBoxStyle {
+                        label: Label {
+                            font.pointSize: fontSize
+                            text: "Show Tectonic as Grid"
+                        }
+                    }
                     onCheckedChanged: {
                         if (checked)
                             layerThreeSeries.drawMode = Surface3DSeries.DrawWireframe
@@ -209,6 +258,7 @@ Item {
         NewButton {
             id: sliceButton
             text: "Slice All Layers"
+            fontSize: fontSize
             Layout.fillWidth: true
             Layout.minimumHeight: 40
             onClicked: {
@@ -228,6 +278,7 @@ Item {
 
         NewButton {
             id: shadowButton
+            fontSize: fontSize
             Layout.fillWidth: true
             Layout.minimumHeight: 40
             text: surfaceLayers.shadowsSupported ? "Show Shadows" : "Shadows not supported"
@@ -245,6 +296,7 @@ Item {
 
         NewButton {
             id: renderModeButton
+            fontSize: fontSize
             text: "Switch Render Mode"
             Layout.fillWidth: true
             Layout.minimumHeight: 40
@@ -280,6 +332,7 @@ Item {
 
         TextField {
             id: renderLabel
+            font.pointSize: fontSize
             Layout.fillWidth: true
             Layout.minimumHeight: 40
             enabled: false
-- 
cgit v1.2.3