如何在 flutter 中的单页 Web 应用程序中实现导航?
How to implement navigation in a single page web application in flutter?
我在 flutter 中创建的 UI 单页 Web 应用程序有点复杂。
作为最后一篇文章,我正在努力实现导航,所有可在线找到的示例都集中在多页用例上。
AppBar(
Row(
children: [
Button("Gallery"),
Button("Faq"),
Button("Contact"), #after clicking this button
]
),
),
SingleChildScrollView(
child: Column(
children: [
GallerySection(...),
FaqSection(...),
ContactSection(...), #scroll to this section/container
]
),
);
这个想法是实现导航,在按下一个 appBar 按钮后,用户将滚动到请求的部分。
我不太在意 url 格式,它可以保留 www.flutter-single-page.com/#
但有后退导航会很出色 :-),但可选。
您知道如何实现这一点吗?
您可以使用 scrollController 通过它的 ensureVisible
方法滚动到小部件。然后你只需为每个部分分配一个键并调用 ensureVisible 进行导航。
以为例
我在 flutter 中创建的 UI 单页 Web 应用程序有点复杂。 作为最后一篇文章,我正在努力实现导航,所有可在线找到的示例都集中在多页用例上。
AppBar(
Row(
children: [
Button("Gallery"),
Button("Faq"),
Button("Contact"), #after clicking this button
]
),
),
SingleChildScrollView(
child: Column(
children: [
GallerySection(...),
FaqSection(...),
ContactSection(...), #scroll to this section/container
]
),
);
这个想法是实现导航,在按下一个 appBar 按钮后,用户将滚动到请求的部分。
我不太在意 url 格式,它可以保留 www.flutter-single-page.com/#
但有后退导航会很出色 :-),但可选。
您知道如何实现这一点吗?
您可以使用 scrollController 通过它的 ensureVisible
方法滚动到小部件。然后你只需为每个部分分配一个键并调用 ensureVisible 进行导航。
以