Project Structure

[PierreFaraut]

Hi there!
I'm trying to set-up correctly my project structure, by creating classes for my controllers.
I would like to create something like this:

- pages
    - home.py
    - config.py

main.py

In the main file, I just want to call my pages or elements that construct my pages:

import flet
from flet import Page, Text
from pages.home import Home
from pages.config import Config

def main(page: Page):
    page.add(Text(f"Initial route: {page.route}"))

    def route_change(route):
        page.views.clear()

        if page.route == '/Config':
            page.views.append(Config())
        else:
            page.views.append(Home())

        page.update()

    page.on_route_change = route_change
    
flet.app(target=main)

And then, in the Home.py, I would like to have something like this (same idea for the Config.py file):

from flet import UserControl, Text, ElevatedButton, Column

class Home(UserControl):

    def go_to_config(self, e):
        page.route = '/Config'

    def build(self):
        return Column(controls=[
            Text('Home page'),
            ElevatedButton('Go to Config page', on_click=go_to_config)
        ])

For the moment the idea does not work, but I was wondering if I'm misunderstanding how flet should work, or if they are better ways to do that.
Thanks for your help!
Pierre

[FeodorFitsner]

The problem is in go_to_config(). After changing page.route property you have to call page.update().
But I'd rather use page.go('/Config') which additionally calls route change handler without roundtrip to a client.

[FeodorFitsner]

https://github.com/flet-dev/examples/blob/main/python/apps/routing-navigation/home-store.py#L25

[PierreFaraut]

Thanks @FeodorFitsner!
It's working well now.
But, by mistake, I've used self.page.go and it worked. I did not understood how the page object has been shared in this class. Is it something implemented in the UserControl class?

[FeodorFitsner]

Good, thanks for the update! UserControl.page is set by a framework internally.