HeartRate Game: QML revamp

This patch implements proper QML module registration for both CMake
and qmake.
It also tries to address all qmllint warnings, which results in a
major refactoring, because the current approach with Loaders
provides a lot of unqualified access warnings.
The new approach uses StackLayout to switch between different
pages.

Task-number: QTBUG-111972
Change-Id: Icc0122deebe63af16dd53c47690f2dc9fb88c919
Reviewed-by: Juha Vuolle <juha.vuolle@qt.io>
Reviewed-by: Qt CI Bot <qt_ci_bot@qt-project.org>
(cherry picked from commit 007bf2bcf10007b02dd5fe09c0fc4be24229af14)
Reviewed-by: Qt Cherry-pick Bot <cherrypick_bot@qt-project.org>

1 files changed, 51 insertions, 0 deletions

diff --git a/examples/bluetooth/heartrate-game/GameSettings.qml b/examples/bluetooth/heartrate-game/GameSettings.qml
new file mode 100644
index 00000000..0fe85460
--- /dev/null
+++ b/examples/bluetooth/heartrate-game/GameSettings.qml
@@ -0,0 +1,51 @@
+// Copyright (C) 2022 The Qt Company Ltd.
+// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
+
+pragma Singleton
+import QtQuick
+
+Item {
+    property int wHeight
+    property int wWidth
+
+    // Colors
+    readonly property color backgroundColor: "#2d3037"
+    readonly property color buttonColor: "#202227"
+    readonly property color buttonPressedColor: "#6ccaf2"
+    readonly property color disabledButtonColor: "#555555"
+    readonly property color viewColor: "#202227"
+    readonly property color delegate1Color: Qt.darker(viewColor, 1.2)
+    readonly property color delegate2Color: Qt.lighter(viewColor, 1.2)
+    readonly property color textColor: "#ffffff"
+    readonly property color textDarkColor: "#232323"
+    readonly property color disabledTextColor: "#777777"
+    readonly property color sliderColor: "#6ccaf2"
+    readonly property color errorColor: "#ba3f62"
+    readonly property color infoColor: "#3fba62"
+
+    // Font sizes
+    property real microFontSize: hugeFontSize * 0.2
+    property real tinyFontSize: hugeFontSize * 0.4
+    property real smallTinyFontSize: hugeFontSize * 0.5
+    property real smallFontSize: hugeFontSize * 0.6
+    property real mediumFontSize: hugeFontSize * 0.7
+    property real bigFontSize: hugeFontSize * 0.8
+    property real largeFontSize: hugeFontSize * 0.9
+    property real hugeFontSize: (wWidth + wHeight) * 0.03
+    property real giganticFontSize: (wWidth + wHeight) * 0.04
+
+    // Some other values
+    property real fieldHeight: wHeight * 0.08
+    property real fieldMargin: fieldHeight * 0.5
+    property real buttonHeight: wHeight * 0.08
+    property real buttonRadius: buttonHeight * 0.1
+
+    // Some help functions
+    function widthForHeight(h, ss) {
+        return h / ss.height * ss.width
+    }
+
+    function heightForWidth(w, ss) {
+        return w / ss.width * ss.height
+    }
+}