Developer
Developer

Reputation: 41

How to display pop up message in any screen in flutter?

I need to show a popup with a message on any screen. It could be tutorial / introduction screens, login or home screen. Basically the popup indicates if there is a new downloadable version of the app. Now this does not have any condition. So I should be able to show the popup message to user every time the app is launched.

The same is achieved by adding pop up message in didFinishLaunchingWithOptions in iOS. How do I do the same in flutter?

Upvotes: 0

Views: 5827

Answers (1)

Benyamin
Benyamin

Reputation: 1144

Pop up message is achieved by flutter AlertDialog widget. so if you want to alert user every time that app launches, you should show this widget in the first screen that your app is going to start with. this is an example from the documentation:

// Flutter code sample for AlertDialog
//
// This demo shows a [TextButton] which when pressed, calls [showDialog]. When called, this method
// displays a Material dialog above the current contents of the app and returns
// a [Future] that completes when the dialog is dismissed.

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

/// This is the main application widget.
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  static const String _title = 'Flutter Code Sample';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: _title,
      home: Scaffold(
        appBar: AppBar(title: const Text(_title)),
        body: const Center(
          child: MyStatelessWidget(),
        ),
      ),
    );
  }
}

/// This is the stateless widget that the main application instantiates.
class MyStatelessWidget extends StatelessWidget {
  const MyStatelessWidget({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return TextButton(
      onPressed: () => showDialog<String>(
        context: context,
        builder: (BuildContext context) => AlertDialog(
          title: const Text('AlertDialog Title'),
          content: const Text('AlertDialog description'),
          actions: <Widget>[
            TextButton(
              onPressed: () => Navigator.pop(context, 'Cancel'),
              child: const Text('Cancel'),
            ),
            TextButton(
              onPressed: () => Navigator.pop(context, 'OK'),
              child: const Text('OK'),
            ),
          ],
        ),
      ),
      child: const Text('Show Dialog'),
    );
  }
}

for more info visit here

Upvotes: 1

Related Questions