在向有状态小部件中的颤动文本添加翻译时停止无限循环,可以通过以下步骤实现:
isTranslating
,初始值设为false
。AnimatedBuilder
包裹需要颤动的文本部分,并将isTranslating
作为依赖项传递给AnimatedBuilder
。AnimatedBuilder
的builder
回调函数中,根据isTranslating
的值来决定是否执行颤动动画。如果isTranslating
为true
,则执行颤动动画;如果为false
,则停止动画。isTranslating
设置为true
,表示开始执行颤动动画。isTranslating
设置为false
,表示停止颤动动画。以下是一个示例代码:
import 'package:flutter/material.dart';
class ShakingTextWidget extends StatefulWidget {
@override
_ShakingTextWidgetState createState() => _ShakingTextWidgetState();
}
class _ShakingTextWidgetState extends State<ShakingTextWidget>
with SingleTickerProviderStateMixin {
AnimationController _animationController;
Animation<double> _animation;
bool isTranslating = false;
@override
void initState() {
super.initState();
_animationController = AnimationController(
vsync: this,
duration: Duration(milliseconds: 500),
);
_animation = Tween(begin: 0.0, end: 10.0).animate(
CurvedAnimation(
parent: _animationController,
curve: Curves.linear,
),
);
}
@override
void dispose() {
_animationController.dispose();
super.dispose();
}
void startTranslation() {
setState(() {
isTranslating = true;
});
_animationController.repeat(reverse: true);
// 执行翻译操作
// ...
// 翻译完成后调用stopTranslation方法
}
void stopTranslation() {
setState(() {
isTranslating = false;
});
_animationController.stop();
}
@override
Widget build(BuildContext context) {
return AnimatedBuilder(
animation: _animationController,
builder: (BuildContext context, Widget child) {
return Transform.translate(
offset: Offset(_animation.value, 0.0),
child: Text(
'Shaking Text',
style: TextStyle(fontSize: 16.0),
),
);
},
);
}
}
在上述示例代码中,ShakingTextWidget
是一个有状态的小部件,通过控制isTranslating
变量的值来启动和停止颤动动画。在startTranslation
方法中,将isTranslating
设置为true
,并调用_animationController.repeat(reverse: true)
来启动动画循环。在翻译完成后,调用stopTranslation
方法将isTranslating
设置为false
,并调用_animationController.stop()
停止动画循环。
这样,当执行翻译操作时,文本将开始颤动;翻译完成后,文本将停止颤动。
领取专属 10元无门槛券
手把手带您无忧上云