Search code examples
pythonbeeware

Toga colouring?


So I'm trying to learn toga-beeware and I would like to get out of the default plain white theme. I am trying to find out how to colour the text and button inputs. The code below does not work for colouring.

"""
Mass look-up app
"""
import toga
from toga.style import Pack
from toga.style.pack import COLUMN, ROW


class LookUp(toga.App):

    def start(self):
        pass

    def startup(self):
        """
        Construct and show the Toga application.

        Usually, you would add your application to a main content box.
        We then create a main window (with a name matching the app), and
        show the main window.
        """
        main_box = toga.Box(style=Pack(direction=ROW))
        web_box = toga.Box(style=Pack(direction=ROW, flex=0.5))
        hold_box = toga.Box(style=Pack(direction=COLUMN, flex=0.5, background_color=("#22252a")))
        time_box = toga.Box(style=Pack(direction=COLUMN, background_color=("#22252a"), flex=1))
        amount_box = toga.Box(style=Pack(direction=COLUMN, background_color=("#22252a"), padding_top=60, flex=1))
        start_box = toga.Box(style=Pack(direction=COLUMN, background_color=("#22252a"), padding_top=60, flex=1))

        time_label = toga.Label('Time:', style=Pack(font_size=20, color=("#f2f2f2"), background_color=("#353841"), flex=1))
        time_input = toga.NumberInput(style=Pack(font_size=20, flex=1))
        time_box.add(time_label); time_box.add(time_input)

        amount_label = toga.Label('Amount:', style=Pack(font_size=20, color=("#f2f2f2"), background_color=("#353841"), flex=1))
        amount_input = toga.NumberInput(style=Pack(font_size=20, flex=1, color=("#353841"), background_color=("#353841")))
        amount_box.add(amount_label); amount_box.add(amount_input)

        start_button = toga.Button('Start', style=Pack(font_size=20, text_align="center", flex=1), on_press=self.start)
        start_box.add(start_button)


        hold_box.add(time_box); hold_box.add(amount_box); hold_box.add(start_box)
        main_box.add(hold_box); main_box.add(web_box)
        self.main_window = toga.MainWindow(title=self.formal_name)
        self.main_window.content = main_box
        self.main_window.show()


def main():
    return LookUp()

I understand that beeware is still in development but I'm sure that there is a way to colour all widgets.


Solution

  • The above code is working as expected and is colouring the widgets as you have mentioned. Please check if you have any errors while running the app.

    If you are trying to change the main window from white to any other color, you need to add color for main box.

    from toga.constants import RED
    
    main_box = toga.Box(style=Pack(direction=ROW, background_color=RED))
    

    This will apply colour to the entire main box.