flutter 滚动到指定位置

1,实现步骤 通过GlobalKey 可以获取某个widget 的位置,得到位置我们通过滚动视图的jumpTo方法滚动到指定位置

获取当前widget 的位置

GlobalKey    goodsHeightY = _renderObjectY(goodsGlobalKey);
//进行跳转
  _scrollController.animateTo(goodsHeightY ,
          duration: Duration(milliseconds: 2), curve: Curves.ease);

  //获取某个widget 的坐标 我们这里可以得到
  double _renderObjectY(GlobalKey globalKey){
    RenderObject evaluationRenderObject = globalKey.currentContext.findRenderObject();
    return  evaluationRenderObject.getTransformTo(null)?.getTranslation().y;
  }

根据滚动的偏移量是对应的按钮选中



//widget 布局 child 是滚动视图
 NotificationListener(
              //实现对列表得监听  --  接收 onNotification 得回调,每次滚动得时候都会回调这个函数
              onNotification: (scrollNotification) {
                print( scrollNotification.depth);
                if (scrollNotification is ScrollUpdateNotification &&
                    scrollNotification.depth == 0) {
                  //1、只监测ListView的滚动(深度设为0),2、监测滚动的时候(ScrollUpdateNotification)
                  _scrollControllerOffset(scrollNotification);
                }
                return true;
              },
              child: _bodyWidget(),
        ),

 //监听滚动
  void _scrollControllerOffset(notification){
    if (notification is ScrollStartNotification) {
      // print("开始滚动");
    } else if (notification is ScrollUpdateNotification) {
      // print("正在滚动。。。总滚动距离:${notification.metrics.maxScrollExtent}");
    } else if (notification is ScrollEndNotification) {
      // print("结束滚动");
    }
    _updateNavigationTabBarIndex();
  }

  // 滚动更新 选中 ~
  void _updateNavigationTabBarIndex(){
//获取当前滚动视图的偏移量
        double offset = _scrollController.offset;    
  //  根据计算 大于 widget的Y或者小于多少widget的Y 使按钮选中就行了。 Widget 的位置是可以通过GlobalKey来获得的
}

如果进入页面需要请求数据在渲染布局 获取不到widget的真实位置的话 可以setstate 后 延迟一秒来获取widget的位置
//获取个个widget 的高度 !

  void _getWidgetHeight(){

    Future.delayed(Duration(seconds: 1), () {
        //  调用获取widget 位置的方法
    });
  }

//具体实现效果


Untitled.gif

你可能感兴趣的:(flutter 滚动到指定位置)