Skip to content

Instantly share code, notes, and snippets.

@felangel
Last active May 11, 2021 13:36
  • Star 6 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save felangel/75f1ca6fc954f3672daf7962577d56f5 to your computer and use it in GitHub Desktop.
showDialog sample
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:bloc/bloc.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: HomePage(),
);
}
}
class HomePage extends StatefulWidget {
State<HomePage> createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
final _dialogBloc = DialogBloc();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Flutter Demo'),
),
body: BlocBuilder(
bloc: _dialogBloc,
builder: (BuildContext context, DialogState state) {
if (state is DialogVisible) {
SchedulerBinding.instance.addPostFrameCallback((_) {
showDialog(
context: context,
barrierDismissible: false,
builder: (_) {
return Scaffold(
body: Center(
child: RaisedButton(
child: Text('dismiss'),
onPressed: () {
_dialogBloc.dispatch(HideDialog());
},
),
),
);
},
);
});
}
if (state is DialogHidden) {
SchedulerBinding.instance.addPostFrameCallback((_) {
Navigator.pop(context);
});
}
return Container(
child: Center(
child: Text('Dialog Sample'),
),
);
},
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.notifications),
onPressed: () {
_dialogBloc.dispatch(ShowDialog());
},
),
);
}
@override
void dispose() {
_dialogBloc.dispose();
super.dispose();
}
}
abstract class DialogEvent {}
class ShowDialog extends DialogEvent {}
class HideDialog extends DialogEvent {}
abstract class DialogState {}
class InitialDialogState extends DialogState {}
class DialogHidden extends DialogState {}
class DialogVisible extends DialogState {}
class DialogBloc extends Bloc<DialogEvent, DialogState> {
@override
DialogState get initialState => InitialDialogState();
@override
Stream<DialogState> mapEventToState(
DialogState currentState,
DialogEvent event,
) async* {
if (event is ShowDialog) {
yield DialogVisible();
} else {
yield DialogHidden();
}
}
}
@nicodoss
Copy link

For the case that we use equatable, is that change the behavior of the blocbuilder??

@nicodoss
Copy link

nicodoss commented Aug 10, 2020

I have some issues with how to properly show dialog with flutter_bloc;
check the code below and tell me where i do mistake.
//my bloc code

class LoginBloc extends Bloc<LoginEvent, LoginState> {
    LoginBloc();
  @override
  LoginState get initialState => LoginStateinitial();
  @override
  void onTransition(Transition<LoginEvent, LoginState> transition) {
    super.onTransition(transition);
  }
 @override
  Stream<LoginState> mapEventToState(
    LoginEvent event,
  ) async* {
    if (event is Dialogshow) {
      yield DialogshowState();
    } else if (event is DialogClose) {
      yield DialogCloseState();
    }
  }
// my events  code

part of 'login_bloc.dart';
abstract class LoginEvent extends Equatable {
  @override
  List<Object> get props => [];
  @override
  bool get stringify => true;
}
class DialogClose extends LoginEvent{
  @override
  List<Object> get props => [];
}
class Dialogshow extends LoginEvent{
  @override
  List<Object> get props => [];
}
//mystate 
 abstract class LoginState extends Equatable {}

class LoginStateinitial extends LoginState {
  @override
  List<Object> get props => [];
}

class LoginStateLoading extends LoginState {
  @override
  List<Object> get props => [];
}
//dialogstate
class DialogCloseState extends LoginState{
  @override
  List<Object> get props => [];
}class DialogshowState extends LoginState{
  @override
  List<Object> get props => [];
}

//My LoginPage when i call the dialog


class LoginScreen extends StatefulWidget {
  @override
  _LoginScreenState createState() => _LoginScreenState();
}

class _LoginScreenState extends State<LoginScreen> {
  final loginBloc = LoginBloc();
  final formkey = GlobalKey<FormState>();
  Country US = Country(
    asset: "assets/flags/us_flag.png",
    dialingCode: "1",
    isoCode: "US",
    name: "United States",
    currency: "United States dollar",
    currencyISO: "USD",
  );
  String phonenumber;
  String indicatif;

  @override
  void initState() {
    super.initState();
    indicatif = "+${US.dialingCode}";
  }

