flutter - 使用 Flutter 加载屏幕时如何淡入小部件？

Question

<分区>

Answer 1

嘿你看看Animated Opacity使用这个你可以实现过渡中的淡入淡出

示例片段:

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

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  double widget1Opacity = 0.0;
  

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    Future.delayed(Duration(milliseconds: 300), () {
      widget1Opacity = 1;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: AnimatedOpacity(
            opacity: widget1Opacity,
            duration: Duration(seconds: 3),
            child: FlutterLogo(
              size: 200,
              style: FlutterLogoStyle.markOnly,
            )),
      ),
    );
  }
}