[Question] What is the best approach for navigation in Flet with a large folder structure?

[tanmay-bhatgare]

Question

I had planned to make a task manager app with Flet and custom FastAPI backend but I stuck on the perfect way for routing. The main problem is navigating backward with flet default on_view_pop function it just don't trigger with current implementation for routing back arrow neither I get back arrow in my AppBar . This is Repository I am working on. Currently routing depends on following files:

• utils/view_handler.py
• ./main.py
  If anyone can help me solving this issue, I would be greatful.😄

Code sample

# main.py
import warnings
import flet as ft

# from utils
from utils.view_handler import view_handler
from constants.constants import Routes

warnings.filterwarnings("ignore")


async def main(page: ft.Page):
    page.vertical_alignment = ft.MainAxisAlignment.CENTER
    page.horizontal_alignment = ft.CrossAxisAlignment.CENTER

    history = []

    def route_change(event: ft.RouteChangeEvent):
        route = event.route
        if page.views:
            history.append(page.views[-1].route)

        page.views.clear()
        try:
            page.views.append(
            view_handler(page)[route],
        )
        except Exception:
            view_handler(page)[Routes.error_page]
        page.update()

    def view_pop(view):
        if len(page.views) > 1:
            history.pop()

            previous_route = history.pop() if history else "/"
            page.go(previous_route)
        else:
            page.go("/")

    page.on_route_change = route_change
    page.on_view_pop = view_pop

    page.go("/")


ft.app(target=main, assets_dir="./assets")

#view_handler.py
import flet as ft
from constants.constants import Routes
from views.views import HomeView, LoginView


def view_handler(page: ft.Page):
    return {
        f"{Routes.home_route}": ft.View(
            appbar=ft.AppBar(
                title=ft.Text(
                    "Welcome to the Homepage", size=20, color=ft.colors.WHITE
                ),
                bgcolor=ft.colors.BLUE_700,
            ),
            vertical_alignment=ft.MainAxisAlignment.CENTER,
            horizontal_alignment=ft.CrossAxisAlignment.CENTER,
            route=Routes.home_route,
            controls=[HomeView(page=page)],
        ),
        f"{Routes.login_route}": ft.View(
            appbar=ft.AppBar(
                leading=ft.IconButton(
                    icon=ft.icons.ARROW_BACK
                    if page.platform
                    in [
                        ft.PagePlatform.WINDOWS,
                        ft.PagePlatform.LINUX,
                        ft.PagePlatform.ANDROID,
                    ]
                    else ft.icons.ARROW_BACK_IOS_NEW,
                    on_click=lambda _: page.go("/"),
                ),
                automatically_imply_leading=True,
                title=ft.Text("Login", size=20, color=ft.colors.WHITE),
                bgcolor=ft.colors.SURFACE_VARIANT,
            ),
            vertical_alignment=ft.MainAxisAlignment.CENTER,
            horizontal_alignment=ft.CrossAxisAlignment.CENTER,
            route=Routes.login_route,
            controls=[LoginView(page=page)],
        ),
    }

Error message

Nothing Here.

------------------------------------------------------

• I have searched for answers to my question both in the issues and in previous discussions.

[xzripper]

I know it's too late, but try out flet_navigator