手機直播原始碼，Flutter 中的彈簧按鈕效果

手機直播原始碼，Flutter 中的彈簧按鈕效果

import 'package:flutter/material.dart';
 
class ScaleAnimation extends StatefulWidget     {
 
  final Widget child;
 
  final Function()? onTap;
 
  ScaleAnimation({required this.child,required this.onTap,Key? key}):super(key: key);
 
 
 
 
  @override
  State<ScaleAnimation> createState() => _ScaleAnimationState();
 
}
 
 
class _ScaleAnimationState extends State<ScaleAnimation> with SingleTickerProviderStateMixin {
 
  late AnimationController _animationController;
 
  late Animation<double> _scaleAnimation;
 
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
 
    _animationController = AnimationController(
      vsync: this,
      duration: Duration(milliseconds: 200),
    );
 
    _scaleAnimation = Tween<double>(
      begin: 1.0,
      end: 0.8,
    ).animate(_animationController);
 
  }
 
 
  void _playAnimation() {
    _animationController.forward();
    Future.delayed(Duration(milliseconds: 200), () {
      _animationController.reverse();
    });
  }
 
  @override
  Widget build(BuildContext context) {
      return   GestureDetector(
 
        onTap: (){
          _playAnimation();
          widget.onTap?.call();
        },
        child: AnimatedBuilder (
          animation: _scaleAnimation,
          builder:(BuildContext context, Widget? child){
            return Transform.scale(
              scale: _scaleAnimation.value,
              child: child,
 
            );
          },
          child: widget.child,
 
        ),
      );
  }
 
}

以上就是 手機直播原始碼，Flutter 中的彈簧按鈕效果，更多內容歡迎關注之後的文章