A simple todo app built with Flutter that demonstrates the usage of the provider
package for state management. The app also utilizes shared preferences
for persisting the todo list.
The Todo App allows users to create a list of todos and mark them as completed. It showcases the basic features of the provider
package, including listening to changes, accessing state without listening, and selecting specific parts of the state. The app also uses shared preferences to persist the todo list so that it can be loaded between app sessions.
- Add new todos to the list.
- Toggle the completion status of todos.
- Flutter
- provider
- shared_preferences
-
Clone the repository:
git clone https://github.com/your-username/todo-app.git
-
Navigate to the project directory:
cd todo-app
-
Install the dependencies:
flutter pub get
-
Run the app:
flutter run
The provider
package is used for managing the state of the todo list in this app, while shared preferences is used for persisting the todo list between app sessions.
- The
TodoListProvider
is set up as the provider for managing the state of the todo list. - It extends
ChangeNotifier
and provides methods to add a todo, toggle todo completion, and complete all todos. - It exposes getters for accessing the list of todos, total number of todos, and total number of completed todos.
- The
TodoListProvider
uses shared preferences to persist the todo list. - When the app starts, the
loadTodos
method is called to retrieve the persisted todo list from shared preferences. - When a todo is added or its completion status is toggled, the
saveTodos
method is called to update the persisted todo list in shared preferences.
- The
TodoListScreen
is the main screen of the app. - It includes an
AppBar
, an input field for adding new todos, the todo list, the todo count, and a button to complete all todos.
- When the user taps the "Add" button, the
_addTodo
method is called. - It retrieves the
TodoListProvider
usingProvider.of
and adds a new todo to the list.
- The
TodoList
widget displays the list of todos. - It uses
context.watch
to listen to changes onTodoListProvider
. - The list view is built using
ListView.builder
, and each todo is displayed as aListTile
with a checkbox for marking it as completed.
- The
TodoCount
widget displays the total number of todos and the total number of completed todos. - It utilizes
context.select
to select the relevant values fromTodoListProvider
without rebuilding when other parts of the state change.
- The "Complete All" button in the
TodoListScreen
triggers thecompleteAllTodos
method. - It retrieves the
TodoListProvider
usingcontext.read
and calls thecompleteAllTodos
method to mark all todos as completed. - The
TodoListProvider
internally updates the state and triggers a rebuild of the relevant widgets.
- The app uses the
shared_preferences
package to persist the todo list. - The
TodoListProvider
utilizes shared preferences to load and save the todo list. - When the app starts, the
loadTodos
method retrieves the persisted todo list from shared preferences and updates the provider's state. - When a todo is added or its completion status is toggled, the
saveTodos
method is called to update the persisted todo list in shared preferences.