Skip to content

Update Calculator tutorial #5864

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 13 commits into from
Dec 1, 2025
Merged

Update Calculator tutorial #5864

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
58551a4
Refactor calculator buttons and add dataclass example
InesaFitsner Nov 19, 2025
579d41f
Set default expand value in CalcButton dataclass
FeodorFitsner Nov 19, 2025
c71daba
Update calc3_dataclasses.py
InesaFitsner Nov 20, 2025
cee6ba9
Merge branch 'main' into inesa/fix-tutorials
InesaFitsner Nov 26, 2025
0773dc8
Refactor calc3.py to use dataclasses and remove calc3_dataclasses.py
InesaFitsner Nov 26, 2025
2ec6999
Refactor calculator to use dataclasses and add calc5 example
InesaFitsner Nov 26, 2025
beba210
Refactor calculator buttons to use @ft.control decorator
InesaFitsner Nov 26, 2025
0e20c25
Refactor calculator to use @ft.control and dataclasses
InesaFitsner Nov 26, 2025
b8bac9b
Refactor calculator tutorial and add integration test
InesaFitsner Nov 26, 2025
27145b0
Merge branch 'main' into inesa/fix-tutorials
InesaFitsner Nov 27, 2025
e216973
Refactor calculator examples and update integration tests
InesaFitsner Nov 27, 2025
a93b193
Update calculator tutorial and example script
InesaFitsner Nov 27, 2025
6684820
Add overloads to control decorator function
FeodorFitsner Dec 1, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Empty file added sdk/python/examples/controls/chip/__init__.py
View file
Open in desktop
Empty file.
3 changes: 2 additions & 1 deletion sdk/python/examples/controls/chip/assist_chips.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,4 +34,5 @@ async def handle_chip2_click(e: ft.Event[ft.Chip]):
)


ft.run(main)
if __name__ == "__main__":
ft.run(main)
3 changes: 2 additions & 1 deletion sdk/python/examples/controls/chip/filter_chips.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,4 +29,5 @@ def handle_amenity_selection(e: ft.Event[ft.Chip]):
)


ft.run(main)
if __name__ == "__main__":
ft.run(main)
Empty file added sdk/python/examples/tutorials/calculator/__init__.py
View file
Open in desktop
Empty file.
91 changes: 42 additions & 49 deletions sdk/python/examples/tutorials/calculator/calc.py
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,100 +1,93 @@
from dataclasses import field

import flet as ft


@ft.control
class CalcButton(ft.Button):
def __init__(self, text, button_clicked, expand=1):
super().__init__()
self.text = text
self.expand = expand
self.on_click = button_clicked
self.data = text
expand: int = field(default_factory=lambda: 1)


@ft.control
class DigitButton(CalcButton):
def __init__(self, text, button_clicked, expand=1):
CalcButton.__init__(self, text, button_clicked, expand)
self.bgcolor = ft.Colors.WHITE24
self.color = ft.Colors.WHITE
bgcolor: ft.Colors = ft.Colors.WHITE_24
color: ft.Colors = ft.Colors.WHITE


@ft.control
class ActionButton(CalcButton):
def __init__(self, text, button_clicked):
CalcButton.__init__(self, text, button_clicked)
self.bgcolor = ft.Colors.ORANGE
self.color = ft.Colors.WHITE
bgcolor: ft.Colors = ft.Colors.ORANGE
color: ft.Colors = ft.Colors.WHITE


@ft.control
class ExtraActionButton(CalcButton):
def __init__(self, text, button_clicked):
CalcButton.__init__(self, text, button_clicked)
self.bgcolor = ft.Colors.BLUE_GREY_100
self.color = ft.Colors.BLACK
bgcolor: ft.Colors = ft.Colors.BLUE_GREY_100
color: ft.Colors = ft.Colors.BLACK


@ft.control
class CalculatorApp(ft.Container):
# application's root control (i.e. "view") containing all other controls
def __init__(self):
super().__init__()
def init(self):
self.reset()

self.result = ft.Text(value="0", color=ft.Colors.WHITE, size=20)
self.width = 350
self.bgcolor = ft.Colors.BLACK
self.border_radius = ft.border_radius.all(20)
self.border_radius = ft.BorderRadius.all(20)
self.padding = 20
self.result = ft.Text(value="0", color=ft.Colors.WHITE, size=20)

