视觉效果

Flutter 的 VisualEffect API,可轻松为您的 widget 添加绘制效果。

警告 该软件包目前仍处于实验阶段。API 可能会随时更改。

滚动效果

此 API 的主要目的是提供一种简单有效的方式来应用滚动动画。

例如,可以通过以下代码实现此卡片堆叠效果

Card Stack

class _ScrolledItem extends StatelessWidget {
  const _ScrolledItem();

  @override
  Widget build(BuildContext context) {
    return ScrollEffect(
      onGenerateVisualEffect: (effect, phase) {
        return effect
            .grayscale(phase.leadingLerp(to: 0.5))
            .scale(
              phase.isLeading ? phase.leadingLerp(from: 1, to: 0.9) : 1,
              anchor: Alignment.topCenter,
            )
            .translate(y: effect.childSize.height * phase.leading);
      },
      child: const _CardItem(),
    );
  }
}

GitHub

查看 Github