[flutter] 플러터 프로바이더에서의 테마 설정 방법

14 Dec 2023

flutter

플러터 앱에서 테마를 관리하기 위해 Provier 라이브러리를 사용하는 방법을 알아봅니다.

1. 플러터 프로바이더 설치

먼저, pubspec.yaml 파일에 다음과 같이 provider 패키지를 추가합니다:

dependencies:
  provider: ^4.3.3

그다음, 터미널에서 아래 명령어를 실행하여 패키지를 설치합니다:

flutter pub get

2. 테마 프로바이더 생성

다음은 테마 프로바이더를 생성하는 예제 코드입니다:

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

class ThemeProvider with ChangeNotifier {
  ThemeData _themeData;

  ThemeProvider() {
    _themeData = ThemeData.light();
  }

  ThemeData get themeData => _themeData;

  set themeData(ThemeData themeData) {
    _themeData = themeData;
    notifyListeners();
  }
}

3. 앱에서 테마 사용

이제 프로바이더를 사용하여 앱의 테마를 설정할 수 있습니다:

Widget build(BuildContext context) {
  return ChangeNotifierProvider(
    create: (context) => ThemeProvider(),
    child: Consumer<ThemeProvider>(
      builder: (context, themeProvider, child) {
        return MaterialApp(
          theme: themeProvider.themeData,
          // 나머지 앱 내용
        );
      },
    ),
  );
}

4. 테마 변경

테마를 변경하려면 ThemeProvider의 인스턴스를 가져와서 themeData를 업데이트하면 됩니다:

final themeProvider = Provider.of<ThemeProvider>(context, listen: false);
themeProvider.themeData = ThemeData.dark();

이제 플러터 앱에서 프로바이더를 사용하여 간단하게 테마를 관리할 수 있습니다!

결론

플러터와 프로바이더 라이브러리를 사용해서 테마를 효과적으로 관리하는 방법을 살펴보았습니다. 테마 관리를 위해 프로바이더 패턴을 사용하면 코드를 깔끔하게 유지하면서 테마를 동적으로 변경할 수 있습니다.