Time zone in .NET MAUI Scheduler (SfScheduler)

19 Apr 20225 minutes to read

The .NET MAUI Scheduler allows to create appointments in various time zones and display them in the respective time zone or any other time zone. Use the time zone in the following four different ways:

  • Create appointments in different time zone.
  • Display appointments based on the client’s time zone.
  • Display appointments based on scheduler time zone.
  • Display appointments at the same time everywhere regardless of client’s time zone.

The following Time Zone’s of the respective countries are added to cover all the time zone regions. Use any of the time zones from the following list for scheduler time zone.

Region UTC Offset
Pacific/Apia UTC - 13:00
Etc/GMT+12 UTC - 12:00
Pacific/Midway UTC - 11:00
Pacific/Honolulu UTC - 10:00
America/Anchorage UTC - 09:00
America/Los_Angeles UTC - 08:00
America/Santa_Isabel UTC - 08:00
America/Denver UTC - 07:00
America/Chihuahua UTC - 07:00
America/Phoenix UTC - 07:00
America/Regina UTC - 06:00
America/Guatemala UTC - 06:00
America/Chicago UTC - 06:00
America/New_York UTC - 05:00
America/Bogota UTC - 05:00
America/Indianapolis UTC - 05:00
America/Caracas UTC - 04:30
America/Halifax UTC - 04:00
America/Cuiaba UTC - 04:00
America/Santiago UTC - 04:00
America/Asuncion UTC - 04:00
America/La_Paz UTC - 04:00
America/St_Johns UTC - 03:30
America/Bahia UTC - 03:00
America/Buenos_Aires UTC - 03:00
America/Sao_Paulo UTC - 03:00
America/Godthab UTC - 03:00
America/Montevideo UTC - 03:00
America/Cayenne UTC - 03:00
America/Noronha UTC - 02:00
Atlantic/Azores UTC - 01:00
Atlantic/Cape_Verde UTC - 01:00
Europe/London UTC
Atlantic/Reykjavik UTC
Africa/Casablanca UTC
America/Danmarkshavn UTC
Europe/Budapest UTC + 01:00
Europe/Warsaw UTC + 01:00
Africa/Windhoek UTC + 01:00
Europe/Paris UTC + 01:00
Africa/Lagos UTC + 01:00
Europe/Berlin UTC + 01:00
Africa/Cairo UTC + 02:00
Europe/Kiev UTC + 02:00
Europe/Bucharest UTC + 02:00
Asia/Jerusalem UTC + 02:00
Africa/Tripoli UTC + 02:00
Asia/Beirut UTC + 02:00
Africa/Johannesburg UTC + 02:00
Asia/Damascus UTC + 02:00
Europe/Istanbul UTC + 02:00
Asia/Riyadh UTC + 03:00
Asia/Baghdad UTC + 03:00
Europe/Minsk UTC + 03:00
Africa/Nairobi UTC + 03:00
Asia/Amman UTC + 03:00
Europe/Kaliningrad UTC + 03:00
Asia/Tehran UTC + 03:30
Etc/GMT-4 UTC + 04:00
Asia/Baku UTC + 04:00
Asia/Yerevan UTC + 04:00
Asia/Tbilisi UTC + 04:00
Indian/Mauritius UTC + 04:00
Europe/Samara UTC + 04:00
Europe/Moscow UTC + 04:00
Asia/Kabul UTC + 04:30
Asia/Karachi UTC + 05:00
Asia/Tashkent UTC + 05:00
Asia/Calcutta UTC + 05:30
Asia/Colombo UTC + 05:30
Asia/Kathmandu UTC + 05:45
Asia/Dhaka UTC + 06:00
Asia/Almaty UTC + 06:00
Asia/Yekaterinburg UTC + 06:00
Asia/Rangoon UTC + 06:30
Asia/Bangkok UTC + 07:00
Asia/Novosibirsk UTC + 07:00
Asia/Shanghai UTC + 08:00
Asia/Krasnoyarsk UTC + 08:00
Asia/Singapore UTC + 08:00
Asia/Taipei UTC + 08:00
Asia/Ulaanbaatar UTC + 08:00
Australia/Perth UTC + 08:00
Asia/Seoul UTC + 09:00
Asia/Irkutsk UTC + 09:00
Asia/Tokyo UTC + 09:00
Australia/Darwin UTC + 09:30
Australia/Adelaide UTC + 09:30
Australia/Sydney UTC + 10:00
Australia/Brisbane UTC + 10:00
Australia/Hobart UTC + 10:00
Pacific/Port Moresby UTC + 10:00
Asia/Yakutsk UTC + 10:00
Pacific/Guadalcanal UTC + 11:00
Asia/Srednekolymsk UTC + 11:00
Asia/Vladivostok UTC + 11:00
Pacific/Fiji UTC + 12:00
Asia/Magadan UTC + 12:00
Pacific/Auckland UTC + 12:00
Asia/Kamchatka UTC + 12:00
Pacific/Tarawa UTC + 12:00
Pacific/Tongatapu UTC + 13:00
Pacific/Kiritimati UTC + 14:00

