提问者:小点点

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


目前,当不透明度=0时

这怎么可能?谢谢

我想这与吐温有关?例如。当按下按钮时,引用的不透明度变为零并返回到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;
                    },),

      
...

共1个答案

匿名用户

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

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

参见示例:

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.
    );
  }
}