Flutter Desktop Apps: Getting Started

Now that you know how to create and show menus, you can show your knowledge by accepting this challenge:

Implement the delete list menu. If you go to the Todos menu, you will see a delete sub menu. Under there will be a List.

To handle this challenge, you need to understand a few important topics: Riverpod, which you can find information on at https://riverpod.dev/docs/getting_started and the BuildContext.

If you want to show a dialog, you’ll need a BuildContext and if you want to delete a Todo list you’ll need a reference to the repository. Look through the code and see if you can find references to this.

Go ahead and get started. You should be able to delete the current todo list by selecting this menu. As a bonus, add a dialog to make sure the user really wants to delete it before hand.

Challenge Solution

How was it? Easy? Difficult? Let’s go ahead and show how to do this. If you look through the code, you will see a method named: areYouSureDelete. This will show a dialog promting the user to answer Yes or No. In order to use this dialog you’ll need a context. Searching through the code shows that we can get the current context from the global navigatorKey: navigatorKey.currentContext.

Now, to delete that list, you’ll need to get the current list and the repository. Luckily, you have a ProviderRef named ref. This will get you the list controller and the repository.

Android Studio

Here’s the full code:

final listController = ref.read(listControllerProvider);
final todoList = listController.currentList;
if (todoList.name != 'empty') {
  areYouSureDelete(navigatorKey.currentContext!,
      'Are you sure you want to delete ${todoList.name}',
          (deleted) {
        if (deleted) {
          final repository = ref.read(repositoryProvider);
          repository.deleteTodoList(todoList);
        }
      });
}

This gets a reference to the list controller where we can get the current list. If the name isn’t empty (the default list), then we ask the user if they are sure they want to delete this list. If the user selects yes, then we get a reference to the repository and delete it. This will automatically update the screen to remove the list.

If you were able to solve this challenge, congratulations! If not, I hope you learned some new techniques.