Flutter 动态动画插件 dynamic_animation 的使用

dynamicTo 函数是 AnimationController 的扩展方法。它启动一个基于弹簧的动画，从当前状态（由 from 和 velocity 确定）过渡到指定的 target 值。

参数

• target (double, 必需): 定义目标值。
• from (double, 可选): 表示起始值。如果未提供，则默认为 AnimationController 的当前值。
• velocity (double, 可选): 表示起始速度。默认为 AnimationController 的当前速度。
• springDescription (SpringDescription, 可选): 描述弹簧行为。默认为 defaultSpringDescription。
• tolerance (Tolerance, 可选): 确定可接受的偏差。默认为 Tolerance.defaultTolerance。

总之，dynamicTo 提供了一种方便的方法来在 AnimationController 上创建弹簧动画，允许轻松指定目标值，并可选地自定义起始状态和弹簧行为参数。

示例代码

import 'package:example/spring_controller_panel.dart';
import 'package:flutter/material.dart';
import 'package:dynamic_animation/dynamic_animation.dart';

void main() {
  runApp(const MaterialApp(home: DynamicAnimationDemo()));
}

const _logoSize = 128.0;

class DynamicAnimationDemo extends StatefulWidget {
  const DynamicAnimationDemo({super.key});

  [@override](/user/override)
  State<DynamicAnimationDemo> createState() => _DynamicAnimationDemoState();
}

class _DynamicAnimationDemoState extends State<DynamicAnimationDemo> with TickerProviderStateMixin {
  var _mass = 30.0;
  var _stiffness = 1.0;
  var _damping = 1.0;
  late final _controllerX = AnimationController.unbounded(vsync: this);
  late final _controllerY = AnimationController.unbounded(vsync: this);

  // 获取弹簧描述
  SpringDescription get _spring {
    return SpringDescription(
      mass: _mass,
      stiffness: _stiffness,
      damping: _damping,
    );
  }

  // 动画到指定位置
  void _animateTo(Offset target) {
    _controllerX.dynamicTo(
      target.dx,
      springDescription: _spring,
    );
    _controllerY.dynamicTo(
      target.dy,
      springDescription: _spring,
    );
  }

  // 更新弹簧属性
  void _updateSpringProps({
    double? mass,
    double? stiffness,
    double? damping,
  }) {
    setState(() {
      _mass = mass ?? _mass;
      _stiffness = stiffness ?? _stiffness;
      _damping = damping ?? _damping;
    });
  }

  [@override](/user/override)
  void dispose() {
    _controllerX.dispose();
    _controllerY.dispose();
    super.dispose();
  }

  [@override](/user/override)
  void didChangeDependencies() {
    final size = MediaQuery.of(context).size;
    _controllerX.value = size.width / 2;
    _controllerY.value = size.height / 2;
    super.didChangeDependencies();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Container(
          color: Colors.white,
          child: Stack(
            children: [
              // 手势识别器
              GestureDetector(
                onTapDown: (details) {
                  _animateTo(details.localPosition);
                },
              ),
              // 动画构建器
              AnimatedBuilder(
                animation: Listenable.merge([_controllerX, _controllerY]),
                child: const FlutterLogo(size: _logoSize),
                builder: (context, child) => Positioned(
                  left: _controllerX.value - _logoSize / 2,
                  top: _controllerY.value - _logoSize / 2,
                  child: child!,
                ),
              ),
              // 弹簧控制器面板
              SpringControllerPanel(
                mass: _mass,
                stiffness: _stiffness,
                damping: _damping,
                onChange: _updateSpringProps,
              ),
            ],
          ),
        ),
      ),
    );
  }
}