목차

  1. 사용된 기능 설명
  2. 사용 예시

 

 

 

사용된 기능 설명

  • int get counter : Getter 문법으로 controller.counter로 값을 읽을 수 있음
  • update() : GetBuilder로 컨트롤러(CountController)가 상태변화 시, UI를 다시 그리도록 알리는 함수
  • GetBuilder<T> : GetX의 위젯으로 T타입의 컨트롤러 상태를 구독(listener)
    • init : 초기화할 컨트롤러의 인스턴스 사용
  • (_) : 매개변수를 받지만, 사용하지는 않음
  • Get.find<T>() : T타입으로 등록된 인스턴스를 찾아 반환

 

 

 

✅ 사용 예시

 

1️⃣ pubspec.yaml 설정

 

 

2️⃣ controller 작성

 

 

3️⃣ main.dart 작성

  1. 보통은 Get.put()으로 Controller(countController)를 의존성 주입하지만, 여기에선 GetBuilder를 사용
  2. Controller 의존성 주입을 했기에 하단에서 Get.find<T>로 의존성 주입했던 Controller 내부의 메소드를 사용할 수 있게 됨
  3. Get.put()을 사용하려면, void main() 메소드에서 runApp() 위에 선언해야함

 

 

 

 

 

✔️ 사용된 코드

1️⃣ CountController

import 'package:get/get.dart';

class CountController extends GetxController{
  int _counter = 0;
  int get counter => _counter;  // getter 문법 (controller.counter로 값을 읽을 수 있음)

  void increase(){
    _counter++;
    update(); // GetBuilder로 컨트롤러(CountController)가 상태변화 시, UI를 다시 그리도록 알리는 함수
  }

  void decrease(){
    _counter--;
    update();
  }
}

 

2️⃣ main.dart

body: Center(
  child: Column(
    mainAxisAlignment: MainAxisAlignment.center,
    children: [
      GetBuilder<CountController>(  // GetX의 위젯으로 CountController 타입의 컨트롤러 상태를 구독(listener)
        init: CountController(),  // GetBuilder가 처음 빌드될 때, 새 CountController 인스턴스 생성
        builder: (_) => Text("Current Counter : ${Get.find<CountController>().counter}"), // (_) : 매개변수를 받지만, 사용하지는 않음
      ),
      const SizedBox(height: 20),
      Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          TextButton(
            // Get.find<CountController>() : CountController 타입으로 등록된 인스턴스를 찾아 반환
            onPressed: () => Get.find<CountController>().increase(),
            child: const Text("증가")
          ),
          TextButton(
            onPressed: () => Get.find<CountController>().decrease(),
            child: const Text("감소")
          ),
        ],
      ),
    ],
  ),
),

+ Recent posts