add an act button class

screens/custom_widgets/__init__.py

@@ -3,6 +3,7 @@
 """
 
 
-from screens.custom_widgets.bottom_bar import BottomBar
-from screens.custom_widgets.custom_buttons import CustomButton
 from screens.custom_widgets.three_stars import ThreeStars
+from screens.custom_widgets.custom_buttons import CustomButton
+from screens.custom_widgets.bottom_bar import BottomBar
+from screens.custom_widgets.act_button import ActButton

screens/custom_widgets/act_button.kv

@@ -0,0 +1,43 @@
+#:kivy 2.2.1
+
+<ActButton>:
+
+    # Background
+    canvas.before:
+        Color:
+            rgba: self.background_color
+        RoundedRectangle:
+            pos:(0,0)
+            size:self.size
+            radius:[40,]
+
+    # Act title
+    Label:
+        id: act_title_label
+        text: root.act_title
+        pos_hint: {"center_y":0.8, "center_x":0.5}
+        size: (1,0.5)
+        font_size: root.parent.font_ratio * root.font_size
+        font_name: root.text_font_name
+        halign: "center"
+        valign: "center"
+        color: (0,0,0,1)
+
+    # Stars
+    ThreeStars:
+        id: three_stars
+        pos_hint: {"center_x":0.35, "center_y":0.25}
+        size_hint: (0.5,0.5)
+        stars_number: root.stars_number
+
+    # Completion
+    Label:
+        id: completion_label
+        text: root.completion_text
+        pos_hint: {"center_x":0.8, "center_y":0.25}
+        size_hint: (0.3,0.5)
+        font_size: root.parent.font_ratio * root.font_size
+        font_name: root.text_font_name
+        halign: "center"
+        valign: "center"
+        color: (0,0,0,1)

screens/custom_widgets/act_button.py

@@ -0,0 +1,67 @@
+"""
+Module to create the act button.
+"""
+
+###############
+### Imports ###
+###############
+
+### Kivy imports ###
+from kivy.uix.relativelayout import RelativeLayout
+from kivy.uix.behaviors import ButtonBehavior
+from kivy.properties import (
+    StringProperty,
+    NumericProperty
+)
+
+### Local imports ###
+from tools.path import (
+    PATH_TEXT_FONT
+)
+from tools.constants import (
+    CUSTOM_BUTTON_BACKGROUND_COLOR,
+    MAIN_BUTTON_FONT_SIZE,
+    OPACITY_ON_BUTTON_PRESS
+)
+
+#############
+### Class ###
+#############
+
+
+class ActButton(ButtonBehavior, RelativeLayout):
+    """
+    A custom button with a white round rectangle background.
+    """
+
+    background_color = CUSTOM_BUTTON_BACKGROUND_COLOR
+    act_title = StringProperty()
+    completion_text = StringProperty()
+    font_size = NumericProperty()
+    nb_levels = NumericProperty()
+    nb_completed_levels = NumericProperty()
+    stars_number = NumericProperty()
+
+    def __init__(
+            self,
+            text_font_name=PATH_TEXT_FONT,
+            font_size=MAIN_BUTTON_FONT_SIZE,
+            release_function=lambda: 1 + 1,
+            **kwargs):
+        super().__init__(**kwargs)
+        self.release_function = release_function
+        self.always_release = True
+        self.text_font_name = text_font_name
+        self.font_size = font_size
+        self.bind(nb_completed_levels=self.update_nb_completed_levels)
+
+    def update_nb_completed_levels(self, base_widget, value):
+        self.completion_text = str(
+            self.nb_completed_levels) + "/" + str(self.nb_levels)
+
+    def on_press(self):
+        self.opacity = OPACITY_ON_BUTTON_PRESS
+
+    def on_release(self):
+        self.release_function()
+        self.opacity = 1

screens/custom_widgets/custom_buttons.py

@@ -20,7 +20,8 @@
 )
 from tools.constants import (
     CUSTOM_BUTTON_BACKGROUND_COLOR,
-    MAIN_BUTTON_FONT_SIZE
+    MAIN_BUTTON_FONT_SIZE,
+    OPACITY_ON_BUTTON_PRESS
 )
 
 #############
@@ -55,7 +56,7 @@ def __init__(
         self.font_size = font_size
 
     def on_press(self):
-        self.opacity = 0.8
+        self.opacity = OPACITY_ON_BUTTON_PRESS
 
     def on_release(self):
         self.release_function()

screens/custom_widgets/three_stars.kv

@@ -5,45 +5,45 @@
 
     # Star one
     Image:
-        id: star_one_contour
+        id: star_one
         pos_hint: {"center_x":0.125,"center_y":0.5}
         size_hint: (0.25,1)
-        source: PATH_IMAGES + "star.png"
+        source: PATH_IMAGES + "star_full.png"
         fit_mode: "contain"
+        color: root.star_one_color
     Image:
-        id: star_one
+        id: star_one_contour
         pos_hint: {"center_x":0.125,"center_y":0.5}
         size_hint: (0.25,1)
-        source: PATH_IMAGES + "star_full.png"
+        source: PATH_IMAGES + "star3.png"
         fit_mode: "contain"
-        color: root.star_one_color
 
     # Star two
     Image:
-        id: star_two_contour
+        id: star_two
         pos_hint: {"center_x":0.5,"center_y":0.5}
         size_hint: (0.25,1)
-        source: PATH_IMAGES + "star.png"
+        source: PATH_IMAGES + "star_full.png"
         fit_mode: "contain"
+        color: root.star_two_color
     Image:
-        id: star_two
+        id: star_two_contour
         pos_hint: {"center_x":0.5,"center_y":0.5}
         size_hint: (0.25,1)
-        source: PATH_IMAGES + "star_full.png"
+        source: PATH_IMAGES + "star3.png"
         fit_mode: "contain"
-        color: root.star_two_color
 
     # Star three
     Image:
         id: star_three_contour
         pos_hint: {"center_x":0.875,"center_y":0.5}
         size_hint: (0.25,1)
-        source: PATH_IMAGES + "star.png"
+        source: PATH_IMAGES + "star_full.png"
         fit_mode: "contain"
+        color: root.star_three_color
     Image:
         id: star_three_contour
         pos_hint: {"center_x":0.875,"center_y":0.5}
         size_hint: (0.25,1)
-        source: PATH_IMAGES + "star_full.png"
+        source: PATH_IMAGES + "star3.png"
         fit_mode: "contain"
-        color: root.star_three_color

screens/custom_widgets/three_stars.py

@@ -7,7 +7,6 @@
 ###############
 
 ### Kivy imports ###
-from kivy.uix.widget import Widget
 from kivy.uix.relativelayout import RelativeLayout
 from kivy.properties import (
     NumericProperty,
@@ -20,6 +19,9 @@
 
 
 class ThreeStars(RelativeLayout):
+    """
+    Class to create a widget with three stars that can be turn on and off.
+    """
 
     star_one_color = ListProperty([0.5, 0.5, 0.5, 1.])
     star_two_color = ListProperty([0.5, 0.5, 0.5, 1.])

screens/free_mode.kv

@@ -24,7 +24,10 @@
         pos_hint: {"bottom":0,"left":0}
         selected: "home"
 
-    ThreeStars:
+    ActButton:
         size_hint: (0.7,0.15)
         pos_hint:{"center_x":0.5,"center_y":0.5}
-        stars_number: 2
+        stars_number: 2
+        nb_levels: 10
+        nb_completed_levels: 8
+        act_title: "Act 1 - Tutorial"

tools/constants.py

@@ -148,6 +148,7 @@ def __init__(self) -> None:
 MAIN_BUTTON_FONT_SIZE = 30
 BOTTOM_BAR_HEIGHT = 0.12
 CUSTOM_BUTTON_BACKGROUND_COLOR = (1, 1, 1, 0.7)
+OPACITY_ON_BUTTON_PRESS = 0.8
 
 ### Musics ###