Articles in this section
Category / Section

How to handle appointments for multiple resources in the Flutter Calendar

2 mins read

In the Flutter Event Calendar, you can show the particular resource appointments using the `Switch` widget.

STEP 1: In the initState() method, set the default values for the calendar:

bool _isJoseph = false;
bool _isStephen = false;
List<Appointment>? _appointments;
DataSource? _dataSource;
List<Appointment>? _josephAppointments, _stephenAppointments;
 
@override
void initState() {
  _dataSource = _getCalendarDataSource();
  super.initState();
}

 

STEP 2: Add appointments to respective resources. When the switch is toggled, the respective appointments are displayed in the view, and when toggled back, the appointment collection is cleared:

SafeArea(
  child: Row(
    children: <Widget>[
      Switch(
        value: _isJoseph,
        onChanged: (value) {
          setState(() {
            if (value) {
              _updateJosephAppointments();
              _dataSource!.appointments!.addAll(_josephAppointments!);
              _dataSource!.notifyListeners(
                  CalendarDataSourceAction.reset, _josephAppointments!);
            } else {
              for (int i = 0; i < _josephAppointments!.length; i++) {
                _dataSource!.appointments!.remove(_josephAppointments![i]);
              }
              _josephAppointments!.clear();
              _dataSource!.notifyListeners(
                  CalendarDataSourceAction.reset, _josephAppointments!);
            }
            _isJoseph = value;
          });
        },
        activeTrackColor: Colors.lightGreenAccent,
        activeColor: Colors.green,
      ),
      Text('Dr.Joseph (Nephrologist)'),
    ],
  ),
),
 
void _updateJosephAppointments() {
  _josephAppointments = _josephAppointments ?? <Appointment>[];
  Appointment newAppointment = Appointment(
    startTime: DateTime.now(),
    endTime: DateTime.now().add(Duration(hours: 1)),
    subject: 'Interactive Live Workshop on Robotic Surgery in Gynecology',
    color: Colors.lightGreen,
  );
  Appointment newAppointment1 = Appointment(
    startTime: DateTime.now().add(Duration(days: -3, hours: 6)),
    endTime: DateTime.now().add(Duration(days: -3, hours: 7)),
    subject:
    'Billion Hearts Beating brings you Happy Heart Fest to celebrate World Heart Day',
    color: Colors.lightGreen,
  );
  Appointment newAppointment2 = Appointment(
    startTime: DateTime.now().add(Duration(days: -2, hours: 5)),
    endTime: DateTime.now().add(Duration(days: -2, hours: 6)),
    subject: 'Join Hands for Patient Safety',
    color: Colors.lightGreen,
  );
  Appointment newAppointment3 = Appointment(
    startTime: DateTime.now().add(Duration(days: -1, hours: 4)),
    endTime: DateTime.now().add(Duration(days: -1, hours: 5)),
    subject: 'Robotic GI Surgery International Congress',
    color: Colors.lightGreen,
  );
  Appointment newAppointment4 = Appointment(
    startTime: DateTime.now().add(Duration(days: 3, hours: 8)),
    endTime: DateTime.now().add(Duration(days: 3, hours: 9)),
    subject: 'World Continence Week - Free Check-up Camp for women',
    color: Colors.lightGreen,
  );
  _josephAppointments!.add(newAppointment);
  _josephAppointments!.add(newAppointment1);
  _josephAppointments!.add(newAppointment2);
  _josephAppointments!.add(newAppointment3);
  _josephAppointments!.add(newAppointment4);
}
 
void _updateStephenAppointments() {
  _stephenAppointments = _stephenAppointments ?? <Appointment>[];
  Appointment newAppointment5 = Appointment(
    startTime: DateTime.now(),
    endTime: DateTime.now().add(Duration(hours: 1)),
    subject: 'CME (Continuing Medical Education) Program',
    color: Colors.lightBlue,
  );
  Appointment newAppointment6 = Appointment(
    startTime: DateTime.now().add(Duration(days: 1, hours: 4)),
    endTime: DateTime.now().add(Duration(days: 1, hours: 5)),
    subject: '4th Clinical Nutrition Update',
    color: Colors.lightBlue,
  );
  Appointment newAppointment7 = Appointment(
    startTime: DateTime.now().add(Duration(days: 2, hours: 3)),
    endTime: DateTime.now().add(Duration(days: 2, hours: 4)),
    subject: 'National CME on Contemporary Developments in Transplants',
    color: Colors.lightBlue,
  );
  Appointment newAppointment8 = Appointment(
    startTime: DateTime.now().add(Duration(days: 3, hours: 6)),
    endTime: DateTime.now().add(Duration(days: 3, hours: 7)),
    subject: 'Oncological Robotic Surgery',
    color: Colors.lightBlue,
  );
  Appointment newAppointment9 = Appointment(
    startTime: DateTime.now().add(Duration(days: -1, hours: 6)),
    endTime: DateTime.now().add(Duration(days: -1, hours: 7)),
    subject: 'World Ostomy Day and Awareness Program',
    color: Colors.lightBlue,
  );
  _stephenAppointments!.add(newAppointment5);
  _stephenAppointments!.add(newAppointment6);
  _stephenAppointments!.add(newAppointment7);
  _stephenAppointments!.add(newAppointment8);
  _stephenAppointments!.add(newAppointment9);
}

 

STEP 3: Place the calendar inside the Expanded widget.

Expanded(
    child: SfCalendar(
  view: CalendarView.week,
  dataSource: _dataSource,
))

 

View the GitHub sample here

Multiple resources

single resource appointment

single resource appointment

 

 

Conclusion

I hope you enjoyed learning about how to handle appointments for multiple resources in the Flutter Calendar.

You can refer to our  Flutter Calender feature tour page to know about its other groundbreaking feature representations. You can also explore our Flutter Calendar documentation to understand how to create and manipulate data.

For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.

If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forumsDirect-Trac, or feedback portal. We are always happy to assist you!

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