Flutter Scrollbar滑动条与SingleChildScrollView的结合使用的小细节

我在业务开发中,ListView是竖向滑动的,然后 ListView中的每一个小条目比较长,我需要横向滑动,所以 就有了 ListView中多个SingleChildScrollView(横向滑动),但是在视觉上,我期望告知用户可以横向滑动,所以有了 Scrollbar 结合 SingleChildScrollView 来使用。

但是两者来使用,多多少少会有点问题,本文章记录小问题。 先来看下我的效果

最终的核心代码是

dart 复制代码
    Scrollbar(
      thickness: 2.0,//滑动条的高度
      interactive: true,//滑动条为true 可拖动
      isAlwaysShown: true,//一直显示滑动条
      controller: ScrollController(),//滑动条使用的控制器
      child: SingleChildScrollView(
        scrollDirection : Axis.horizontal,
        primary: true,
        physics: const BouncingScrollPhysics(),
        child: Row(
          children: [...此处省略],
        ),
      ),
    ),

1 错误一 The Scrollbar's ScrollController has no ScrollPosition attached.

解决方法就是设置一下滑动组件的 primary 属性为 true

2 错误二 Failed assertion: line 243 pos 14: 'notification.metrics.axis == widget.axis': is not true.

我要在一个页面循环渲染多个ListView、SingleChildScrollView 横向滚动组件,导致了滚动手势监听溢出冲突的问题 解决方法就是 设置一下 physics 属性值

dart 复制代码
physics: const BouncingScrollPhysics(),

比如我这里

相关推荐
小蜜蜂嗡嗡3 小时前
Android Studio flutter项目运行、打包时间太长
android·flutter·android studio
瓜子三百克7 小时前
十、高级概念
flutter
帅次20 小时前
Objective-C面向对象编程:类、对象、方法详解(保姆级教程)
flutter·macos·ios·objective-c·iphone·swift·safari
小蜜蜂嗡嗡20 小时前
flutter flutter_vlc_player播放视频设置循环播放失效、初始化后获取不到视频宽高
flutter
孤鸿玉1 天前
[Flutter小技巧] Row中widget高度自适应的几种方法
flutter
bawomingtian1231 天前
FlutterView 源码解析
flutter
Zender Han1 天前
Flutter 进阶:实现带圆角的 CircularProgressIndicator
flutter
nc_kai1 天前
Flutter 之 每日翻译 PreferredSizeWidget
java·前端·flutter
littlegnal1 天前
Flutter Add-to-app profiling
flutter