搜索插件、代码仓与 APP 分类

GitHub 代码仓adrianflutur/flutter_improved_scrolling

flutter_优化滚动

尝试为 Flutter Web 和桌面端实现更好的滚动效果。包含键盘、MButton 和自定义鼠标滚轮滚动。

flutter_优化滚动 项目封面
星标
50
复刻
25
最近推送(UTC)
2026年1月27日
项目状态
未归档

原始 README

以下为英文项目原文快照,最新内容请访问 GitHub。

This package has been deprecated

improved_scrolling

pub package

An attempt to implement better scrolling for Flutter Web and Desktop.
Includes keyboard, MButton and custom mouse wheel scrolling.

Getting started


Example




Usage and features

(from the example app)

final controller = ScrollController();

...

ImprovedScrolling(
      scrollController: controller,
      onScroll: (scrollOffset) => debugPrint(
        'Scroll offset: $scrollOffset',
      ),
      onMMBScrollStateChanged: (scrolling) => debugPrint(
        'Is scrolling: $scrolling',
      ),
      onMMBScrollCursorPositionUpdate: (localCursorOffset, scrollActivity) => debugPrint(
            'Cursor position: $localCursorOffset\n'
            'Scroll activity: $scrollActivity',
      ),
      enableMMBScrolling: true,
      enableKeyboardScrolling: true,
      enableCustomMouseWheelScrolling: true,
      mmbScrollConfig: MMBScrollConfig(
        customScrollCursor: useSystemCursor ? null : const DefaultCustomScrollCursor(),
      ),
      keyboardScrollConfig: KeyboardScrollConfig(
        arrowsScrollAmount: 250.0,
        homeScrollDurationBuilder: (currentScrollOffset, minScrollOffset) {
          return const Duration(milliseconds: 100);
        },
        endScrollDurationBuilder: (currentScrollOffset, maxScrollOffset) {
          return const Duration(milliseconds: 2000);
        },
      ),
      customMouseWheelScrollConfig: const CustomMouseWheelScrollConfig(
        scrollAmountMultiplier: 2.0,
      ),
      child: ScrollConfiguration(
        behavior: const CustomScrollBehaviour(),
        child: GridView(
          controller: controller,
          physics: const NeverScrollableScrollPhysics(),
          scrollDirection: axis,
          padding: const EdgeInsets.all(24.0),
          gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(
            maxCrossAxisExtent: 400.0,
            mainAxisExtent: 400.0,
          ),
          children: buildScrollableItemList(axis),
        ),
      ),
    );

Requirements
  • The ImprovedScrolling Widget must be added as a parent of your scrollable Widget (List/Grid/SingleChildScrollView/etc).
  • You must create and provide the same scroll controller to both the ImprovedScrolling Widget and your scrollable Widget.
  • Optional: If you want to programatically scroll when rotating the mouse wheel and not let the framework manage the scrolling, you can set physics: NeverScrollableScrollPhysics() to your scrollable and then set enableCustomMouseWheelScrolling: true on ImprovedScrolling to enable this feature.

Features:
  • Scrolling using the keyboard (Arrows, Page{Up, Down}, Spacebar, Home, End)

    You need to set enableKeyboardScrolling: true and then you can configure the scrolling amount, duration and curve by using keyboardScrollConfig: KeyboardScrollConfig(...)

  • Scrolling using the middle mouse button ("auto-scrolling")

    You need to set enableMMBScrolling: true and then you can configure the scrolling delay, velocity, acceleration and cursor appearance and size by using mmbScrollConfig: MMBScrollConfig(...)

    There is also a DefaultCustomScrollCursor class which is a default custom cursor implementation

  • Programatically scroll using the mouse wheel

    You need to set enableCustomMouseWheelScrolling: true and then you can configure the scrolling speed, duration, curve and throttling time by using customMouseWheelScrollConfig: CustomMouseWheelScrollConfig(...)

  • Horizontal scrolling using Left/Right arrows or Shift + mouse wheel

    Requires enableKeyboardScrolling: true and enableCustomMouseWheelScrolling: true to be set.


Callbacks:
Other than the above features, there are also a few callbacks available on the ImprovedScrolling Widget:

// Triggers whenever the ScrollController scrolls, no matter how or why
onScroll: (double scrollOffset) => debugPrint(
  'Scroll offset: $scrollOffset',
),

// Triggers whenever the middle mouse button scrolling feature is activated or deactivated
onMMBScrollStateChanged: (bool scrolling) => debugPrint(
  'Is scrolling: $scrolling',
),

// Triggers whenever the cursor is moved on the scrollable area, while the
// middle mouse button feature is active and is scrolling
//
// We also get the current scroll activity (idle or moving up/down/left/right)
// at the time the cursor moves
onMMBScrollCursorPositionUpdate: (
  Offset localCursorOffset,
  MMBScrollCursorActivity scrollActivity,
) => debugPrint(
    'Cursor position: $localCursorOffset\n'
    'Scroll activity: $scrollActivity',
 ),

License

MIT

Adrian Flutur GitHub avatar
GitHub 作者

Adrian Flutur ↗

语言DartHTMLSwiftKotlinObjective-C

使用的依赖

依赖清单 3 项

  • flutter{"sdk":"flutter"}
  • flutter_test开发依赖{"sdk":"flutter"}
  • lint开发依赖^1.6.0

如何选择适合项目的代码仓?

先按使用场景筛选,再比较项目活跃情况,最后到原始仓库核对使用要求。

  1. 通过仓库名、作者或描述搜索,再按技术分类缩小范围。
  2. 结合星标、复刻与最近推送比较项目;星标反映社区关注,不代表质量保证。
  3. 使用前在 GitHub 核对 README、许可证与 Issues。

来源与维护

“A repository is the most basic element of GitHub.”

GitHub Docs — About repositories ↗