[flutter] 플러터에서의 상태 관리 방법

15 Dec 2023

flutter

Flutter 앱을 개발하면서 상태 관리는 매우 중요합니다. 사용자 입력, 네트워크 요청 또는 데이터 변경과 같은 이벤트에 따른 상태 변화를 관리해야 합니다. 이번 블로그에서는 Flutter에서 사용되는 주요 상태 관리 방법에 대해 알아보겠습니다.

SetState 메서드

Flutter에서 가장 기본적으로 사용되는 상태 관리 방법은 setState 메서드입니다. 이 메서드를 통해 StatefulWidget 클래스 내에서 상태를 변경하고 화면을 다시 그릴 수 있습니다.

예시:

class MyWidget extends StatefulWidget {
  @override
  _MyWidgetState createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  bool _isLoading = false;

  void fetchData() {
    setState(() {
      _isLoading = true;
      // 네트워크 요청 등의 비동기 작업 수행
      // 작업 완료 후 _isLoading을 false로 변경
    });
  }

  @override
  Widget build(BuildContext context) {
    return _isLoading ? CircularProgressIndicator() : Text('Data Loaded');
  }
}

Provider 패키지

Provider 패키지는 Flutter 앱에서 상태 관리를 위한 강력한 도구입니다. ChangeNotifier나 ValueNotifier와 함께 사용하여 상태를 관리하고 상태 변경을 감지할 수 있습니다.

예시:

final counterProvider = ChangeNotifierProvider((ref) => Counter());

class Counter extends ChangeNotifier {
  int _count = 0;
  int get count => _count;

  void increment() {
    _count++;
    notifyListeners();
  }
}

GetX 패키지

GetX 패키지는 단순한 구조와 뛰어난 성능을 제공하여 Flutter 앱의 상태 관리를 손쉽게 할 수 있습니다. Obx나 GetBuilder와 함께 사용하여 상태 변화를 감지하고 UI를 업데이트할 수 있습니다.

예시:

class MyController extends GetxController {
  final count = 0.obs;

  void increment() {
    count.value++;
  }
}

class MyWidget extends StatelessWidget {
  final MyController c = Get.put(MyController());

  @override
  Widget build(BuildContext context) {
    return Obx(() => Text("${c.count}"));
  }
}

Riverpod 패키지

Riverpod 패키지는 의존성 주입을 지원하고 다양한 상태 관리 패턴을 제공합니다. Provider를 통해 상태를 제공하고, ConsumerWidget을 사용하여 상태 변화를 구독할 수 있습니다.

예시:

final counterProvider = StateProvider((ref) => 0);

class MyWidget extends ConsumerWidget {
  @override
  Widget build(BuildContext context, ScopedReader watch) {
    final count = watch(counterProvider).state;
    return Text('$count');
  }
}

위에서 설명한 방법들은 각각 장단점이 있으므로 프로젝트의 요구 사항에 맞게 적절한 방법을 선택해야 합니다.

이상으로 Flutter에서의 상태 관리 방법에 대해 알아보았습니다. 여러분의 Flutter 앱 개발에 도움이 되길 바랍니다.

목차

SetState 메서드

Provider 패키지

GetX 패키지

Riverpod 패키지