Vamos comparar o que você aprendeu sobre MVVM na aula anterior com o que temos até agora e que ainda será feito na próxima aula em vídeo.
Model:
O model em nossa aplicação é a classe Todo.
View:
É o widget TodoListWidget. Nele nós exibimos todas as tarefas.
ViewModel:
Relembrando sobre o ViewModel: "Ele contém a lógica de apresentação e atua como uma camada intermediária entre a View e o Model."
Em nossa aplicação o ViewModel nós chamamos de TodoListController.
Exemplo da aula anterior atualizado para o nosso projeto:
import 'package:flutter/material.dart';
// Model
class Todo {
final int id;
final String task;
Todo({required this.id, required this.task,});
}
// ViewModel
class TodoListController {
late List<Todo> _todoList;
TodoListController() {
// Aqui você poderia inicializar o usuário, buscar dados, etc.
_todoList = [
Todo(id: 1, task: 'Task 1'),
Todo(id: 2, task:'Task 2'),
Todo(id: 3, task: 'Task 3'),
];
}
List<Todo> get todoList => _todoList;
}
// View
class TodoListWidget extends StatelessWidget {
final TodoListController viewModel = TodoListController();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Minhas Tarefas'),
),
body: ListView.builder(
itemCount: viewModel.todoList.length,
itemBuilder: (BuildContext context, int index) {
return ListTile(
title: Text(viewModel.todoList[index].task),
);
}
),
);
}
}Neste exemplo (versão simplificada do projeto real) está tudo junto, mas nas aulas cada um fica separado em seu próprio arquivo.