inline_dialogs

A lightweight Flutter package to implement inline dialogs which can be managed from the main context. The dialog can be closed from the same code from which it was invoked. It also gives back return values on closure helping the developer catch user action on the dialog.

Getting Started

Add below builder code in MaterialApp() in main.dart page sample


 builder: (context, widget) => Navigator(
        onGenerateRoute: (settings) => MaterialPageRoute(
            builder: (context) => DialogManager(
                  child: widget,
                )),
      ),

Add dialogSetupLocator in main() in main.dart page sample


 void main() {
  dialogSetupLocator();
  runApp(MyApp());
}

That's it! You are good to go.

Demo

Inline dialog demo

Implementation

Implement option dialog dialogType: DialogType.option


 var _dialogResponse = await _dialogService.showDialog(
                      title: Icon(
                        Icons.code,
                        size: 50,
                        color: Colors.orange,
                      ),
                      content: Padding(
                        padding: const EdgeInsets.all(12.0),
                        child: Text(
                          'Sample option dialog',
                          style: Theme.of(context).textTheme.headline6,
                        ),
                      ),
                      dialogType: DialogType.option,
                      optionRight: 'Right',
                      optionLeft: 'Left');
                 
                    
print(_dialogResponse.optionRight);
print(_dialogResponse.optionLeft);

Implement confirm dialog dialogType: DialogType.confirm


 var _dialogResponse = await _dialogService.showDialog(
                      title: Icon(
                        Icons.done_outline,
                        size: 50,
                        color: Colors.green,
                      ),
                      content: Padding(
                        padding: const EdgeInsets.all(12.0),
                        child: Text(
                          'Sample confirm dialog',
                          style: Theme.of(context).textTheme.headline6,
                        ),
                      ),
                      dialogType: DialogType.confirm,
                      buttonText: 'Done');
                 
                    setState(() {
                      _confirmBtn =  _dialogResponse.confirmed;
                  });
                                  
print('${_dialogResponse.confirmed}');

Implement waiter dialog dialogType: DialogType.waiter


 _dialogService.showDialog(
                      title: Text(
                        'Sample waiter dialog',
                        style: Theme.of(context).textTheme.headline6,
                      ),
                      content: Padding(
                        padding: const EdgeInsets.all(12.0),
                        child: CupertinoActivityIndicator(
                          radius: 20,
                        ),
                      ),
                      dialogType: DialogType.waiter);
                  await Future.delayed(Duration(seconds: 5));
                  _dialogService.dismissDialog();

You can close all of the above dialogs by using _dialogService.dismissDialog(); from the same context where the dialog was invoked.

Credit

A special shout out to FilledStacks YouTube channel. Please show some love and subscribe to this channel. YouTube Link

**The code has been modified heavily for ease of modular implementation and more features have been added.

Documentation

For help getting started with Flutter, view our github repo, which offers tutorials, samples, guidance on mobile development, and a full API reference.

inline_dialogs package