[flutter] 플러터 프로바이더를 사용하여 To-Do 앱 만들기

26 Dec 2023

flutter

Flutter를 사용하여 To-Do 앱을 만들 때, 애플리케이션 전체에서 상태를 관리하고 공유하는 것이 중요합니다. 이를 위해 Flutter Provider 패키지를 사용하여 효율적으로 상태 관리를 할 수 있습니다.

Flutter Provider란 무엇인가요?

Flutter Provider는 작은 및 중간 규모의 애플리케이션에서 상태 관리를 위한 간편한 해결책을 제공하는 패키지입니다. 이 패키지는 변경 알림의 비효율성과 귀찮은 ‘setState’ 호출을 방지하여 상태를 쉽게 관리할 수 있게 해줍니다.

To-Do 앱을 만들기 위한 Flutter Provider 사용법

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider<TodoModel>(
      create: (context) => TodoModel(),
      child: MaterialApp(
        title: 'To-Do 앱',
        home: TodoScreen(),
      ),
    );
  }
}

class TodoScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var todoProvider = Provider.of<TodoModel>(context);

    return Scaffold(
      appBar: AppBar(
        title: Text('To-Do 앱'),
      ),
      body: ListView.builder(
        itemCount: todoProvider.todos.length,
        itemBuilder: (context, index) {
          return ListTile(
            title: Text(todoProvider.todos[index].title),
            trailing: Checkbox(
              value: todoProvider.todos[index].isCompleted,
              onChanged: (value) {
                todoProvider.updateTodo(index, value);
              },
            ),
          );
        },
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          todoProvider.addTodo();
        },
        child: Icon(Icons.add),
      ),
    );
  }
}

위의 코드 예제는 ToDo 앱을 만들기 위한 Flutter Provider를 사용하는 방법을 보여줍니다. 프로바이더를 사용하여 할 일 목록 데이터 및 해당 상태를 관리하고, UI에서 해당 상태를 쉽게 표시 및 업데이트할 수 있습니다.

결론

Flutter Provider는 To-Do 앱과 같은 작은 규모의 애플리케이션에서 상태 관리를 효율적으로 할 수 있도록 도와줍니다. 변경 알림 및 ‘setState’ 호출에 대한 귀찮음을 덜어주고, 코드를 단순화하여 개발 생산성을 향상시킵니다.

더 많은 정보를 원하시면 공식 Flutter Provider 문서를 참고해 주세요.

Flutter Provider 공식 문서

이제 플러터 프로바이더를 사용하여 To-Do 앱을 만들 때 도움이 되시길 바랍니다.