[flutter] Flutter Riverpod에서 알림 공지 처리하기

14 Dec 2023

flutter

알림 기능을 가진 애플리케이션을 개발할 때, Riverpod을 사용하여 간단하게 알림 공지 처리를 구현할 수 있습니다. 이 방법을 통해 상태를 관리하고 UI 업데이트를 유연하게 처리할 수 있습니다.

Riverpod 설정

가장 먼저 riverpod 패키지를 프로젝트에 추가해야 합니다.

dependencies:
  flutter:
    sdk: flutter
  riverpod: ^1.0.3

이제 main.dart 파일에서 flutter_riverpod 라이브러리를 가져옵니다.

import 'package:flutter_riverpod/flutter_riverpod.dart';

알림 모델 생성

알림 공지에 대한 정보를 가지고 있는 모델 클래스를 생성합니다. 이 예제에서는 간단한 Notification 모델을 만들어 보겠습니다.

class Notification {
  final String title;
  final String message;

  Notification(this.title, this.message);
}

알림 상태 관리

다음으로, 알림 관련 상태를 관리하기 위한 Provider를 생성합니다.

final notificationProvider = StateProvider<Notification>((ref) => throw UnimplementedError());

알림 화면 구현

이제 UI에서 이 Provider를 사용하여 알림을 표시할 수 있습니다.

class NotificationScreen extends ConsumerWidget {
  @override
  Widget build(BuildContext context, ScopedReader watch) {
    final notification = watch(notificationProvider);
    return Scaffold(
      appBar: AppBar(
        title: Text('알림'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              notification.state.title,
              style: TextStyle(fontSize: 24),
            ),
            SizedBox(height: 20),
            Text(
              notification.state.message,
              style: TextStyle(fontSize: 18),
            ),
          ],
        ),
      ),
    );
  }
}

알림 업데이트

애플리케이션 다른 부분에서 알림을 업데이트하려면 다음과 같이 할 수 있습니다.

context.read(notificationProvider).state = Notification('새로운 알림', '새로운 내용이 도착했습니다!');

이제 Riverpod을 사용하여 간편하게 Flutter 애플리케이션에서 알림 공지를 처리할 수 있습니다. UI와 비즈니스 로직을 효율적으로 분리하여 관리할 수 있는 이러한 방식은 개발자에게 많은 혜택을 제공합니다.

더 많은 정보를 원하시면 Riverpod 공식 문서를 참고하시기 바랍니다.