Create appointments in different time zone

Create appointments at different time zones using the StartTimeZone and EndTimeZone properties of SchedulerAppointment. An appointment’s start time and end time are calculated based on the given time zone information for the start time and end time. Set different time zones to the StartTimeZone and EndTimeZone properties.

Use the StartTime and EndTime properties of SchedulerAppointment to get the exact start time and end time of an appointment. By using the ActualStartTime and ActualEndTime properties, get the exact appointment rendering time.

<scheduler:SfScheduler x:Name="scheduler" />
var appointments = new ObservableCollection<SchedulerAppointment>();
appointments.Add(new SchedulerAppointment()
{
    Subject = "Meeting",
    StartTime = DateTime.Now,
    EndTime = DateTime.Now.AddHours(1),
    StartTimeZone = TimeZoneInfo.FindSystemTimeZoneById("Asia/Kolkata"),
    EndTimeZone = TimeZoneInfo.FindSystemTimeZoneById("Asia/Kolkata")
});	

this.scheduler.AppointmentsSource = appointments;

NOTE

  • If the recurring appointment is converted to another time zone, then the whole sequence will be recalculated according to the new time zone information.
  • If an all-day appointment is created, it’s start time and end time will be set to 12 A.M. by default, so time zone is not applicable for all-day appointments.
  • Scheduler supports daylight saving time.
  • The time zone support is applicable for custom appointments too, so map the corresponding property.
  • Use TimeZone for custom appointments by mapping the StartTimeZone and EndTimeZone custom properties of AppointmentMapping.

Display appointments based on client’s time zone

Display the appointments based on the client’s local time zone in scheduler. For example, consider a scenario that you are in North Carolina and you want to set up a meeting at 10 A.M. on North Carolina time. You have colleagues in London and Chennai, and they also need to participate. The time for this meeting will be 3 P.M. (15:00) in London and 5.30 A.M. in Chennai. When each view your Scheduler, you need to see the appointment displayed relative to your local time zones 5.30 A.M., 10 A.M., and 3 P.M., respectively. It can be achieved by setting schedule time zone to default (it will consider your device’s local time zone as schedule time zone) and appointment’s time zone to North Carolina region [as you are in North Carolina and it’s time zone is Eastern Standard Time].

Display appointments based on scheduler time zone

Set the specific time zone to schedule using the TimeZone property of scheduler. On this scenario, the appointments will be displayed in UTC time when the StartTimeZone and EndTimeZone properties of SchedulerAppointment are set to null. The appointments will be displayed in UTC time based on the given scheduler time zone.

<scheduler:SfScheduler x:Name="scheduler" 
                       TimeZone="{Binding SchedulerTimeZoneInfo}">
</scheduler:SfScheduler>
public class SchedulerViewModel
{
    public SchedulerViewModel()
    {
        this.SchedulerTimeZoneInfo = TimeZoneInfo.FindSystemTimeZoneById("Australia/Brisbane");
    }

    public TimeZoneInfo SchedulerTimeZoneInfo { get; set; }
}
this.scheduler.TimeZone = TimeZoneInfo.FindSystemTimeZoneById("Australia/Brisbane");