flutter_scroll_shadow

插件介绍

基于插件公开信息、社区数据与项目使用情况整理的选型参考。

Flutter Scroll Shadow 是一个轻量级包，为可滚动控件添加动态阴影，增强视觉深度和用户反馈。它支持垂直和水平滚动，并与 ScrollController 完全兼容。适用于在 Android、iOS、Web、macOS、Windows 和 Linux 等主要平台上提升列表、网格及其他可滚动内容的美观性。随着用户滚动，阴影会实时调整，营造出微妙而有效的视觉效果。

适合场景

增强列表项的可见性
在可滚动界面中创建深度
通过视觉反馈改善用户体验
为仪表板布局增添精致感
支持深色模式设计

主要特点

实时阴影调整
支持垂直和水平滚动
ScrollController 集成
跨平台兼容性
最小性能开销

适合对象

寻求视觉精致的UI设计师
开发滚动密集型应用的开发者
需要微妙动画的应用程序
针对多个平台的项目
专注于响应式设计的团队

使用建议

可能会影响低端设备的性能
阴影外观取决于主题和背景
超出阴影强度之外的自定义功能有限
不适合复杂的滚动行为
需要在不同屏幕尺寸上进行仔细测试

以下为关联源码仓库的 README 原文快照，最新内容请访问源码仓库。

Scroll Shadow

ScrollShadow is a widget for Flutter that adds shadows to a scrollable child.

Supports ScrollController and vertical or horizontal orientation.


ScrollShadow

Features

Adds shadows over a scrollable child while not at its max extents
Supports vertical and horizontal Axis
Customizable animation duration
Determine how wide or tall shadows render

Usage

Make sure to check out the examples on GitHub.

Installation

Add the following line to pubspec.yaml:

dependencies:
  flutter_scroll_shadow: <last-release>

Basic setup

Complete example available here.

ScrollShadow(
  color: Colors.grey,
  child: ListView(
    children: List.generate(20, (index) => ListTile(title: Text('Element $index'),)),
  ),
);

Properties

color: for the shadows; default: Colors.grey
size: The width or height of shadows, depending on Axis; default: 15.0
child: Scrollable child contained by the ScrollShadow
duration: Milliseconds, as an int, for animation of shadow visibility changes; default: 300
fadeInCurve: The animation [Curve] to use for shadow appearance; default: Curves.easeIn
fadeOutCurve: The animation [Curve] to use for shadow disappearance; default: Curves.easeOut
ignoreInteraction: Determines if shadow is wrapped inside a [IgnorePointer] widget, so that all touch events with the shadow will be ignored; default: true