<div id="readability-page-1" class="page"><div>
 <div id="SE-60bab83c-eb73-4b23-a7c4-00932f0a24a5">
 ​개요​Flutter 에서 App Lifecycle 을 컨트롤 하는 방법에 대해 정리한다. 본인의 경우, 앱사용자가 다른 앱 (ex. 설정) 으로 이동했다가 다시 앱으로 돌아오는 시점에 특정 이벤트를 발생시키고 싶어서 해당 기능을 찾아보았다.​​​Flutter App Lifecycle​아래는 Flutter App Lifecycle 에 대해 설명하는 그림이다. <a href="https://medium.com/pharos-production/flutter-app-lifecycle-4b0ab4a4211a" target="_blank">원글</a>에서 다음과 같이 설명하고 있다.​<ul><li>inactive :<ul><li>ios 에서만 동작하는 이벤트, android 에서는 없다. </li><li>app 이 inactive 상태가 되고 사용자의 input 을 받을수 없는 상태이다.</li></ul></li><li>paused : <ul><li>app 이 user 에게 보이지 않는 상태로 user input 에 반응하지 않고 앱이 백그라운드에 있는 상태이다. </li><li>안드로이드의 onPause() 와 같다고 보면 된다.</li></ul></li><li>resumed : <ul><li>앱이 보이고 user input 에 반응한다. </li><li>안드로이드의 onPostResume() 과 같다.</li></ul></li><li>suspending : <ul><li>앱이 일시적으로 중단된 상태. </li><li>안드로이드의 onStop 과 같다. </li><li>ios 에서는 존재하지 않는다.</li></ul></li></ul>
 </div> <div id="SE-c4fd3b62-cca2-4649-a931-edff6b1467b1">
 <a href="#" onclick="return false;" data-linktype="img" data-linkdata="{&quot;id&quot; : &quot;SE-c4fd3b62-cca2-4649-a931-edff6b1467b1&quot;, &quot;src&quot; : &quot;https://mblogthumb-phinf.pstatic.net/MjAyMzEyMTdfMjQy/MDAxNzAyODA5NDA0NDA2.CRudRZW3bGWzKwRmSExn_-Dwk4lVECDXAAS7cQQlJjkg.jjLjBC0R5M9RtedM72YyeOJKo5ZuJMBgIxFUhdQu_UYg.JPEG.writer0713/11.jpg&quot;, &quot;originalWidth&quot; : &quot;638&quot;, &quot;originalHeight&quot; : &quot;450&quot;, &quot;linkUse&quot; : &quot;false&quot;, &quot;link&quot; : &quot;&quot;}">
 <img src="https://mblogthumb-phinf.pstatic.net/MjAyMzEyMTdfMjQy/MDAxNzAyODA5NDA0NDA2.CRudRZW3bGWzKwRmSExn_-Dwk4lVECDXAAS7cQQlJjkg.jjLjBC0R5M9RtedM72YyeOJKo5ZuJMBgIxFUhdQu_UYg.JPEG.writer0713/11.jpg?type=w800" data-width="693" data-height="488" alt="">
 </a>
 
 
 </div>
 <div id="SE-63da23dc-d130-48ff-883e-056ac66d4e08">
 ​​​​아래 예제코드에서 주의깊게 봐야 하는 부분은 다음과 같다.<ul><li>with WidgetBindingObserver 로 mixin 한 부분</li><li>didChangeAppLifecycleState 메서드에서 state 를 사용하는 부분</li></ul>
 </div> <div id="SE-5b71a969-f7f2-408d-b9e9-e74b751dbfb9">
 class MyApp extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
 return MaterialApp(
 title: 'Flutter Demo',
 theme: ThemeData(
 primarySwatch: Colors.blue,
 ),
 home: MyHomePage(),
 );
 }
}

class MyHomePage extends StatefulWidget {
 @override
 _MyHomePageState createState() =&gt; _MyHomePageState();
}

class _MyHomePageState extends State&lt;MyHomePage&gt; with WidgetsBindingObserver {
 @override
 void initState() {
 super.initState();
 WidgetsBinding.instance.addObserver(this);
 }

 @override
 void dispose() {
 WidgetsBinding.instance.removeObserver(this);
 super.dispose();
 }

 @override
 void didChangeAppLifecycleState(AppLifecycleState state) {
 print('state = $state');
 }

