Flutter项目如何在页面绘制完成后自动弹出弹框

Flutter项目如何在页面绘制完成后自动弹出弹框

代码片段

class _PageState extends State<Page> {

  @override void initState(){

    super.initState();

    Future.delayed(const Duration(seconds: 1), _modal);

}

Widget _modal(BuildContext context) {

  return showDialog(

    context: context,

    barrierColor: Colors.white.withAlpha(0),

    builder: (_) => const Dialog(

      backgroundColor: Colors.transparent,

      shadowColor: Colors.transparent,

    ),

   );

  }

}

这样写的话还是会有问题，因为我们只是延迟了执行，并不是页面真正渲染完成执行的，下面我们看看另一种方法

代码片段

class _PageState extends State<Page> {

  @override void initState(){

    super.initState();

    WidgetsBinding.instance.addPostFrameCallback((timeStamp) {

      showDialog(

        context: context,

        barrierColor: Colors.white.withAlpha(100),

        builder: _modal,

      );

    }

  );

}

Widget _modal(BuildContext context) {

  return const Dialog(

    backgroundColor: Colors.transparent,

    shadowColor: Colors.transparent,

   );

  }

}

通过addPostFrameCallback，做一下安全操作，会在当前绘制完成之后回调。