Add Size Effect

[drown0315]

Size Effect

Unlike the scale Effect, this effect does affect the real size of the widget, including its clipping behavior, but does not apply scaling.

This is achieved using a combination of ClipRect and Align widgets:

  Widget build(
    BuildContext context,
    Widget child,
    AnimationController controller,
    EffectEntry entry,
  ) {
    final animation = buildAnimation(controller, entry);
    return getOptimizedBuilder<double>(
      animation: animation,
      builder: (_, __) {
        return ClipRect(
          child: Align(
            alignment: alignment ?? Alignment.center,
            widthFactor: fixedWidthFactor ?? math.max(animation.value, 0.0),
            heightFactor: fixedHeightFactor ?? math.max(animation.value, 0.0),
            child: child,
          ),
        );
      },
    );

Use Example

Here’s a simple example of how to use the Size Effect:

Container(
    width:  200,
    height: 100,
    color: Colors.black,
).animate().sizeX();

Preview

screencapture-1734599261008.mp4

[gskinner]

@drown0315 — thanks for the PR. I haven't looked over the code yet, but in terms of naming, I believe this is less of a SizeEffect and more of a ClipRectEffect or maybe CropEffect.

There is actually a use case for a SizeEffect that would resize the child widget as well.

[drown0315]

In fact, its implementation is based on SizeTransition, so the name SizeEffect is used accordingly. It also actually affects the size of the widget.

Align widthFactor and heightFactor does affect size of renderBox.

[git-boya]

I hope this PR will be merged, i need affect size animation