[035] 플러터 (Flutter) 배우기 - 상태 관리5 (GetX 사용 - Simple State Manager, GetBuilder 사용)

2023. 2. 19. 22:17모바일어플개발/Flutter

반응형

안녕하세요~ totally 개발자입니다.

 

GetX - Simple State Manager, GetBuilder 사용

 

GetX는 상태관리 이외에 코드 간결화 등의 목적으로도 많이 사용되며 오늘은 상태관리, 먼저 GetBuilder를 활용한 Simple State Manager에 대해 살펴보겠습니다. 

 

Step 1: pubspec.yaml에 get을 등록합니다.

 

 

 

Step 2: countController.dart 파일을 생성해주고 코드를 다음처럼 작성해줍니다. 10번째 줄에 보시면 update()라는 함수가 사용되는데 이것을 호출해야 상태가 업데이트됩니다. increase, decrease 함수를 각각 적어주었습니다.

 

 

Step 3: main.dart 파일을 열어서 다음처럼 import해줍니다.

 

 

 

Step 4: main.dart 내에 다음처럼 코드를 작성해주시면 됩니다.

28번째에 GetBuilder<CountController>로 적어주시고 29번째 init 속성을 통해 CountController의 인스턴스를 만들어주시면 됩니다. 이것으로 Get.put(CountController())를 대체할 수 있습니다. Get.put은 Dependency Injection(의존성 주입)을 위한 것이며 init 속성으로 이것을 대체할 수 있고 추후 Get.find를 통해 만들어진 인스턴스를 찾아 메소드에 접근할 수 있습니다. 31번째 줄에 Get.find<CountController>()로 인스턴스 타입을 명시해주시면 counter를 getter로 접근하여 값을 가져올 수 있습니다. 또한 35번째에 TextButton를 눌렀을 때 Get.find<CountController>().increase() 또는 decrease()를 통해 값을 증가 또는 감소시킬 수 있습니다.

 

 

Step 5: 다음처럼 카운트가 반영되면 성공입니다.

 

 

다음 시간에는 Reactive State Manager에 대해 살펴보겠습니다.

 

[전체 소스 코드]

 

 

 

References

 

https://pub.dev/packages/get

 

get | Flutter Package

Open screens/snackbars/dialogs without context, manage states and inject dependencies easily with GetX.

pub.dev

 

[유튜브 강좌 영상]

 

https://youtu.be/bMpf77l6RXs

 

반응형