修复 Flet 中“控件必须先添加到页面”错误的实用指南

from flet import *
# 假设 sidebar.sidebar 模块中的 ModernNavBar 已正确定义
# from sidebar.sidebar import ModernNavBar 

class ModernNavBar(UserControl): # 示例替代，以使代码可运行
    def build(self):
        return Column([
            Text("Item 1"),
            Text("Item 2"),
        ])

class NavigationPanel(UserControl):
    def __init__(self, page):
        super().__init__()
        # self.page = page # 在 UserControl 中直接持有 page 对象通常不是最佳实践，但在此示例中为了方便传递
        self.drawer = NavigationDrawer(
            indicator_shape=None,
            controls=[
                Container(
                    height=200,
                    bgcolor='BLUE900',
                    content=Text("Welcome!", weight='BOLD', size=20),
                    margin=10,
                    padding=10,
                    border_radius=10,
                    alignment=alignment.center,
                    on_click=lambda e: print("Clickable without Ink clicked!"),
                ),
                ModernNavBar(),
            ]
        )

    def show_drawer(self, e):
        # 确保 drawer 已经关联到当前的 View
        if self.drawer.page and self.drawer.page.drawer == self.drawer:
            self.drawer.open = True
            self.drawer.update()
            print('Drawer opened')
        else:
            print("Error: Drawer not properly assigned to current view's drawer property.")


    def ApBr(self):
        return AppBar(
            title=Text('Main', weight='bold', size=18, color='WHITE'),
            leading=IconButton(icons.MENU, on_click=self.show_drawer),
            bgcolor='BLUE800'
        )

    def build(self):
        # build 方法返回 AppBar，但 drawer 本身不在此处返回，而是需要单独赋值
        return self.ApBr()

def main(page: Page):
    page.title = 'Hello'
    page.horizontal_alignment = 'center'
    page.vertical_alignment = 'center'
    page.window_width = 400
    page.window_height = 800
    page.theme_mode = ThemeMode.DARK

    menu = NavigationPanel(page) # 创建 NavigationPanel 实例

    def route_change(e: RouteChangeEvent) -> None:
        page.views.clear()

        # 初始视图
        page.views.append(
            View(
                route='/',
                controls=[
                    Text(value='MENU', size=50, color='white', font_family='bl'),
                    IconButton(
                        icon=icons.NAVIGATE_NEXT,
                        icon_color="blue400",
                        icon_size=40,
                        tooltip="Open",
                        on_click=lambda _: page.go('/main'))],
                vertical_alignment=MainAxisAlignment.CENTER,
                horizontal_alignment=CrossAxisAlignment.CENTER,
                spacing=26,
            ),
        )

        # /main 路由视图
        if page.route == "/main":
            main_view = View(
                route='/main',
                controls=[
                    menu.ApBr(), # AppBar 包含触发抽屉的按钮
                    FloatingActionButton(
                        icon=icons.ARROW_BACK_IOS_ROUNDED,
                        bgcolor='BLUE900',
                        on_click=lambda _: page.go('/')
                    ),
                    Text(
                        value='Hello',
                        size=25,
                        text_align=TextAlign.CENTER
                    ),
                    ElevatedButton(
                        "Drawer",
                        on_click=menu.show_drawer),
                ],
                vertical_alignment=MainAxisAlignment.CENTER,
                horizontal_alignment=CrossAxisAlignment.CENTER,
            )
            page.views.append(main_view)

            # 核心修复：将 NavigationDrawer 赋值给当前 View 的 drawer 属性
            # 注意：这里假设 main_view 是当前路由的唯一或主要视图
            main_view.drawer = menu.drawer
            # 或者更通用的方式，如果 main_view 是最后一个添加的视图:
            # page.views[-1].drawer = menu.drawer

        page.update()

    def view_pop(e: ViewPopEvent) -> None:
        page.views.pop()
        top_view: 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) # 初始化路由

app(target=main)

main_view.drawer = menu.drawer

page.views[-1].drawer = menu.drawer