Flutter Tutorial - Detect App Background & App Closed - Widgets Binding

with widgets binding you can detect if your app moves to the background or if it is opening up again in the foreground and this means also if the app was closed we can detect it and then we can execute some functionality before the app was closed if you are new here subscribe to my channel and make sure to watch this video till the end let's get started with this simple app where we have here this text field and if we close our app then we want to preserve this text and want to save it in the local storage therefore we make use of widgets binding and here we put an observer to our state and with this observer we can then detect if our apps move to the background to the foreground or if our app was closed secondly you also need to initialize this widget's binding which you do in your init state method and therefore we add here this observer and lastly you also need to implement the dispose method and the inside you put then this remove observer inside now that we have set up this widgets binding observer we also can make use of it and therefore we integrate here a new method did change app lifecycle state and inside of it we can basically detect if our app was post which means if our app was moved to the background and therefore i simply start here within this is background boolean field and basically we check here right now for the state paused however we also have here some other life cycle states also and the red ones here at the bottom are basically if the app is closed or if it is moving to the background and the resume state is every time called if the app moves from the background to the foreground however this resume state is never cold if you open your app for the first time so if you want to check if your app was open for the first time then you need to do your logic inside of the init state method let's quickly go over all of these red states the first state is the inactive state and the inactive state happens if your app is not focused anymore and this can also happen if the system opens a dialog and then this dialogue has a focus and our app doesn't have the focus after this support state is called and this means that our app moved already to the background and is not visible anymore to the user and the last state is a detached state and this is basically called if your app is closed so if you close for example your app programmatically or if you call navigator.pop then we are going inside of the detached state so let's go back to our example so every time if the app is paused or moves to the background then we want to do something however before this we want to check if our app is inactive or if it is detached and then we want to return it because we don't want to care about these cases and this is because if our app closes then it goes here through these three states inactive paused and detached and it will then call this message two to three times depending on if you close your app or if you move it to the background and we only want to execute here our is background code once and therefore we simply don't care about the other states and now let's add the functionality for our background so i simply check here if we are moving to the background and if this is the case then we want to preserve the text of our text field and therefore i have here this text editing controller which basically has the text of this text field and therefore we make use here of shared preferences to save our text and i will link in the description another video about how share preference work and how you can basically preserve your state so all in all we basically save here our text if we now move to the background and then the text will be saved automatically and what you also can do here inside of this background is to basically stop a service or something which you like to stop and then later you can implement also the else case and here you can basically start again the service when our app moves again to the foreground so if we go again to the foreground then you can execute here your code and now we can try our example out so basically if i close our app then it will be saved to the local storage however if i now restart the app then you see the text was not put again inside and therefore we also need to load our text and like i told you before the resume state is never called if you start your app for the first time so we cannot put the loading of our text inside of this method instead we need to go to our init state method and this method is executed if our app starts and here i basically can then load the text and i put it again to our text editing controller which displays then the text in our text field and now if we close our app then this code is called and we save our text and after this we can start our app again and then the text is loaded again and put inside of our text field within the init state method hello everyone thank you so much for watching this video please make sure to give it a thumbs up and subscribe to my channel here to get the latest news about flutter and see you soon bye

Channel: HeyFlutter․com

Views: 46,981

Keywords: flutter app closed, flutter app background, flutter, flutter tutorial, flutter life cycle, flutter lifecycle, life cycle of app, android life cycle, ios life cycle, flutter on pause, flutter on resume, flutter app lifecycle, flutter background, flutter tutorial for beginners, flutter for beginners, flutter background service, flutter execute background, flutter background fetch

Id: JyapvlrmM24

Length: 5min 24sec (324 seconds)

Published: Fri Jan 29 2021