Street bets UI.

CMakeLists.txt

@@ -10,12 +10,19 @@ find_package(Qt6 6.2 COMPONENTS Core Widgets QuickControls2 Gui REQUIRED)
 
 qt_standard_project_setup()
 
-qt_add_executable(roulette-payout
+qt_add_resources(QRC res.qrc)
+set(SOURCES
     main.cpp
     MainWindow.cpp
     MainWindow.h
     PlayerAreaModel.cpp
     PlayerAreaModel.h
+    StreetBetsModel.cpp
+    StreetBetsModel.h
+    ${QRC})
+
+qt_add_executable(roulette-payout
+    ${SOURCES}
 )
 
 qt_add_qml_module(roulette-payout
@@ -25,6 +32,8 @@ qt_add_qml_module(roulette-payout
     QML_FILES
         Root.qml
         PlayerAreaView.qml
+        Roulette.qml
+        StreetBetsView.qml
 )
 
 target_link_libraries(roulette-payout PRIVATE

Root.qml

@@ -1,6 +1,5 @@
 import QtQuick
 import QtQuick.Controls
-import QtQuick.Layouts
 
 import roulette
 
@@ -11,11 +10,21 @@ Window {
     visible: true
 
     Pane {
-        id: rootWindow
-
         anchors.fill: parent
+
         PlayerAreaView {
             id: playerAreaView
         }
+
+        Roulette {
+            id: roulette
+            height: parent.height / 1.7
+            width: parent.width / 1.7
+
+            anchors{
+                top: parent.top
+                right: parent.right
+            }
+        }
     }
 }

Roulette.qml

@@ -0,0 +1,25 @@
+import QtQuick
+import Qt5Compat.GraphicalEffects
+
+import roulette
+
+Item {
+
+    Image {
+        source: "qrc:/roulette.png"
+        signal streetBet(n: int)
+
+        //fillMode: Image.PreserveAspectFit
+        height: parent.height
+        width: parent.width
+
+        anchors {
+            top: parent.top
+            right: parent.right
+        }
+
+        StreetBetsView {
+            id: streetBets
+        }
+    }
+}

StreetBetsModel.cpp

@@ -0,0 +1,10 @@
+#include "StreetBetsModel.h"
+
+StreetBetsModel::StreetBetsModel(QObject *parent)
+{
+
+}
+
+void StreetBetsModel::betOnStreet(int n) {
+    printf("emit signal to mark bet on street %d\n", n);
+}

StreetBetsModel.h

@@ -0,0 +1,17 @@
+#pragma once
+
+#include <QQuickView>
+#include <qqmlintegration.h>
+#include <qtmetamacros.h>
+#include <qobject.h>
+
+class StreetBetsModel : public QObject {
+    Q_OBJECT
+    QML_ELEMENT
+
+    public:
+    explicit StreetBetsModel(QObject *parent = nullptr);
+
+    public slots:
+        void betOnStreet(int n);
+};

StreetBetsView.qml

@@ -0,0 +1,69 @@
+import QtQuick
+
+import roulette
+
+Item {
+
+    StreetBetsModel {
+        id: streetBetsModel
+    }
+
+    Repeater {
+        model: 12
+
+        Rectangle {
+            visible: true
+            color: tapHandler1.pressed ? "#999999" : "#EEEEEE"
+            opacity: hoverHandler.hovered ? 0.4 : 0
+            height: 45
+            width: 35
+
+            anchors {
+                left: parent.left
+                leftMargin: 90 + (index * (width + 1.8))
+                top: parent.top
+                topMargin: 22
+            }
+
+            HoverHandler {
+                id: hoverHandler
+            }
+            TapHandler {
+                id: tapHandler1
+            }
+
+        }
+    }
+
+    Repeater {
+        model: 12
+
+        delegate: Rectangle {
+            visible: true
+            color: "transparent"
+            height: 44
+            width: 35
+            border.color: "blue"
+            border.width: 0
+
+            anchors {
+                left: parent.left
+                leftMargin: 90 + (index * (width + 1.8))
+                top: parent.top
+                topMargin: 22
+            }
+
+            TapHandler {
+
+                onTapped: ()=> {
+                    if (parent.border.width == 0) {
+                        parent.border.width = 2
+                    } else {
+                        parent.border.width = 0
+                    }
+                    streetBetsModel.betOnStreet(index)
+                }
+            }
+        }
+    }
+}

res.qrc

@@ -0,0 +1,5 @@
+<RCC>
+    <qresource prefix="/">
+        <file>roulette.png</file>
+    </qresource>
+</RCC>