如何使用按钮在小部件内滚动？

Question

我正在用 flutter 构建一个 WebApp，我有一个 SingleChildScrollView 里面有一些小部件。当我按下按钮时，我希望 appbar 上的按钮将我带到相应的小部件。那可能吗？这里附上部分代码。

    Widget build(BuildContext context) {
        return Scaffold(
          extendBodyBehindAppBar: true,
          appBar: CustomAppBar(),
          backgroundColor: Colors.white,
          body: SingleChildScrollView(
            controller: widget.homeController,
            child: Column(
              children: [
                Inicio(),
                Services(),
                QuienesSomos(),
                ContactForm(),
                BottomInfo(),
              ],
            ),
          ),
        );
       }

所以我在 appbar 上每个 SingleChildScrollView 中的每个 children 都有一个按钮，我希望当我按下相应按钮时，它会向下滚动到相应部分在小部件上。我尝试使用 Navigator.of().PushNamed 但它会打开一个新屏幕而不是向下滚动。有任何想法吗？提前致谢！

Answer 1

要控制位置，您必须管理 SingleChildScrollView 的控制器。

如果你想顺利通过某个部分，你可以将控制 SingleChildScrollView 控制器的功能附加到按钮：

widget.homeController.animateTo(
  0.0, // change 0.0 {double offset} to corresponding widget position
  duration: Duration(seconds: 1),
  curve: Curves.easeOut,
);

如果你只是想瞬间跳到位置：

  widget.homeController.jumpTo(0.0); // change 0.0 {double value} to corresponding widget position

Answer 2

我可以通过使用来实现我的目标，

                onPressed: () {
                  Scrollable.ensureVisible(servicesKey.currentContext,
                      duration: Duration(seconds: 1),
                      curve: Curves.easeOut);
                },

并在每个小部件中分配相应的键。

Answer 3

制作滚动控制器：

  ScrollController myController = ScrollController();

并将其附加到您的 SingleChildScrollView 小部件：

  SingleChildScrollView(
     controller: myController,
     child: ...

现在创建一个 GlobalKey：

  final anchor = GlobalKey();

将它附加到您的任何小部件：

  Container(
    key: anchor,
    child: ...
  ),

就是这样，现在您可以使用滚动控制器以编程方式滚动到此小部件：

myController.position.ensureVisible(
   anchor.currentContext.findRenderObject(),
   alignment: 0.5,
   duration: const Duration(seconds: 1),
);

如何使用按钮在小部件内滚动？

How to scroll withing a widget with a button?

flutter

singlechildscrollview