[Flutter] Getx 상태관리

UI에서 실시간으로 변하는 여러 데이터들의 상태를 효율적으로 관리하기 위한 개념이다.

• 장점

1. 생산성

2. 직관적인 코드로 간단하게 구현 가능.

3. 성능과 최소한의 리소스 소비에 중점을 두기 때문에, Streams나 ChangeNotifier를 사용하지 않음.

4. View, 프레젠테이션 로직, 비즈니스로직, 종속성 주입 및 네비게이션을 완전히 분리하여 관리.
   
   

참고 문서 : https://pub.dev/packages/get/example

---

사용법

• initBindings.dart

class InitBindings extends Bindings{
	@override
    void dependencies(){
    	Get.put(CounterViewModel(), permanent: true);
    }
}

• main.dart

	return GetMaterialApp(
    	...
        initialBinding: InitBindings(),
        getPages: [
        	GetPage(
            	name: '/', page: () => const HomeView(), 
                transition: Transition.zoom),
        ]
    );

• counterViewModel

class CounterViewModel with GetxController{
	int _count = 0;
    
    get count => _count;
    
    void increase(){
    	_count++;
        update();
    }
}

접근 방법

• GetBuilder

GetBuilder<CounterViewModel>(
	builder: (controller){
    	...
        controller.increase();
        return Text(controller.count);
    }
)

• Instance로 접근

CounterViewModel _counterViewModel = Get.put(CounterViewModel());

// 호출
_counterViewModel.increase();

• Get.find() to 접근

class CounterViewModel with GetxController{
	static CounterViewModel get to => Get.find();
    ...
}

// 호출
CounterViewModel.to.increase();

• GetView

class HomeView extends GetView<CounterViewModel>{
	// controller로 접근
    // 호출
    return Text(controller.count);
}

반응형 상태관리

• GetX

GetX<CounterViewModel>(
	builder: (controller){
    // count가 RxInt count = 0.obs인 경우
    	return Text(controller.count.value);
    }
)

• Obx

Obx( () => Text(controller.count.value) )

---

Worker 추가 기능

controller 안에서 onInit메서드를 override하고 그 안에 추가하여 사용한다.

• 종류 4가지

1. Ever : 매번 변경 될 때 실행.

2. Once : 처음 변경 되었을 때만 실행.

3. Interval : 계속 변경이 있는 동안, 특정 지정 시간 인터벌이 지나면 실행.

4. Debounce : 인터벌이 끝나고 나서 특정 지정시간 이후에 한번만 실행.
   
   

• 사용법

class CounterViewModel with GetxController{
	int _count = 0;
    ...
    
	@override
    void onInit(){
    	once(_count, (_){
        	print('$_이 처음으로 변경 되었습니다.');
        });
        super.onInit();
    }
}

---

GetX의 종속성 4가지

1. Get.put -> Get.put(CounterViewModel());
   // 일반적인 사용법.

2. Get.lazyPut -> Get.lazyPut<CounterViewModel>( () => CounterViewModel());
   // 사용 될때만 호출된다.

3. Get.putAsync -> Get.putAsync<CounterViewModel>( () async{ return CounterViewModel(); } )
   // 비동기식으로 데이터를 받아오거나 가공처리를 하기 위해 사용된다. 잘 사용되지 않는다.

4. Get.create -> Get.create<CounterViewModel>( ()=>CounterViewModel() );
   // 매번 새로운 컨트롤러 인스턴스가 생성된다. 그렇기에 메모리 효율이 떨어질 것으로 보이며, 잘 사용되지 않는다.