如何检测用户最后滚动的方向

Question

我有下面的代码，可以更改用户向下或向上滚动时的工厂不透明度。但为了它，我setState()多次调用该方法。有没有什么方法可以检测用户滚动的最后一个方向，以便我可以setState()在那一刻调用一次？或者，如果您可以为此定义一个新的增强功能，我将不胜感激。

@override
void initState() {
super.initState();
_controller = ScrollController()
  ..addListener(() {
    upDirection = _controller.position.userScrollDirection == ScrollDirection.forward;
    upDirection = _controller.position.userScrollDirection == ScrollDirection.reverse;


      if (upDirection)
        setState(() {
          _scrolled = 0.5;
          flag = false;
        });
      else if (!upDirection) {
        setState(() {
          _scrolled = 1.0;
        });
        flag = false;
      }

  });
}

这是清单

    return Scaffold(
    body:
    SingleChildScrollView(
      controller: _controller,
      child: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Container(),
            Container(),
            Container(),
            Container(),
            Container(),
            Container(),
          ],
        ),
      ),
    ),

  floatingActionButton: AnimatedOpacity(
    opacity: _scrolled,
    duration: Duration(milliseconds: 100),
    child: FloatingActionButton(
      onPressed: (){},
      child: Icon(Icons.settings),
          ),
        ),
  floatingActionButtonLocation: FloatingActionButtonLocation.endFloat,
);

Answer 1

问题是，每次控制器上有新事件时，您添加的侦听器都会被调用。这就是为什么你setState会被反复打电话。

您可以使用标志来防止setState重复调用。

工作代码：

void initState() {
    ScrollDirection _lastScrollDirection; // <---- Notice the new variable here.
    _controller = ScrollController();

    _controller.addListener(() {
      if (_lastScrollDirection != _controller.position.userScrollDirection) {
        _lastScrollDirection = _controller.position.userScrollDirection;

        setState(() {
          //You can set whatever you want here. 
          //It will only get called once when user changes direction.
        });

        print('Scroll direction changed --> $_lastScrollDirection');
      }
    });
    super.initState();
  }

演示：