  @override
  void dispose() {
    loginBloc.close();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    final _width = MediaQuery.of(context).size.width;
    final _height = MediaQuery.of(context).size.height;
    final bottoms = MediaQuery.of(context).viewInsets.bottom;
    final loginbloc = LoginBloc();
    //String message;
    return BlocBuilder<LoginBloc, LoginState>(builder: (context, state) {
          if (state is DialogshowState) {
            WidgetsBinding.instance.addPostFrameCallback((_) {
              showDialog(
                context: context,
                builder: (_) => Scaffold(
                  body: Center(
                    child: Column(
                      mainAxisSize: MainAxisSize.min,
                      children: <Widget>[
                        Text("Enter your code"),
                        TextFormField(
                          decoration: InputDecoration(labelText: "Code WURA"),
                        ),
                        SizedBox(
                          height: 10,
                        ),
                        Align(
                            alignment: Alignment.bottomLeft,
                            child: Row(
                              children: <Widget>[
                                FlatButton(
                                    child: Text('Dismiss'),
                                    onPressed: () {
                                      //Navigator.of(context).pop();
                                      loginbloc.add(DialogClose());
                                    }),
                                Spacer(),
                                FlatButton(
                                  child: Text('Send'),
                                  onPressed: () {},
                                ),
                              ],
                            ))
                      ],
                    ),
                  ),
                ),
              );
            });
            print("otpstate");
          } else if (state is DialogCloseState) {
                WidgetsBinding.instance.addPostFrameCallback((_) {
              Navigator.pop(context);
            });
          }
          return Scaffold(
            resizeToAvoidBottomInset: false,
            resizeToAvoidBottomPadding: false,
            appBar: new AppBar(
              title: Text("Connection"),
              centerTitle: true,
            ),
            body: SingleChildScrollView(
              child: Padding(
                padding: EdgeInsets.only(bottom: bottoms),
                child: Container(
                  decoration: new BoxDecoration(
                      image: new DecorationImage(
                    image: AssetImage(
                      "assets/images/connection1.jpg",
                    ),
                    fit: BoxFit.cover,
                  )),
                  height: _height,
                  child: Form(
                    key: formkey,
                    child: Column(
                      mainAxisSize: MainAxisSize.min,
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: <Widget>[
                        Padding(
                          padding: const EdgeInsets.all(10.0),

                          child: pays(),
                        ),
                        Padding(
                          padding: const EdgeInsets.symmetric(horizontal: 12.0),
                          child: telephone(),
                        ),
                        SizedBox(height: 15.0),
                        Padding(
                            padding: const EdgeInsets.symmetric(vertical: 8.0),
                            child: GestureDetector(
                              onTap: () {
                                if (formkey.currentState.validate()) {
                                  formkey.currentState.save();
                                  FocusScope.of(context).unfocus();
                                  BlocProvider.of<LoginBloc>(context)
                                      .add(Dialogshow());
                                }
                              },
                              child: Container(
                                height: 90,
                                width: 90,
                                child: Stack(
                                  children: <Widget>[
                                    Shimmer.fromColors(
                                        baseColor:
                                            Theme.of(context).primaryColor,
                                        highlightColor: Colors.amber.shade300,
                                        child: RaisedButton(
                                            color:
                                                Theme.of(context).primaryColor,
                                            onPressed: () {
                                              //somecode
                                            })),
                                    Padding(
                                      padding: const EdgeInsets.all(10.0),
                                      child: Row(
                                        children: <Widget>[
                                          Text("Login",
                                              style: TextStyle(
                                                fontSize: 18.0,
                                                color: Colors.white,
                                              )),
                                          Icon(
                                            Icons.lock,
                                            color: Colors.white,
                                          )
                                        ],
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            )),
                      ],
                    ),
                  ),
                ),
              ),
            ),
          );
        });
  }

@nicodoss
Copy link

nicodoss commented Aug 10, 2020

Login dart - studentworld - Visual Studio Code
i notice that the bloc show the dialog but when i inject the dialogclose event this don't dismiss the dialog.
Another think that i notice is when i use bloclistener the dialog just show once.
See bloc delegate transition

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment