I’ve tried searching Google and StackOverflow on how to do this already, even asked Gemini Code Assist how to achieve it, and it talks about the "size_hint" properties of the MDButton. I’ve tried using that and a few other similar properties but can’t seem to make my buttons scale to fill the available space within their MDBoxLayout.

Here is my current .kv file for the layout:

#:import MDLabel kivymd.uix.label.MDLabel
#:import MDBoxLayout kivymd.uix.boxlayout.MDBoxLayout
#:import MDButton kivymd.uix.button.MDButton

<MyRoot>:
    random_label: random_label
    MDBoxLayout:
        orientation: "vertical"

        MDLabel:
            text: "Dice Roller"
            font_style: "Display"
            theme_text_color: "Custom"
            text_color: 0.92, 0.45, 0, 1
            halign: "center"
            valign: "top"
            size_hint_y: 0.33
            size_hint_x: 1.0

        MDLabel: 
            id: random_label
            text: "-"
            font_style: "Display"
            role: "small"
            halign: "center"
            valign: "center"
            size_hint_y: 0.33
            size_hint_x: 1.0
        
        MDBoxLayout:
            orientation: "horizontal"
            spacing: '10dp'
            size_hint_y: 0.33
            size_hint_x: 1.0
            
            MDButton:
                style: "elevated"
                theme_shadow_color: "Custom"
                shadow_color: "white"
                pos_hint: {"center_x": .5, "center_y": .5}
                size_hint_y: 1.0
                size_hint_x: 0.2
                on_press: root.roll_d2()

                MDButtonText:
                    text: "Roll 1d2"
                    id: text
                    font_style: "Title"
                    pos_hint: {"center_x": .5, "center_y": .5}

            MDButton:
                style: "elevated"
                theme_shadow_color: "Custom"
                shadow_color: "white"
                pos_hint: {"center_x": .5, "center_y": .5}
                size_hint_y: 1.0
                size_hint_x: 0.2
                on_press: root.roll_d4()

                MDButtonText:
                    text: "Roll 1d4"
                    id: text
                    font_style: "Title"
                    pos_hint: {"center_x": .5, "center_y": .5}

            MDButton:
                style: "elevated"
                theme_shadow_color: "Custom"
                shadow_color: "white"
                pos_hint: {"center_x": .5, "center_y": .5}
                size_hint_y: 1.0
                size_hint_x: 0.2
                on_press: root.roll_d6()

                MDButtonText:
                    text: "Roll 1d6"
                    id: text
                    font_style: "Title"
                    pos_hint: {"center_x": .5, "center_y": .5}

            MDButton:
                style: "elevated"
                theme_shadow_color: "Custom"
                shadow_color: "white"
                pos_hint: {"center_x": .5, "center_y": .5}
                size_hint_y: 1.0
                size_hint_x: 0.2
                on_press: root.roll_d8()

                MDButtonText:
                    text: "Roll 1d8"
                    id: text
                    font_style: "Title"
                    pos_hint: {"center_x": .5, "center_y": .5}

            MDButton:
                style: "elevated"
                theme_shadow_color: "Custom"
                shadow_color: "white"
                pos_hint: {"center_x": .5, "center_y": .5}
                size_hint_y: 1.0
                size_hint_x: 0.2
                on_press: root.roll_d10()

                MDButtonText:
                    text: "Roll 1d10"
                    id: text
                    font_style: "Title"
                    pos_hint: {"center_x": .5, "center_y": .5}

And my current main.py file for the application:

from kivymd.app import MDApp
from kivy.lang import Builder
from kivy.uix.screenmanager import ScreenManager, Screen
import numbergenerator

# Load the main-kvmd.kv file
Builder.load_file('main-kvmd.kv')