 @override
 Widget build(BuildContext context) {
 return Scaffold(
 appBar: AppBar(
 title: Text('Flutter Tutorial Lifecycle'),
 ),
 body: Center(),
 );
 }
}
 </div> <div id="SE-a7507d72-e81f-4642-8715-b8b8df33acc2">
 이 코드를 실행하고 debug console 을 보면 다음과 같이 state 의 변화를 관찰할수 있다.
 </div> <div id="SE-bdf20e64-1c73-4f53-b797-532e388f40b1">
 <a href="#" onclick="return false;" data-linktype="img" data-linkdata="{&quot;id&quot; : &quot;SE-bdf20e64-1c73-4f53-b797-532e388f40b1&quot;, &quot;src&quot; : &quot;https://mblogthumb-phinf.pstatic.net/MjAyMzEyMTdfMTMw/MDAxNzAyODA5ODgxNjI1.2yW4x5nz8fmFRn_gEOzbn6rlkBhjWLV6Q82wWB_PVPgg.m2iEewPOoOnGdwe5_ea1czKSh95CAXaTT8qHQ2ficwEg.JPEG.writer0713/%E3%84%B4%E3%84%B4%E3%84%B4.jpg&quot;, &quot;originalWidth&quot; : &quot;568&quot;, &quot;originalHeight&quot; : &quot;196&quot;, &quot;linkUse&quot; : &quot;false&quot;, &quot;link&quot; : &quot;&quot;}">
 <img src="https://mblogthumb-phinf.pstatic.net/MjAyMzEyMTdfMTMw/MDAxNzAyODA5ODgxNjI1.2yW4x5nz8fmFRn_gEOzbn6rlkBhjWLV6Q82wWB_PVPgg.m2iEewPOoOnGdwe5_ea1czKSh95CAXaTT8qHQ2ficwEg.JPEG.writer0713/%E3%84%B4%E3%84%B4%E3%84%B4.jpg?type=w800" data-width="693" data-height="239" alt="">
 </a>
 
 
 </div>
 <div id="SE-8b7c41d2-2e9a-4943-a025-106de9bce715">
 <a href="#" onclick="return false;" data-linktype="img" data-linkdata="{&quot;id&quot; : &quot;SE-8b7c41d2-2e9a-4943-a025-106de9bce715&quot;, &quot;src&quot; : &quot;https://blogfiles.pstatic.net/MjAyMTAzMTlfMTU1/MDAxNjE2MTM4MjkxMjM3.dNZls450pxypmf-DDgpsXyvvHMt06U7ZQUNXnOQA43Ug.vtGD-dfDsIyabzZVoo-fdyd2AIYUoQuMT74Plq4T10Yg.JPEG.writer0713/kakao.jpeg?type=w1&quot;, &quot;originalWidth&quot; : &quot;256&quot;, &quot;originalHeight&quot; : &quot;103&quot;, &quot;linkUse&quot; : &quot;true&quot;, &quot;link&quot; : &quot;https://qr.kakaopay.com/2810060110000443710583945dc00000&quot;}">
 <img src="https://blogfiles.pstatic.net/MjAyMTAzMTlfMTU1/MDAxNjE2MTM4MjkxMjM3.dNZls450pxypmf-DDgpsXyvvHMt06U7ZQUNXnOQA43Ug.vtGD-dfDsIyabzZVoo-fdyd2AIYUoQuMT74Plq4T10Yg.JPEG.writer0713/kakao.jpeg?type=w1" alt="">
 </a>
 
 카카오페이로 후원
 </div>
 <div id="SE-d6bd9823-fdf0-4ca2-843d-6f14a118bf86">
 <a href="#" onclick="return false;" data-linktype="img" data-linkdata="{&quot;id&quot; : &quot;SE-d6bd9823-fdf0-4ca2-843d-6f14a118bf86&quot;, &quot;src&quot; : &quot;https://blogfiles.pstatic.net/MjAyMTAzMTlfMTIy/MDAxNjE2MTM4Mzk5Mjkz.7C8k50nPce6NqNspKw4-LN2u34aGtUxhR0Wv_mZH-xQg.U1KVzLLFEU4OaZ2KhamW_jV6_a4jVmvV0V3yY0uTl_Qg.JPEG.writer0713/kakao_qr.jpeg?type=w1&quot;, &quot;originalWidth&quot; : &quot;330&quot;, &quot;originalHeight&quot; : &quot;330&quot;, &quot;linkUse&quot; : &quot;false&quot;, &quot;link&quot; : &quot;&quot;}">
 <img src="https://blogfiles.pstatic.net/MjAyMTAzMTlfMTIy/MDAxNjE2MTM4Mzk5Mjkz.7C8k50nPce6NqNspKw4-LN2u34aGtUxhR0Wv_mZH-xQg.U1KVzLLFEU4OaZ2KhamW_jV6_a4jVmvV0V3yY0uTl_Qg.JPEG.writer0713/kakao_qr.jpeg?type=w1" alt="">
 </a>
 
 카카오페이 QR코드로 후원
 </div>
 </div></div>

나만의공간。

KIM JUNGHWAN

개요 Flutter 에서 App Lifecycle 을 컨트롤 하는 방법에 대해 정리한다. 본인의 경우, 앱사용자가 다른 앱 (ex. 설정) 으로 이동했다가 다시 앱으로 돌아오는 시점에 특정 이벤트를 발생시키고 싶어서 해당 기능을 찾아보았다. Flutter App Lifecycle 아래는 Flutter App Lifecycle 에 대해 설명하는 그림이다. 원글에서 다음과 같이 설명하고 있다. inactive : ios 에서만 동작하는 이벤트, android 에서는 없다. app 이 inactive 상태가 되고 사용자의 input 을 받을수 없는 상태이다. paused : app 이 user 에게 보이지 않는 상태로 user input 에 반응하지 않고 앱이 백그라운드에 있는 상태이다. 안드로이드의 onPause() 와 같다고 보면 된.......

[Flutter] Flutter App Lifecycle

댓글