Flutter & Dart GetX 상태 관리 라이브러리: 자세한 가이드

GetX는 플러터(Flutter) 앱의 상태 관리와 라우팅을 편리하게 처리할 수 있는 강력한 라이브러리입니다. 이 블로그 포스트에서는 GetX의 기능과 사용법에 대해 자세히 알아보겠습니다.

1. 필요한 패키지 추가

dependencies:
  flutter:
    sdk: flutter
  get: ^latest_version

2. GetX 기본 사용법

2.1. GetX 시작하기:

import 'package:flutter/material.dart';
import 'package:get/get.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      title: 'GetX Example',
      home: MyHomePage(),
    );
  }
}

2.2. 컨트롤러 생성:

class MyController extends GetxController {
  var count = 0.obs; // 반응형 상태 변수
  void increment() => count.value++;
}

2.3. 상태 변경 및 감지:

class MyHomePage extends StatelessWidget {
  final MyController controller = Get.put(MyController());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('GetX Example'),
      ),
      body: Center(
        child: Obx(() => Text('Count: ${controller.count}')),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: controller.increment,
        child: Icon(Icons.add),
      ),
    );
  }
}

3. 라우팅 및 네비게이션

3.1. 라우트 정의:

class Routes {
  static const HOME = '/';
  static const DETAILS = '/details';
}

3.2. 라우팅:

Get.toNamed(Routes.DETAILS);

3.3. 네비게이션 파라미터 전달:

Get.toNamed(Routes.DETAILS, arguments: {'data': 'Hello from Home'});

3.4. 파라미터 받기:

final data = Get.arguments['data'];

4. 추가 기능과 상태 관리

GetX는 다양한 추가 기능과 상태 관리 옵션을 제공합니다. GetX, GetXController, GetBuilder, Obx 등을 활용하여 효과적인 상태 관리와 UI 업데이트를 수행할 수 있습니다.

5. 상태 관리 패턴과의 비교

GetX는 프로젝트의 크기와 요구 사항에 따라 상태 관리 패턴을 선택할 수 있습니다. Provider, Riverpod 등과 비교하여 GetX의 편의성과 성능을 고려하여 선택할 수 있습니다.