如何在 flutter 中按下按钮时导航到同一页面中的特定部分 |颤振网

Question

我用flutter创建了一个网页，上面有三个按钮experience，education和contact。我在同一页面中为这三个创建了不同的部分。问题是当按下体验时，应该需要导航或滚动页面到该部分。我如何在 flutter 中实现它。

Answer 1

首先，如果你在生产级别制作静态网页，你应该考虑一些轻量级的东西，比如 vanilla js 或其他 js 框架。 Flutter 主要用于制作渐进式 Web 应用程序。你应该看看 flutter web 项目与其他框架相比的加载时间。但如果是为了大学项目什么的，那也没关系。

对于您的疑问，我猜您可能正在为您的网页使用 ListView、SingleChildScrollView 或 GridView。在那种情况下，您应该看看 ScrollController 小部件。

初始化你的控制器：

滚动控制器 _controller = ScrollController();

您可以像这样将此控制器附加到您的 ListView：

ListView(
                  controller: _controller,
                  children: [/* List of Widgets */],
                ),

现在，在按钮的 onPressed 函数中执行以下操作：

_controller.animateTo(
  /* distance from the top of the listView where you want to animate your list to*/,
  duration: Duration(seconds: 1),
  curve: Curves.fastOutSlowIn,
);

如何在 flutter 中按下按钮时导航到同一页面中的特定部分 |颤振网

How to Navigate to a particular section in same page when press a button in flutter | Flutter Web

dart

flutter

flutter-web