Flutter issue : type 'Null' is not a subtype of 'DateTime'

Issue

I am looking for help on a personal project. Basically, I have calendar as an app drawer option, and it was working while I was still on the calendar page and hot reloading but now after a hot restart it keeps showing me this error

type 'Null' is not a subtype of type 'DateTime'

Here is my code for Calendar screen:

import 'package:attendance_checker/screens/home.dart';

import 'package:flutter/material.dart';
import 'package:table_calendar/table_calendar.dart';
import 'package:attendance_checker/models/calendar_events.dart';

class Calender extends StatefulWidget {
  const Calender({Key? key}) : super(key: key);

  @override
  _CalenderState createState() => _CalenderState();
}

class _CalenderState extends State<Calender> {
  late Map<DateTime, List<Event>> selectedEvents;
  CalendarFormat format = CalendarFormat.month;
  var focusedDay;
  var selectedDay;

  TextEditingController _eventController = TextEditingController();

  @override
  void initState() {
    selectedEvents = {};
    super.initState();
  }

  @override
  void dispose() {
    _eventController.dispose();
    super.dispose();
  }

  List<Event> _getEventsfromDay(DateTime date) {
    return selectedEvents[date] ?? [];
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: BackButton(
            color: Colors.white,
            onPressed: () => Navigator.pushReplacement(
                context, MaterialPageRoute(builder: (context) => Home()))),
        title: Text("Calendar"),
        backgroundColor: Colors.green[700],
      ),
      body: SingleChildScrollView(
        child: Column(
          children: <Widget>[
            Column(
              children: [
                TableCalendar(
                  focusedDay: DateTime.now(),
                  firstDay: DateTime.utc(2010, 10, 16),
                  lastDay: DateTime.utc(2030, 3, 14),
                  calendarFormat: format,
                  onFormatChanged: (CalendarFormat _format) {
                    setState(() {
                      format = _format;
                    });
                  },
                  eventLoader: _getEventsfromDay,
                  calendarStyle: CalendarStyle(
                      isTodayHighlighted: true,
                      selectedDecoration: BoxDecoration(
                        color: Colors.green[300],
                        shape: BoxShape.circle,
                      ),
                      selectedTextStyle: TextStyle(color: Colors.white),
                      todayDecoration: BoxDecoration(
                        color: Colors.green[700],
                        shape: BoxShape.circle,
                      )),
                  startingDayOfWeek: StartingDayOfWeek.sunday,
                  daysOfWeekVisible: true,
                  onDaySelected: (DateTime selectDay, DateTime focusDay) {
                    setState(() {
                      selectedDay = selectDay;
                      focusedDay = focusDay;
                    });
                    print(focusedDay);
                  },
                  selectedDayPredicate: (DateTime date) {
                    return isSameDay(selectedDay, date);
                  },
                  headerStyle: HeaderStyle(
                      formatButtonVisible: false, titleCentered: true),
                ),
                ..._getEventsfromDay(selectedDay).map((Event event) => ListTile(
                      title: Text(event.title),
                    )),
              ],
            )
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton.extended(
        onPressed: () => showDialog(
          context: context,
          builder: (context) => AlertDialog(
            title: Text("Add Event"),
            content: TextFormField(
              controller: _eventController,
            ),
            actions: [
              TextButton(
                  onPressed: () => Navigator.pop(context),
                  child: Text("Cancel")),
              TextButton(
                  onPressed: () {
                    if (_eventController.text.isEmpty) {
                    } else {
                      if (selectedEvents[selectedDay] != null) {
                        selectedEvents[selectedDay]!
                            .add(Event(title: _eventController.text));
                      } else {
                        selectedEvents[selectedDay] = [
                          Event(title: _eventController.text)
                        ];
                      }
                    }
                    Navigator.pop(context);
                    _eventController.clear();
                    setState(() {});
                    return;
                  },
                  child: Text("OK"))
            ],
          ),
        ),
        label: Text("Add label"),
        icon: Icon(Icons.add),
        backgroundColor: Colors.green[600],
      ),
    );
  }
}

And here is where I call the calendar screen:

import 'package:attendance_checker/screens/calender.dart';
import 'package:attendance_checker/screens/help.dart';
import 'package:attendance_checker/widgets/checkboxlist.dart';
import 'package:attendance_checker/widgets/classinfo.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class Home extends StatefulWidget {
  //const Home({ key }) : super(key: key);

  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("Attendance Checker"),
          backgroundColor: Colors.green[700],
        ),
        drawer: Drawer(
          child: ListView(
            children: [
              DrawerHeader(
                child: Text(
                  "Drawer header",
                  style: TextStyle(fontSize: 24, color: Colors.white),
                ),
                decoration: BoxDecoration(color: Colors.green[700]),
              ),
              ListTile(
                title: Text("Calender"),
                trailing: Icon(Icons.calendar_today_rounded),
                onTap: () {
                  Navigator.pushReplacement(context,
                      MaterialPageRoute(builder: (context) => Calender()));
                },
              ),
              ListTile(
                title: Text("Help"),
                trailing: Icon(Icons.question_answer),
                onTap: () {
                  Navigator.pushReplacement(
                      context, MaterialPageRoute(builder: (context) => Help()));
                },
              )
            ],
          ),
        ),
        backgroundColor: Colors.green[400],
        body: Column(
          children: <Widget>[ClassInfo(), Checklist()],
        ));
  }
}

I am not sure why this error is occurring, but it would be of great help if you could help me with it. Thanks in advance

Solution

Does it work if you change the line var selectedDate to the one below

 late DateTime selectedDay;

And then making the following changes as shown below:

  • Adding toList (the .map() method returns an Iterable, which you must turn into a List for you to be able to use it as the children of a Column)
  • Adding an if check to make sure selectedDay has been assigned by the time you’re looking to use it.
if (selectedDay != null)
                ..._getEventsfromDay(selectedDay).map((Event event) => ListTile(
                      title: Text(event.title),
                    )).toList(),

Answered By – Tim Jacobs

Answer Checked By – Clifford M. (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *