如何在按下按钮时创建动画。例如反射式应用中的弹跳动画。
到目前为止我做了什么:
AnimationController _animationController;
Animation<double> _animation;
@override
void initState() {
_animationController = AnimationController(
vsync: this,
duration: Duration(seconds: 2000),
);
_animation =
CurvedAnimation(parent: _animationController, curve: Curves.bounceInOut);
super.initState();
}
最佳答案
如果你想让它禁用动画,那么也可以使用这个小部件类,然后将它设置为 onPress null 并传递给 child 。
import 'package:flutter/material.dart';
class Bouncing extends StatefulWidget {
final Widget child;
final VoidCallback onPress;
Bouncing({@required this.child, Key key, this.onPress})
: assert(child != null),
super(key: key);
@override
_BouncingState createState() => _BouncingState();
}
class _BouncingState extends State<Bouncing>
with SingleTickerProviderStateMixin {
double _scale;
AnimationController _controller;
@override
void initState() {
super.initState();
_controller = AnimationController(
vsync: this,
duration: Duration(milliseconds: 100),
lowerBound: 0.0,
upperBound: 0.1,
);
_controller.addListener(() {
setState(() {});
});
}
@override
void dispose() {
super.dispose();
_controller.dispose();
}
@override
Widget build(BuildContext context) {
_scale = 1 - _controller.value;
return Listener(
onPointerDown: (PointerDownEvent event) {
if (widget.onPress != null) {
_controller.forward();
}
},
onPointerUp: (PointerUpEvent event) {
if (widget.onPress != null) {
_controller.reverse();
widget.onPress();
}
},
child: Transform.scale(
scale: _scale,
child: widget.child,
),
);
}
}
用法:
Bouncing(
onPress: (){},
child: Container()
);
输出:
关于android - 弹跳按钮 flutter ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54526193/