self.content = ft.Column(
controls=[
ft.Row(controls=[self.result], alignment="end"),
ft.Row(
controls=[self.result],
alignment=ft.MainAxisAlignment.END,
),
ft.Row(
controls=[
ExtraActionButton(
text="AC", button_clicked=self.button_clicked
),
ExtraActionButton(
text="+/-", button_clicked=self.button_clicked
),
ExtraActionButton(text="%", button_clicked=self.button_clicked),
ActionButton(text="/", button_clicked=self.button_clicked),
ExtraActionButton(content="AC", on_click=self.button_clicked),
ExtraActionButton(content="+/-", on_click=self.button_clicked),
ExtraActionButton(content="%", on_click=self.button_clicked),
ActionButton(content="/", on_click=self.button_clicked),
]
),
ft.Row(
controls=[
DigitButton(text="7", button_clicked=self.button_clicked),
DigitButton(text="8", button_clicked=self.button_clicked),
DigitButton(text="9", button_clicked=self.button_clicked),
ActionButton(text="*", button_clicked=self.button_clicked),
DigitButton(content="7", on_click=self.button_clicked),
DigitButton(content="8", on_click=self.button_clicked),
DigitButton(content="9", on_click=self.button_clicked),
ActionButton(content="*", on_click=self.button_clicked),
]
),
ft.Row(
controls=[
DigitButton(text="4", button_clicked=self.button_clicked),
DigitButton(text="5", button_clicked=self.button_clicked),
DigitButton(text="6", button_clicked=self.button_clicked),
ActionButton(text="-", button_clicked=self.button_clicked),
DigitButton(content="4", on_click=self.button_clicked),
DigitButton(content="5", on_click=self.button_clicked),
DigitButton(content="6", on_click=self.button_clicked),
ActionButton(content="-", on_click=self.button_clicked),
]
),
ft.Row(
controls=[
DigitButton(text="1", button_clicked=self.button_clicked),
DigitButton(text="2", button_clicked=self.button_clicked),
DigitButton(text="3", button_clicked=self.button_clicked),
ActionButton(text="+", button_clicked=self.button_clicked),
DigitButton(content="1", on_click=self.button_clicked),
DigitButton(content="2", on_click=self.button_clicked),
DigitButton(content="3", on_click=self.button_clicked),
ActionButton(content="+", on_click=self.button_clicked),
]
),
ft.Row(
controls=[
DigitButton(
text="0", expand=2, button_clicked=self.button_clicked
content="0", expand=2, on_click=self.button_clicked
),
DigitButton(text=".", button_clicked=self.button_clicked),
ActionButton(text="=", button_clicked=self.button_clicked),
DigitButton(content=".", on_click=self.button_clicked),
ActionButton(content="=", on_click=self.button_clicked),
]
),
]
)

def button_clicked(self, e):
Copy link
Contributor

@FeodorFitsner FeodorFitsner Dec 1, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

button_clicked can be assigned to the base CalcButton.on_click.

data = e.control.data
data = e.control.content
print(f"Button clicked with data = {data}")
if self.result.value == "Error" or data == "AC":
self.result.value = "0"
Expand Down
41 changes: 21 additions & 20 deletions sdk/python/examples/tutorials/calculator/calc1.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,26 +7,27 @@ def main(page: ft.Page):

page.add(
result,
ft.Button(text="AC"),
ft.Button(text="+/-"),
ft.Button(text="%"),
ft.Button(text="/"),
ft.Button(text="7"),
ft.Button(text="8"),
ft.Button(text="9"),
ft.Button(text="*"),
ft.Button(text="4"),
ft.Button(text="5"),
ft.Button(text="6"),
ft.Button(text="-"),
ft.Button(text="1"),
ft.Button(text="2"),
ft.Button(text="3"),
ft.Button(text="+"),
ft.Button(text="0"),
ft.Button(text="."),
ft.Button(text="="),
ft.Button("AC"),
ft.Button("+/-"),
ft.Button("%"),
ft.Button("/"),
ft.Button("7"),
ft.Button("8"),
ft.Button("9"),
ft.Button("*"),
ft.Button("4"),
ft.Button("5"),
ft.Button("6"),
ft.Button("-"),
ft.Button("1"),
ft.Button("2"),
ft.Button("3"),
ft.Button("+"),
ft.Button("0"),
ft.Button("."),
ft.Button("="),
)


