flutter弹窗如何实现？

Question

当我进入这个页面时就弹出这个弹窗，可以选择下次不再提示

Answer 1

进入弹窗

initState()中showDialog()

选择下次不再提示

使用SharedPreferences插件本地化储存状态

Answer 2

方法 甲

其中SharedPreferences 用于保存状态

@override
  void initState() {
    super.initState();
    () async {
      final prefs = await SharedPreferences.getInstance();
      // prefs.setBool(myKey, false); 用于测试
      bool hide = prefs.getBool(myKey) ?? false;
      Future.delayed(const Duration(milliseconds: 100), () {
        if (!hide) {
          showDialog(
              barrierDismissible: false,
              context: context,
              builder: (context) {
                return AlertDialog(
                  title: const Text('优惠提示'),
                  content: const Text('优惠内容...'),
                  actions: [
                    TextButton(
                        onPressed: () {
                          prefs.setBool(myKey, true);
                          Navigator.of(context).pop();
                        },
                        child: const Text('不再提示'))
                  ],
                );
              });
        }
      });
    }();
  }

方法 乙

class MyTestPage extends StatefulWidget {
  const MyTestPage({super.key});

  @override
  State<MyTestPage> createState() => _MyTestPageState();
}

class _MyTestPageState extends State<MyTestPage> {

  static const String myKey = 'Stephanie';

  bool hide = true;

  @override
  void initState() {
    super.initState();
    SharedPreferences.getInstance().then((pres) {
      setState(() {
        hide = pres.getBool(myKey) ?? false;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: const Text('Show'),
        ),
        body: Stack(children: [
          Container(
            color: Colors.yellow,
          ),
          if (!hide)
            MyTestPagePopAlert(finished: () {
              SharedPreferences.getInstance().then((pres) {
                pres.setBool(myKey, true);
                setState(() {
                  hide = true;
                });
              });
            }),
        ]));
  }
}

class MyTestPagePopAlert extends StatefulWidget {
  MyTestPagePopAlert({super.key, required this.finished});
  Function finished;
  @override
  State<MyTestPagePopAlert> createState() => _MyTestPagePopAlertState();
}

class _MyTestPagePopAlertState extends State<MyTestPagePopAlert> with SingleTickerProviderStateMixin {
  late AnimationController _controller;

  @override
  void initState() {
    super.initState();
    _controller = AnimationController(
        vsync: this, duration: const Duration(milliseconds: 366))
      ..forward();
  }

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        ModalBarrier(
          color: Colors.grey.withOpacity(0.5),
          onDismiss: () {
            if (kDebugMode) print('touch barrier');
          },
        ),
        ScaleTransition(
            scale: _controller,
            child: FadeTransition(
                opacity: _controller,
                child: AlertDialog(
                  title: const Text('优惠啦'),
                  content: const Text('优惠内容哦'),
                  actions: [
                    TextButton(
                        onPressed: () {
                          _controller.reverse().then((value) {
                            widget.finished();
                          });
                        },
                        child: const Text('不再提示'))
                  ],
                )))
      ],
    );
  }
}