美文网首页
flutter 滚动到指定位置

flutter 滚动到指定位置

作者: Faith_K | 来源:发表于2021-11-12 11:53 被阅读0次

    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 滚动到指定位置

          本文链接:https://www.haomeiwen.com/subject/toonzltx.html