[Flutter] 상태관리가 필요한 배경?

Flutter 구조

: Flutter는 모든 것이 ‘Widget’으로 이루어져 있음. Java에서 모든 객체가 Object라는 클래스를 상속 받듯 UI와 관련된 모든것은 Widget

StatelessWidget

: 변하지 않는 정적인 화면을 구성할때 사용합니다. 단순 텍스트나 앱에 대한 정보 화면 등이 이 경우에 해당

• 예시

  class StatelessExample extends StatelessWidget {
    const StatelessExample({Key? key}) : super(key: key);
  
    @override
    Widget build(BuildContext context) {
      return  Container(
        color: Colors.blue,
        child: const Text('StatelessWidget Example'),
      );
    }
  }

StatefulWidget

: 화면에 변화가 있는 동적인 화면을 구성할때 사용합니다. 체크박스나 라디오박스, 사용자가 텍스트를 입력하는 필드, 게임의 점수 등 실시간으로 업데이트되는 UI가 포함된 화면의 경우 StatefulWidget을 사용

• 예시

  import 'package:flutter/material.dart';
   
   class StatefulExample extends StatefulWidget {
     const StatefulExample({Key? key}) : super(key: key);
   
     @override
     State<StatefulExample> createState() => _StatefulExampleState();
   }
   
   class _StatefulExampleState extends State<StatefulExample> { // setState() 의 영향을 받는 영역
       int _counter = 0;
   
     @override
     Widget build(BuildContext context) { // UI가 렌더링 되는 영역
       return Scaffold(
         appBar: AppBar(
           title: const Text('StatefulWidget Example'),
         ),
         body: Center(
           child: ElevatedButton(
             child: Text(
               '현재 숫자: $_counter',
             ),
             onPressed: () {
               setState(() { // 누르는 순간 재렌더링
                 _counter++;
               });
             },
           ),
         ),
       );
     }
   }

• State형식의 또 다른 서브클래스가 존재하는 데 이 서브클래스가 동적인 화면을 렌더링하게 됨

상태관리란?

: 실시간으로 변하는 여러 데이터들을의 상태를 효율적으로 관리하기 위함

→ 특정 데이터가 바뀔 때 마다 화면 전체를 재렌더링 하는것은 어플리케이션에서의 자원의 낭비가 너무 큼

→ 특정 데이터가 바뀔 때 다른 화면에서도 해당 데이터의 변화가 동일하게 이루어져야하는 경우가 있음

상태관리 라이브러리

• GetX
• BloC
• Provider