按下按钮时如何通过动画进行文本转换？

如何解决按下按钮时如何通过动画进行文本转换？

当前，当 opacity = 0 & 按钮被按下时， opacity 变为 1。但我希望该按钮还具有在不透明度为 1 时将不透明度变为 0 并返回到 1 的功能。

这怎么可能？谢谢

我认为它与补间有关吗？例如。当按下按钮时，引用的不透明度变为零，然后变回 1（持续时间为一秒）。 但我不知道怎么写。

下面附上此操作中涉及的主要代码块：

  double opacity1 = 0.0;


String quoteCat1 = List1[Random().nextInt(List1.length)];

  void generateConvoTopic1() {
    setState(() {
      quoteCat1 = List1[Random().nextInt(List1.length)];
    });
  }

 @override
  Widget build(BuildContext context) {
   
    return Scaffold(

...

body: ...
              
                AnimatedOpacity(
                    opacity: opacity1,duration: Duration(seconds: 1),child:Text(quoteCat1),]),...
ElevatedButton(
...
onpressed: () {
                      generatequoteCat1();
                      opacity1 = 1.0;
                      opacity2 = 0.0;
                      opacity3 = 0.0;
                    },),...

解决方法

如果您只想在两个值之间切换，您可以使用布尔值并让您的按钮切换其值。在 toggleOpacity 函数中也是一个示例，说明如何像@Aayush 所说的那样使用 Future.delayed 对函数进行动画处理。

现在如果你想要更复杂的动画，或者无限的动画，你应该使用animationController来完全控制它

参见示例：

class Demo extends StatefulWidget {
  Demo({Key key,this.title}) : super(key: key);

  final String title;

  @override
  _DemoState createState() => _DemoState();
}

class _DemoState extends State<Demo> {
  bool visible = true;
  var animateBack=false;

  void toggleOpacity() {
    setState(() {
      visible = !visible;
    });
if(animateBack)    
Future.delayed(Duration(seconds: 1)).then((value) {
     setState(() {
       visible = !visible;

     });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: AnimatedOpacity(
          opacity: visible ? 1 : 0,duration: Duration(seconds: 1),child: Text(
            'Now you see me',),floatingActionButton: FloatingActionButton(
        onPressed: toggleOpacity,child: Icon(visible?Icons.wb_sunny:Icons.wb_sunny_outlined),// This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}