bug: Unable to see navigation bar

[Vulturu1]

Duplicate Check

• I have searched the opened issues and there are no duplicates

Describe the bug

I have a very simple root logic to control the content on my screen.

I have my root page and I navigate between pages using the push_route coroutine. However despite setting a navigation bar for my page, it does not appear on the screen. The only way I can get it to display is to manually assign it to each view. This is not ideal however as it is not code efficient and also causes the navigation bar to animate with the changing views.

I am not entirely sure why this is happening since I used the navigation bar property in the past with a container added to the page which would have its content swapped out to navigate between pages, but when switching over to using the Views in Flet, the issue arises.

Code sample

Code

import flet as ft

class Basic(ft.View):
    def __init__(self):
        super().__init__()
        self.route = '/basic'
        
        self.content = ft.Text('HELLO')
        
def main(page: ft.Page):
    
    async def change_page():
        await page.push_route('/basic')
        
    change_page()
    page.navigation_bar = ft.NavigationBar()
    
ft.app(main)

This code is an extremely simplified version which only mirrors the code structure in my actual file. If this setup does not cause issues when run, then it may be something else on my end however this is how my page haandles pages.

To reproduce

1. Run
2. nav bar not visible
3. cry

Expected behavior

Navigation bar should overlay views

Screenshots / Videos

Captures

[Upload media here]

Operating System

Windows

Operating system details

Windows 10

Flet version

0.82.2

Regression

I'm not sure / I don't know

Suggestions

No response

Logs

Logs

[Paste your logs here]

Additional details

No response

[Vulturu1]

I would also like to note that I use PyCharm and using the debug tool I could see that the navigation bar was set in the basepage to the correct navigation bar object.

[zangxx66]

I handle issues such as navigation bar in the route_change() function. Otherwise, the navigation won't be properly assigned after switching views.

def route_change(route):
        page.views.clear()
        match page.route:
            case "/":
                app_bar.title = ft.Text("main")
                drawer.selected_index = 0
                page.views.append(MainView(page))
            case "/page_2":
                app_bar.title = ft.Text("page_2")
                drawer.selected_index = 1
                page.views.append(Page_2_View(page))
            case _:
                pass
        page.appbar = app_bar
        page.drawer = drawer

[ndonkoHenri]

If i clearly understand, you’re expecting page.navigation_bar to behave like app-wide chrome that stays visible while page.push_route() changes only the routed content. However, Flet’s current routing model does not work that way. page.navigation_bar is attached to the root view, and when you navigate with page.push_route(), the active screen becomes the top View in page.views. Because of that, if you want a navigation bar visible on routed screens, it needs to be assigned when building the active View/views in page.on_route_change().