Articles in this section
Category / Section

How to get the current month appointments in the Flutter calendar

1 min read

In the Flutter Calendar, you can get and show the current month appointments in an alert window using viewChangedDetails.visibleDates property in onViewChanged callback.

In initState(), set the default values.

CalendarDataSource _dataSource;
 
List<Appointment> _currentMonthAppointments;
 
@override
void initState() {
  _dataSource = _getCalendarDataSource();
  _currentMonthAppointments = <Appointment>[];
 
  super.initState();
}

Using the onViewChanged callback of the Flutter calendar, get the current month appointments using viewChangedDetails.visibleDates property.

children: [
  RaisedButton(
    child: Text('Get current month appointment details'),
    onPressed: _showDialog,
  ),
  Expanded(
    child: Scrollbar(
      child: SfCalendar(
        view: CalendarView.month,
        dataSource: _dataSource,
        onViewChanged: viewChanged,
 
      ),
    ),
  ),
],
 
void viewChanged(ViewChangedDetails viewChangedDetails) {
  _currentMonthAppointments = GetVisibleAppointments(viewChangedDetails
      .visibleDates[viewChangedDetails.visibleDates.length ~/ 2].month);
}
 
List<Appointment> GetVisibleAppointments(int visibleDates) {
  List<Appointment> visibleAppointment = <Appointment>[];
  for (int j = 0; j < _dataSource.appointments.length; j++) {
    if (visibleDates == _dataSource.appointments[j].startTime.month) {
      visibleAppointment.add(_dataSource.appointments[j]);
    }
  }
  return visibleAppointment;
}

Using onPressed() callback of the RaisedButton, show the current month appointment details in alert window.

_showDialog() async {
  await showDialog(
    context: context,
    // ignore: deprecated_member_use
    child: new AlertDialog(
      title: Container(
        child: Text("Visible dates contains " +
            _currentMonthAppointments.length.toString() +
            " appointments"),
      ),
      contentPadding: const EdgeInsets.all(16.0),
      content: ListView.builder(
          itemCount: _currentMonthAppointments.length,
          itemBuilder: (BuildContext context, int index) {
            return new Text(_currentMonthAppointments[index].subject);
          }),
      actions: <Widget>[
        new FlatButton(
            child: const Text('OK'),
            onPressed: () {
              Navigator.pop(context);
            })
      ],
    ),
  );
}

View sample in GitHub

Flutter calendar visible appointments

 

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please sign in to leave a comment
Access denied
Access denied