"<p>In this video we are going to work on a new task in our Flutter To Do Application.</p> <p>The task is : Add Tabs to ListTasksView.</p> <pre> <code>import 'package:flutter/material.dart'; import 'package:todo/widget/ListTasksWidget.dart'; class ListTasksView extends StatefulWidget { const ListTasksView({Key? key}) : super(key: key); @override _ListTasksViewState createState() => _ListTasksViewState(); } class _ListTasksViewState extends State<ListTasksView> { @override Widget build(BuildContext context) { return DefaultTabController( length: 5, child: Scaffold( appBar: AppBar( title: Text("List Tasks"), bottom: const TabBar( isScrollable: true, tabs: [ Tab(text:"All"), Tab(text:"Today"), Tab(text:"Tomorrow"), Tab(text:"This Week"), Tab(text:"Next Week"), ], ), ), body: const TabBarView( children: [ ListTasksWidget(), ListTasksWidget(), ListTasksWidget(), ListTasksWidget(), ListTasksWidget(), ], ), ), ); } }</code> </pre> <p>This is the widget ListTasksWidget : </p> <pre> <code>import 'package:provider/provider.dart'; import 'package:todo/provider/TaskModel.dart'; import 'package:flutter/material.dart'; class ListTasksWidget extends StatelessWidget { const ListTasksWidget({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return Consumer<TaskModel>( builder: (context, model, child) { return ListView.builder( itemCount:model.todoTasks.length, itemBuilder: (BuildContext context, int index) { return Padding( padding: const EdgeInsets.symmetric(vertical: 4.0), child: Container( decoration: BoxDecoration( color: Color(0xFFE2E2E2), border: Border.all( color: Color(0xFFE2E2E2), ), borderRadius: BorderRadius.circular(10) ), child: CheckboxListTile( title: Text(model.todoTasks[index].title), subtitle: Text(model.todoTasks[index].deadline.toString()), value: model.todoTasks[index].status, onChanged: (bool? value) { model.markAsDone(index); print(model.todoTasks[index].status); }, controlAffinity: ListTileControlAffinity.leading, ), ), ); }, ); } ); } }</code> </pre>"