ft.run(main)
if __name__ == "__main__":
ft.run(main)
41 changes: 21 additions & 20 deletions sdk/python/examples/tutorials/calculator/calc2.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,44 +9,45 @@ def main(page: ft.Page):
ft.Row(controls=[result]),
ft.Row(
controls=[
ft.Button(text="AC"),
ft.Button(text="+/-"),
ft.Button(text="%"),
ft.Button(text="/"),
ft.Button("AC"),
ft.Button("+/-"),
ft.Button("%"),
ft.Button("/"),
]
),
ft.Row(
controls=[
ft.Button(text="7"),
ft.Button(text="8"),
ft.Button(text="9"),
ft.Button(text="*"),
ft.Button("7"),
ft.Button("8"),
ft.Button("9"),
ft.Button("*"),
]
),
ft.Row(
controls=[
ft.Button(text="4"),
ft.Button(text="5"),
ft.Button(text="6"),
ft.Button(text="-"),
ft.Button("4"),
ft.Button("5"),
ft.Button("6"),
ft.Button("-"),
]
),
ft.Row(
controls=[
ft.Button(text="1"),
ft.Button(text="2"),
ft.Button(text="3"),
ft.Button(text="+"),
ft.Button("1"),
ft.Button("2"),
ft.Button("3"),
ft.Button("+"),
]
),
ft.Row(
controls=[
ft.Button(text="0"),
ft.Button(text="."),
ft.Button(text="="),
ft.Button("0"),
ft.Button("."),
ft.Button("="),
]
),
)


ft.run(main)
if __name__ == "__main__":
ft.run(main)
76 changes: 37 additions & 39 deletions sdk/python/examples/tutorials/calculator/calc3.py
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,86 +1,84 @@
from dataclasses import field

import flet as ft


def main(page: ft.Page):
page.title = "Calc App"
result = ft.Text(value="0", color=ft.Colors.WHITE, size=20)

@ft.control
class CalcButton(ft.Button):
def __init__(self, text, expand=1):
super().__init__()
self.text = text
self.expand = expand
expand: int = field(default_factory=lambda: 1)

@ft.control
class DigitButton(CalcButton):
def __init__(self, text, expand=1):
CalcButton.__init__(self, text, expand)
self.bgcolor = ft.Colors.WHITE24
self.color = ft.Colors.WHITE
bgcolor: ft.Colors = ft.Colors.WHITE_24
color: ft.Colors = ft.Colors.WHITE

@ft.control
class ActionButton(CalcButton):
def __init__(self, text):
CalcButton.__init__(self, text)
self.bgcolor = ft.Colors.ORANGE
self.color = ft.Colors.WHITE
bgcolor: ft.Colors = ft.Colors.ORANGE
color: ft.Colors = ft.Colors.WHITE

@ft.control
class ExtraActionButton(CalcButton):
def __init__(self, text):
CalcButton.__init__(self, text)
self.bgcolor = ft.Colors.BLUE_GREY_100
self.color = ft.Colors.BLACK
bgcolor: ft.Colors = ft.Colors.BLUE_GREY_100
color: ft.Colors = ft.Colors.BLACK

page.add(
ft.Container(
width=350,
bgcolor=ft.Colors.BLACK,
border_radius=ft.border_radius.all(20),
border_radius=ft.BorderRadius.all(20),
padding=20,
content=ft.Column(
controls=[
ft.Row(controls=[result], alignment="end"),
ft.Row(controls=[result], alignment=ft.MainAxisAlignment.END),
ft.Row(
controls=[
ExtraActionButton(text="AC"),
ExtraActionButton(text="+/-"),
ExtraActionButton(text="%"),
ActionButton(text="/"),
ExtraActionButton(content="AC"),
ExtraActionButton(content="+/-"),
ExtraActionButton(content="%"),
ActionButton(content="/"),
]
),
ft.Row(
controls=[
DigitButton(text="7"),
DigitButton(text="8"),
DigitButton(text="9"),
ActionButton(text="*"),
DigitButton(content="7"),
DigitButton(content="8"),
DigitButton(content="9"),
ActionButton(content="*"),
]
),
ft.Row(
controls=[
DigitButton(text="4"),
DigitButton(text="5"),
DigitButton(text="6"),
ActionButton(text="-"),
DigitButton(content="4"),
DigitButton(content="5"),
DigitButton(content="6"),
ActionButton(content="-"),
]
),
ft.Row(
controls=[
DigitButton(text="1"),
DigitButton(text="2"),
DigitButton(text="3"),
ActionButton(text="+"),
DigitButton(content="1"),
DigitButton(content="2"),
DigitButton(content="3"),
ActionButton(content="+"),
]
),
ft.Row(
controls=[
DigitButton(text="0", expand=2),
DigitButton(text="."),
ActionButton(text="="),
]
DigitButton(content="0", expand=2),
DigitButton(content="."),
ActionButton(content="="),
],
),
]
),
)
)


ft.run(main)
if __name__ == "__main__":
ft.run(main)
Loading
Loading