如何仅在用户滚动时显示小部件？

Question

我想隐藏屏幕上的按钮并在用户开始滚动直到最后一次滚动后的 5 秒内显示它们。

我用 GestureDetector 包装了我的 SingleChildScrollView 并更改了 onTap 回调的可见性值以使用 Visibility 小部件隐藏我的按钮。但是，GestureDetector 上没有像 onScroll 这样的事件。

有没有人成功地实现了那个效果，或者有没有内置动画可以实现我想要实现的效果？

Answer 1

你说得对，GestureDetector上没有任何onScroll个事件，但是有onVerticalDrag个事件，基本上是一样的，只是换了个名字。

但是，为此，您实际上并不需要 GestureDetector。您可以收听滚动更改，使用 NotificationListener 处理 ScrollStartNotification 和 ScrollEndNotification 通知，因为您已经在使用 SingleChildScrollView.

我创建了一个小示例来向您展示将生成以下内容的示例：在滚动时，显示按钮的标志设置为 true，最后，它将重置回 false 并在 5 秒后重建没有按钮的树，如果两者之间没有更多的滚动通知（这就是为什么您不在 Future 完成之后但之前设置 _buttonShowing = false 的原因。

bool _buttonShowing = false;

  @override
  Widget build(BuildContext context) {
    List<Widget> columnWidgets = List<Widget>.filled(100, Container(height: 100.0, child: Placeholder()));

    if (_buttonShowing) {
      columnWidgets = List.from(columnWidgets)
        ..insert(
            3, Visibility(child: RaisedButton(child: Text('Press me'), onPressed: () {}), visible: _buttonShowing));
    }

    return Scaffold(
      appBar: AppBar(),
      body: NotificationListener<ScrollNotification>(
        onNotification: (scrollNotification) {
          if (scrollNotification is ScrollStartNotification) {
            if (!_buttonShowing) {
              setState(() => _buttonShowing = true);
            }
          } else if (scrollNotification is ScrollEndNotification) {
            if (_buttonShowing) {
              _buttonShowing = false;
              Future.delayed(Duration(seconds: 5)).then((_) => setState(() {}));
            }
          }
        },
        child: SingleChildScrollView(
          child: Column(crossAxisAlignment: CrossAxisAlignment.stretch, children: columnWidgets),
        ),
      ),
    );
  }

如何仅在用户滚动时显示小部件？

How to show a widget only when user is scrolling?

scroll

dart

flutter

flutter-layout