手势结束后将小部件动画回原始位置

以下是一个示例代码，展示了如何在手势结束后将小部件动画回原始位置。

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Gesture Animation',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: GestureAnimation(),
    );
  }
}

class GestureAnimation extends StatefulWidget {
  @override
  _GestureAnimationState createState() => _GestureAnimationState();
}

class _GestureAnimationState extends State<GestureAnimation>
    with SingleTickerProviderStateMixin {
  AnimationController _controller;
  Animation<Offset> _animation;
  Offset _startOffset;
  Offset _endOffset;

  @override
  void initState() {
    super.initState();
    _controller = AnimationController(
      vsync: this,
      duration: Duration(milliseconds: 500),
    );
    _animation = Tween<Offset>(
      begin: Offset.zero,
      end: Offset(0.0, 1.0),
    ).animate(CurvedAnimation(
      parent: _controller,
      curve: Curves.easeInOut,
    ));
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  void _onPanStart(DragStartDetails details) {
    _startOffset = details.globalPosition;
  }

  void _onPanUpdate(DragUpdateDetails details) {
    setState(() {
      _endOffset = details.globalPosition - _startOffset;
    });
  }

  void _onPanEnd(DragEndDetails details) {
    if (_endOffset.dy > 50) {
      _controller.forward();
    } else {
      _controller.reverse();
    }
    _endOffset = null;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Gesture Animation'),
      ),
      body: GestureDetector(
        onPanStart: _onPanStart,
        onPanUpdate: _onPanUpdate,
        onPanEnd: _onPanEnd,
        child: SlideTransition(
          position: _animation,
          child: Center(
            child: Container(
              width: 200,
              height: 200,
              color: Colors.blue,
              child: Center(
                child: Text(
                  'Drag me',
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 20,
                  ),
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

在上面的代码中，我们创建了一个GestureAnimation小部件，它包裹了一个可以拖动的小部件。当手势开始时，我们记录下起始位置，当手势更新时，我们根据位置的变化来更新小部件的位置。当手势结束时，我们根据结束时的位置来决定是否要播放动画。如果结束位置的垂直方向上的偏移大于50，我们调用_controller.forward()来播放动画，否则调用_controller.reverse()来反向播放动画。动画会将小部件从当前位置移动到原始位置，即起始位置为(0,0)的位置。