手机直播源码,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 中的弹簧按钮效果,更多内容欢迎关注之后的文章