How to Update Widgets On Resume In Flutter?
Earlier We have been through Flutter Life Cycle. It has multiple states in which users can perform operations as per the end-user requirement. Sometimes it may happen that the user wants to update Update Widgets On Resume. So in this article, we will learn about How to Update Widgets On Resume In Flutter?
How to Update Widgets On Resume In Flutter?
Users can listen to the lifecycle event using the below code snippet.
import 'package:flutter/material.dart'; import 'package:flutter/foundation.dart'; class LifecycleEventHandler extends WidgetsBindingObserver { final AsyncCallback resumeCallBack; final AsyncCallback suspendingCallBack; LifecycleEventHandler({ this.resumeCallBack, this.suspendingCallBack, }); @override Future<void> didChangeAppLifecycleState(AppLifecycleState state) async { switch (state) { case AppLifecycleState.resumed: if (resumeCallBack != null) { await resumeCallBack(); } break; case AppLifecycleState.inactive: case AppLifecycleState.paused: case AppLifecycleState.detached:
User can also give a try to code snippet as below:
import 'package:flutter/services.dart'; SystemChannels.lifecycle.setMessageHandler((msg){ debugPrint('SystemChannels> $msg'); if(msg==AppLifecycleState.resumed.toString())setState((){}); });
A simple way to do this is by using the below code snippet.
First import package like below:
import 'package:flutter/services.dart';
handleAppLifecycleState() { AppLifecycleState _lastLifecyleState; SystemChannels.lifecycle.setMessageHandler((msg) { print('SystemChannels> $msg'); switch (msg) { case "AppLifecycleState.paused": _lastLifecyleState = AppLifecycleState.paused; break; case "AppLifecycleState.inactive": _lastLifecyleState = AppLifecycleState.inactive; break; case "AppLifecycleState.resumed": _lastLifecyleState = AppLifecycleState.resumed; break; case "AppLifecycleState.suspending": _lastLifecyleState = AppLifecycleState.suspending; break; default: } }); }
OR User can also try the below way.
class AppLifecycleReactor extends StatefulWidget { const AppLifecycleReactor({ Key key }) : super(key: key); @override _AppLifecycleReactorState createState() => _AppLifecycleReactorState(); } class _AppLifecycleReactorState extends State<AppLifecycleReactor> with WidgetsBindingObserver { @override void initState() { super.initState(); WidgetsBinding.instance.addObserver(this); } @override void dispose() { WidgetsBinding.instance.removeObserver(this); super.dispose(); } AppLifecycleState _notification; @override void didChangeAppLifecycleState(AppLifecycleState state) { setState(() { _notification = state; }); } @override Widget build(BuildContext context) { return Text('Last notification: $_notification'); } }
There are three methods for LifeCycle Solution.
- WidgetsBindingObserver
- SystemChannels.lifecycle
- Flutter-android-lifecycle-plugin
Now we will understand the main difference between WidgetsBindingObserver and SystemChannels.lifecycle is that WidgetsBindingObserver has more capable If you have a bunch of widgets that need to listen to LifeCycle. SystemChannels is a more low layer and used by WidgetsBindingObserver.
After several testing, If you use SystemChannels after runApp, and home widget mixin with WidgetsBindingObserver, the home widget would be failed, because SystemChannels.lifecycle.setMessageHandler override the home’s method.
So If you want to use a global, Single method, go for SystemChannels.lifecycle, others for WidgetsBindingObserver.
Users can perform the desire operations using the help of the below code snippet.
import 'package:flutter/material.dart'; abstract class LifecycleWatcherState<T extends StatefulWidget> extends State<T> with WidgetsBindingObserver { @override Widget build(BuildContext context) { return null; } @override void initState() { super.initState(); WidgetsBinding.instance.addObserver(this); } @override void dispose() { WidgetsBinding.instance.removeObserver(this); super.dispose(); } @override void didChangeAppLifecycleState(AppLifecycleState state) { switch (state) { case AppLifecycleState.resumed: onResumed(); break; case AppLifecycleState.inactive: onPaused(); break; case AppLifecycleState.paused: onInactive(); break; case AppLifecycleState.detached: onDetached(); break; } } void onResumed(); void onPaused(); void onInactive(); void onDetached(); }
Conclusion:
In this article, We have been through How to Update Widgets On Resume In Flutter?
Drop us your valuable feedback to serve you better.
Thanks for Reading !!! Keep Fluttering !!!
Flutter Agency is our portal Platform dedicated to Flutter Technology and Flutter Developers. The portal is full of cool resources from Flutter like Flutter Widget Guide, Flutter Projects, Code libs and etc.
Subhajit Kar
What i realize using WidgetsBindingObserver is that the onResume, onPause behaviour is working here globally for the entire app in flutter, and not pagewise like we see in Android. Can i get native android like behaviour, that is pagewise onResume event listening? Please help me, i need to know it as soon as possible as i am working in an important project right now.