如何修复Flet框架Python安卓应用系统返回按钮跳转异常

问题原因 #

你的代码中route_change函数每次触发路由变化时，都会先执行page.views.clear()清空所有视图，再重新添加根视图(/)和当前路由对应的视图。这导致视图栈中永远只有根页面和当前页面，没有中间页面的层级记录，所以点击系统返回按钮时，只能回到根页面而非上一级页面。

另外，/main_menu页面的AppBar存在语法错误，on_click属性没有正确嵌套在AppBar参数内，会导致该返回按钮失效。

修复步骤 #

1. 移除视图栈强制清空操作：仅当路由回到根路径(/)时，才清空视图栈并重新添加根视图；其他路由下，检查视图栈顶是否已为当前路由，避免重复添加，从而维护正确的页面层级栈。
2. 修正AppBar语法错误：将返回按钮的点击事件正确绑定到AppBar的leading参数中。

修复后的完整代码 #

import flet as ft

from flet import (
    Page,
    Container,
    Row,
    Icon,
    icons,
    Text,
    ElevatedButton,
    View,
    AppBar,
    IconButton,
    Divider,
)

def main(page: Page):
    page.title = "App1"

    def route_change(route):
        # 仅在回到根页面时清空视图栈
        if page.route == "/":
            page.views.clear()
            page.views.append(
                View(
                    "/",
                    [   
                        Text(value="Application", font_family="Calibri", size=54,),
                        Divider(color="blue", height=100),
                        ElevatedButton("Start", on_click=lambda _: page.go("/main_menu")),    
                    ],
                    bgcolor="blue",
                    horizontal_alignment="center",
                    padding=90
                )
            )
        # 处理主菜单页面：栈顶不是当前路由时才添加
        elif page.route == "/main_menu":
            if not page.views or page.views[-1].route != "/main_menu":
                page.views.append(
                    View(
                        "/main_menu",
                        [
                            # 修正AppBar的语法错误，添加返回按钮
                            AppBar(
                                bgcolor="green",
                                leading=IconButton(
                                    icon=icons.ARROW_BACK,
                                    on_click=lambda _: page.go("/")
                                )
                            ),
                            Text(value="Example1", size=32, font_family="Open Sans", color="black",),
                            Divider(height=50, color="white"),
                            Row(
                                [
                                    Container(Icon(name=icons.APPLE), on_click=lambda _: page.go("/section1"), padding=20),
                                    Container(Icon(name=icons.MUSIC_NOTE), on_click=lambda _: page.go("/section2"), padding=20)
                                ]
                            ),
                        ],
                        bgcolor="white"
                    )
                )
        # 处理section1页面：栈顶不是当前路由时才添加
        elif page.route == "/section1":
            if not page.views or page.views[-1].route != "/section1":
                page.views.append(
                    View(
                        "/section1",
                        [
                            AppBar(
                                leading=IconButton(
                                    icon=icons.ARROW_BACK,
                                    on_click=lambda _: page.go("/main_menu"),
                                    icon_color="black"
                                ),
                                bgcolor="green",
                            ),
                            Text("Section1")
                        ],
                    )
                )
        # 处理section2页面：栈顶不是当前路由时才添加
        elif page.route == "/section2":
            if not page.views or page.views[-1].route != "/section2":
                page.views.append(
                    View(
                        "/section2",
                        [
                            AppBar(
                                leading=IconButton(
                                    icon=icons.ARROW_BACK,
                                    on_click=lambda _: page.go("/main_menu"),
                                    icon_color="black"
                                ),
                                bgcolor="green",
                            ),
                            Text("Section2")
                        ],
                    )
                )
        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,)

原理说明 #

修复后，视图栈会正确记录页面的访问层级（比如/ → /main_menu → /section1），当点击系统返回按钮时，view_pop函数会从栈中移除当前页面，然后跳转到栈顶的上一级页面路由，实现正常的返回逻辑。

内容的提问来源于stack exchange，提问作者Answere