What can I do to exit the current operation and confirm it twice?

Preface

stay  flutter_bloc Provides a status monitoring component  

BlocListener

, When the state changes, it will call

listener

Callback function given by parameter , This method does not return a value , It can be used for us to deal with some reminders , For example, display pop-up reminder or confirmation , Display status information, etc . With  

BlocListener

, It is equivalent to providing us with an additional entry to deal with object changes . Next we pass

BlocListener

Implement some  App Second confirmation before logging out .

The login status

To simplify logic , Our login data has only one enumeration  

LoginStatus

, There are three states ：

• logon： Logged in

• logout： Logged out

• logoutConfirm： Exit login confirmation


enum LoginStatus { logon, logout, logoutConfirm }

class LoginCubit extends Cubit<LoginStatus> {
 LoginCubit({initial = LoginStatus.logout}) : super(initial);

 void login() => emit(LoginStatus.logon);
 void logout() => emit(LoginStatus.logout);
 void logoutConfirm() => emit(LoginStatus.logoutConfirm);
}


Business logic

We put a button in the middle of the screen , Switch button text according to login status ：

• Logged in ： Displayed as logout ;

• Logged out ： Displayed as login .

When you click the exit login button , The second confirmation dialog box pops up , After confirmation, change the status to logged out , Otherwise, keep the login status unchanged , The dialog box is shown below .

Code implementation

Because of our buttons and  

BlocListener

  All need to use status data , Therefore use  

BlocProvider

  Placed on the upper layer is  

BlocListener

  and  

BlocBuilder

  Provide status data at the same time .

class BlocListenerWrapper extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
 return BlocProvider(
 create: (_) => LoginCubit(),
 child: BlocListenerDemo(),
 );
 }
}


BlocListener  Part of the code is as follows ：

class BlocListenerDemo extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
 return Scaffold(
 appBar: AppBar(
 title: Text('BlocListener  Example '),
 ),
 body: Center(
 child: BlocListener<LoginCubit, LoginStatus>(
 listener: (context, loginSatus) async {
 if (loginSatus == LoginStatus.logout ||
 loginSatus == LoginStatus.logon) {
 ScaffoldMessenger.of(context)
 ..hideCurrentSnackBar()
 ..showSnackBar(SnackBar(
 content:
 Text(loginSatus == LoginStatus.logout ? ' Logged out ' : ' Login successful '),
 duration: Duration(seconds: 1),
 ));
 } else {
 var confirmed = await _confirmLogout(context);
 if (confirmed == true) {
 context.read<LoginCubit>().logout();
 }
 }
 },
 child: BlocBuilder<LoginCubit, LoginStatus>(
 builder: (context, loginSatus) => TextButton(
 child: Text(
 loginSatus == LoginStatus.logon ? ' Log out ' : ' Sign in ',
 style: TextStyle(
 fontSize: 24.0,
 ),
 ),
 onPressed: () {
 if (loginSatus == LoginStatus.logon) {
 context.read<LoginCubit>().logoutConfirm();
 } else {
 context.read<LoginCubit>().login();
 }
 },
 ),
 ),
 ),
 ),
 );
 }


When the status is logged in and logged out, a  

SnackBar

  Prompt results , And if it's confirm login , A dialog box pops up . The dialog box will return  

true

  or  

false

, If it is  

true

  It means confirm to exit , Call again at this point  

LoginCubit

  Of  

logout

  Log out . The source code has been submitted to ：

BLoC State management source code

, The operation effect is as follows ：

summary

You can see , With

BlocListener

, We can achieve the effect similar to the post interceptor , Do some extra processing after the state changes , For example, tips , Or upload data 、 Offline storage, etc . Deal with... In this way , It can reduce the coupling of business code .