颤动 scollable.ensurevisible 不能反向工作

Question

请查看视频/gif：

我的综合浏览量将使当前选项卡处于活动状态。我需要确保活动选项卡始终可见，即使用户多次滑动屏幕也是如此。它是从左到右工作的。但是当我们尝试从右向左返回时，它的行为并不像预期的那样。

页面视图文件

         PageView(
            controller: pageController,
            onPageChanged: (int page) {
              _duaWidgetState.currentState.updateBtn(page + 1);
              Scrollable.ensureVisible(
                  _duaWidgetState.currentState.activeBtn.currentContext);
            },
            children: loaded

带滚动视图文件的 TabBarWidget

    GlobalKey activeBtn = GlobalKey();
      var _selectedTab = 1;
      @override
      Widget build(BuildContext context) {
        return Container(
          padding: EdgeInsets.symmetric(vertical: 20),
          child: SingleChildScrollView(
            scrollDirection: Axis.horizontal,
            child: Row(
              children: List.generate(widget.numberOfTab,
                  (index) => tabBarItem(index + 1, widget.numberOfTab, activeBtn)),
            ),
          ),
        );
      }

使用密钥的容器

               Container(
                  key: activeBtn,
                  margin: EdgeInsets.only(left: 20),
                  padding: EdgeInsets.symmetric(
                    vertical: 10,
                    horizontal: 24,
                  ),

Answer 1

没有人回答我的问题。但是，经过大量的努力和时间。我找到了解决此问题的解决方法。希望这是一个 bug，flutter 团队会在接下来的更新中修复它。

Scrollable.ensureVisible(_duaWidgetState.currentState.activeBtn.currentContext);

此函数有一个称为对齐的可选参数，可以对其进行调整以确保所选 element/button 位于视口的中心。（在我的例子中水平居中）。

我的小部件是水平滚动的，所以我需要根据PageView()的结果更新页码，这里我使用

alignment: 0

从左向右轻扫页面视图，它工作正常。但是，当我从右向左滑动页面以转到 PageView 小部件中的上一页时，使用这种对齐方式，ensureVisible 无法按预期工作。所选 element/button 不在视图中。我试验了一下，发现当我使用

aligment: 1

ensureVisible 在从右向左滑动但同时工作正常。当我从左向右滚动时，同样的问题发生了。

最后，我设法采取了一些解决方法来解决此问题。解决方案是将最后一页索引存储在一个变量中，并检查最后一页是否大于新页面然后 alignment: 0 如果最后一页小于新页面 aligment:1 就像这样。

   PageView(
    onPageChanged: (int page) {
    if (lastPage < page) {
    Scrollable.ensureVisible(
    _duaWidgetState.currentState.activeBtn.currentContext,
     
     alignment: -0.0100,
     );
     } else {
     Scrollable.ensureVisible(
        _duaWidgetState.currentState.activeBtn.currentContext,
                        (Perfect For font size 24)
     alignment: 1.005,
                    );
                  }}

希望我的回答对以后的人有所帮助。

颤动 scollable.ensurevisible 不能反向工作

flutter scollable.ensurevisible not working in reverse direction

flutter

tabs

tabbar

scrollable

flutter-pageview