时间戳

首页 > 解决方案 > 颤动 scollable.ensurevisible 不能反向工作

flutter - 颤动 scollable.ensurevisible 不能反向工作

问题描述

请查看视频/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,
                  ),

标签： fluttertabstabbarscrollableflutter-pageview

解决方案

没有人回答我的问题。但是，经过大量的努力和时间。我找到了解决此问题的解决方法。希望这是一个错误，并会在即将到来的更新中由颤振团队修复。

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

此函数有一个称为对齐的可选参数，可以对其进行调整以确保所选元素/按钮位于视口的中心。（在我的情况下水平居中）。

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

alignment: 0

从左到右滑动页面视图，它工作正常。但是，当我从右向左滑动页面以转到 PageView 小部件中的上一页时，通过这种对齐方式，ensureVisible 无法按预期工作。选定的元素/按钮不在视图中。我实验发现，当我使用

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,
                    );
                  }}

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

推荐阅读