Flet: Flutter in Python

Transcript

1. Flet: Techniques & Tips
3. Python Mauritius UserGroup (pymug) More info: mscc.mu/python-mauritius-usergroup-pymug/ Why Where codes github.com/pymug share events twitter.com/pymugdotcom ping professionals linkedin.com/company/pymug all info pymug.com tell friends by like facebook.com/pymug 3
4. Abdur-Rahmaan Janhangeer Help people get into OpenSource People hire me to work on Python projects https://www.compileralchemy.com 4
5. ssslides 5
6. Flet: Techniques & Tips 6
7. Overview 7
8. Codebase 8
9. Publish 9
10. Notes 10
13. Techniques 13
14. Skeleton import flet as ft def main(page: ft.Page): page.title = "Window title" b = ft.TextButton("text") page.add(b) ft.app(target=main) 14
15. Events def button_clicked(e): ... button = ft.TextButton("text", on_click=button_clicked, data=0) 15
16. Update widget textfield.value = 'a' page.update(textfield) # page.update() 16
17. Routing 17
18. import flet as ft def main(page: ft.Page): page.title = "Routes Example" def route_change(route): page.views.clear() page.views.append( ft.View( "/", [ ft.AppBar(title=ft.Text("Flet app"), bgcolor=ft.colors.SURFACE_VARIANT), ft.ElevatedButton("Visit Store", on_click=lambda _: page.go("/store")), ], ) ) if page.route == "/store": page.views.append( ft.View( "/store", [ ft.AppBar(title=ft.Text("Store"), bgcolor=ft.colors.SURFACE_VARIANT), ft.ElevatedButton("Go Home", on_click=lambda _: page.go("/")), ], ) ) page.update() def view_pop(view): page.views.pop() top_view = page.views[-1] page.go(top_view.route) page.on_route_change = route_change page.on_view_pop = view_pop page.go(page.route) ft.app(target=main, view=ft.WEB_BROWSER) 18
19. import flet as ft class View: url = '/page' elements = [ ft.ElevatedButton(text="Elevated button"), ft.ElevatedButton(text="Elevated button") ] @classmethod def do_something(cls): ... @classmethod def view(cls): return ft.View( cls.url, cls.elements, ) 19
20. def main(page: ft.Page): page.title = "Routes Example" def route_change(route): page.views.clear() page.views.append( ft.View( "/", [ ft.AppBar(title=ft.Text("Flet app"), bgcolor=ft.colors.SURFACE_VARIANT), ft.ElevatedButton("Visit Store", on_click=lambda _: page.go("/store")), ], ) ) if page.route == View.url: page.views.append( view.elements ) page.update() def view_pop(view): page.views.pop() top_view = page.views[-1] page.go(top_view.route) page.on_route_change = route_change page.on_view_pop = view_pop page.go(page.route) 20
21. Dev experience 21
22. Icons ft.icons.PAUSE_CIRCLE_FILLED_ROUNDED 22
23. Color ft.color.RED_400 23
24. Next in this session 24
25. Code an app based on one of the previous sessions code 25