Flutter:如何重现这个对手指移动做出反应的底部容器

import 'package:flutter/material.dart';

class ReponsiveBottomContainer extends StatefulWidget {
  @override
  _ReponsiveBottomContainerState createState() =>
      _ReponsiveBottomContainerState();
}

class _ReponsiveBottomContainerState extends State<ReponsiveBottomContainer> {
  double _containerHeight = 100; // 容器初始高度
  double _maxContainerHeight = 300; // 容器最大高度

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Reponsive Bottom Container'),
      ),
      body: Stack(
        children: [
          Positioned(
            bottom: 0,
            left: 0,
            right: 0,
            child: GestureDetector(
              onVerticalDragUpdate: (details) {
                setState(() {
                  // 根据手指在垂直方向上的拖动距离更新容器高度
                  _containerHeight = _containerHeight - details.delta.dy;
                  if (_containerHeight < 0) {
                    _containerHeight = 0;
                  } else if (_containerHeight > _maxContainerHeight) {
                    _containerHeight = _maxContainerHeight;
                  }
                });
              },
              child: AnimatedContainer(
                duration: Duration(milliseconds: 200),
                height: _containerHeight,
                color: Colors.blue,
                child: Center(
                  child: Text(
                    'Drag me',
                    style: TextStyle(color: Colors.white, fontSize: 18),
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

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