class MyRoot(Screen):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)

    def roll_d2(self):
        result = numbergenerator.Dice.roll_d2()
        self.ids.random_label.text = str(result)

    def roll_d4(self):
        result = numbergenerator.Dice.roll_d4()
        self.ids.random_label.text = str(result)

    def roll_d6(self):
        result = numbergenerator.Dice.roll_d6()
        self.ids.random_label.text = str(result)

    def roll_d8(self):
        result = numbergenerator.Dice.roll_d8()
        self.ids.random_label.text = str(result)

    def roll_d10(self):
        result = numbergenerator.Dice.roll_d10()
        self.ids.random_label.text = str(result)

class DiceRoller(MDApp):
    def build(self):
        # Set the theme to dark
        self.theme_cls.theme_style = "Dark"
        sm = ScreenManager()
        sm.add_widget(MyRoot(name='main'))
        return sm

if __name__ == '__main__':
    app = DiceRoller()
    app.run()

This resulted in this:

Here is my current simple Dice Roller application with 5 buttons at the bottom, encapsulated within a MDBoxLayout

I tried following an example from a similar question here, namely the use of MDGridLayout, but this didn’t seem to get me very far.

#:import MDLabel kivymd.uix.label.MDLabel
#:import MDBoxLayout kivymd.uix.boxlayout.MDBoxLayout
#:import MDButton kivymd.uix.button.MDButton
#:import MDGridLayout kivymd.uix.gridlayout.MDGridLayout

<MyRoot>:
    random_label: random_label
    MDGridLayout:
        cols: 5
        rows: 3
        orientation: "lr-tb"
        spacing: '5dp'
        padding: '5dp'
        size_hint: 1, 1

        MDLabel:
            text: "Dice Roller"
            font_style: "Display"
            theme_text_color: "Custom"
            text_color: 0.92, 0.45, 0, 1
            halign: "center"
            valign: "center"
            size_hint_y: 0.33
            size_hint_x: 1.0
            col_span: 5
            row: 1

        MDLabel:
            id: random_label
            text: "-"
            font_style: "Display"
            role: "small"
            halign: "center"
            valign: "center"
            size_hint_y: 0.33
            size_hint_x: 1.0
            col_span: 5
            row: 2

        MDButton:
            col: 1
            style: "elevated"
            theme_shadow_color: "Custom"
            shadow_color: "white"
            size_hint_y: 0.33
            on_press: root.roll_d2()

            MDButtonText:
                text: "Roll 1d2"
                font_style: "Title"
                pos_hint: {"center_x": .5, "center_y": .5}

        MDButton:
            col: 2
            style: "elevated"
            theme_shadow_color: "Custom"
            shadow_color: "white"
            size_hint_y: 0.33
            on_press: root.roll_d4()

            MDButtonText:
                text: "Roll 1d4"
                font_style: "Title"
                pos_hint: {"center_x": .5, "center_y": .5}

        MDButton:
            col: 3
            style: "elevated"
            theme_shadow_color: "Custom"
            shadow_color: "white"
            size_hint_y: 0.33
            on_press: root.roll_d6()

            MDButtonText:
                text: "Roll 1d6"
                font_style: "Title"
                pos_hint: {"center_x": .5, "center_y": .5}

        MDButton:
            col: 4
            style: "elevated"
            theme_shadow_color: "Custom"
            shadow_color: "white"
            size_hint_y: 0.33
            on_press: root.roll_d8()

            MDButtonText:
                text: "Roll 1d8"
                font_style: "Title"
                pos_hint: {"center_x": .5, "center_y": .5}

        MDButton:
            col: 5
            style: "elevated"
            theme_shadow_color: "Custom"
            shadow_color: "white"
            size_hint_y: 0.33
            on_press: root.roll_d10()

            MDButtonText:
                text: "Roll 1d10"
                font_style: "Title"
                pos_hint: {"center_x": .5, "center_y": .5}

Dice Roller app using MDGridLayout

All I want to achieve is to have the Title “Dice Roller” take up 33% height and 100% width at the top; the number text (“-“) take up 33% height and 100% width in the center, and make the buttons scale to take up 33% height of the bottom of the screen, and have them all resize appropriately next to each other, without overlapping, across the 100% of the width. (I.E: they don’t cut off any of the buttons/text.)

Sorry if this is a very basic question but I can’t figure out how to do it.