有没有办法在 flutter 中导航到特定的孩子或行？答案

【问题标题】：Is there a way to navigate to an specific child or row in flutter?有没有办法在 flutter 中导航到特定的孩子或行？
【发布时间】：2023-02-15 19:20:46
【问题描述】：

有没有办法从一个飞镖“页面”导航到另一个飞镖“页面”中的特定点？这将使我进入给定页面

          Navigator.push(
            context,
            MaterialPageRoute(builder: (context) => WK3()),
          );

但我想导航到该页面中的特定子项或行（不幸的是，它们相当长，否则需要大量滚动）。我习惯于使用 html，您只需要使用哈希标记在页面中指示一个位置：＃这里这在 Flutter/Dart 中应该可以做到，对吧？

【问题讨论】：

标签： flutter dart

【解决方案1】：

仅使用 flutter Navigator 是不可能做到这一点的。我要解决该问题的方法是将包含滚动位置的参数传递给 Navigator，例如：

Navigator.pushNamed(
    context,
    '/wk3',
    arguments: {'scrollTo': elementId}, // or any other logic like half of the screen or so
);

要阅读有关Navigator 和参数的更多信息，您可以查看官方文档here。显然，您也可以对没有命名的路由执行此操作。

在您的目标小部件中，您可以执行以下方法。

获取参数并将其解析为您需要的任何内容。
根据您的页面和滚动行为，您可以使用initState 直接滚动到您想要的位置。接下来会发生什么取决于您的具体实现或您想要滚动的位置。在某些情况下，为滚动添加 postFrameCallBack 可能比在 initState 中添加更有用。出于教育原因，我将在下面的 sn-p 中添加它。
假设我们有一个 ScrollController 的一个 ListView 例如，由于我们传递的参数，我们导航到的小部件知道我们希望它滚动到哪里。例如，如果你在这里使用一个位置值，我们有 ScrollController 来做这样的事情：
```
controller.position.animateTo(
  widget.args.scrollTo, //make sure it has the correct type
  duration: const Duration(seconds: 1),
  curve: Curves.easeInOut,
);
```
还有一些方法可以滚动到列表或列中的某个元素（例如第 100 个元素）。查看this question 了解更多信息。您可以在下面找到一个带有滚动控制器的轻微实现：
```
 class ScreenArguments {
      final String scrollTo;
      ScreenArguments(this.scrollTo);
    }
    
    class Screen extends StatefulWidget {
      final ScreenArguments args;
    
      Screen(this.args, {Key key}) : super(key: key);
    
      @override
      ScreenState createState() => ScreenState();
    }

    class ScreenState extends State<Screen>  {
    
      @override
      void initState() {
        scrollMeTo = widget.args.scrollTo;
        scrollController = ScrollController();
        
        WidgetsBinding.instance
        .addPostFrameCallback((_) => scrollTo(context)); // this is probably safer than doing scrollTo(context) directly in your initState
enter code here
       // if you do not use addPostFrameCallback you can call scrollTo(context) directly.
       //scrollTo could use scrollControler.animateTo() etc.
  }
```
我没有 ScrollController / ListView 实现

如果情况并非如此，并且您没有ScrollController，并且只想滚动到小部件上的任何元素，事情就会变得有点复杂。在那种情况下，我建议您使用 flutters Scrollable.ensureVisible。从文档中获取，它执行以下操作：
滚动包含给定上下文的可滚动对象，以便给定的上下文可见。

假设您在 SingleChildScrollView 中有 Column 为您的滚动行为奠定基础。然后，您将为要滚动到的小部件的每个部分定义一个 GlobalKey。这个键将是我们作为参数传入的标识符。假设我们在名为 second 的小部件中有一个 GlobalKey，我们可以执行以下操作：
```
Scrollable.ensureVisible(
  GlobalObjectKey(widget.args.scrollTo).currentContext, //this would reference second
  alignment: 0.5, // 
  duration: Duration(seconds: 2),
  curve: Curves.easeInOut); 
```
您可以阅读更多关于Scrollable.ensureVisiblehere的信息。

采取何种方法取决于您的需求和您的实施。

【讨论】：