例如,我有一个widget,它在用户滑动时使用可变的 dragoffset += details.offset.dx
;
当滑动结束时,如何给旋转添加惯性?例如,当你松开手指时,对象继续以下降的速度旋转--就像ListView通常的行为一样。
这里有一些模板代码作为例子。
Widget rotatedWidget() {
double fingerOffset = 0.0;
return GestureDetector(
onHorizontalDragUpdate: (details) {
setState((){
fingerOffset += details.delta.dx;
});
},
onHorizontalDragEnd: (details) {
/// some code to add inertia
},
child: Transform.rotate(
angle: offset,
child: Container(width: 100, height: 100, color: Colors.blue),
));
}
谢谢 @pskink 对于这个解决方案。
AnimationController ctrl;
@override
void initState() {
super.initState();
ctrl = AnimationController.unbounded(vsync: this);
}
@override
Widget build(BuildContext context) {
return GestureDetector(
onPanUpdate: (d) => ctrl.value += d.delta.dx / 100,
onPanEnd: (d) {
ctrl.animateWith(
FrictionSimulation(
0.05, // <- the bigger this value, the less friction is applied
ctrl.value,
d.velocity.pixelsPerSecond.dx / 100 // <- Velocity of inertia
));
},
child: Scaffold(
appBar: AppBar(
title: Text('RotatedBox'),
),
body: AnimatedBuilder(
animation: ctrl,
builder: (ctx, w) {
return Center(
child: Transform.rotate(
angle: ctrl.value,
child: Container(width: 100, height: 100, color: Colors.blue),
),
);
},
),
),
);
}