Events in .NET MAUI Scheduler (SfScheduler)

The Scheduler supports the Tapped, DoubleTapped, LongPressed, SelectionChanged, and ViewChanged events to interact with .NET MAUI Scheduler.

Tapped

A Tapped event occurs, each time a scheduler view is tapped.
Below is a list of the arguments:

• Sender: This contains the SfScheduler object.

• Tapped: The tapped action performed on an Scheduler element can be found in the SchedulerTappedEventArgs, you can see details about the tapped dates, appointments, and elements.

  • Appointments: Returns the selected appointments.
  • Date : Returns the selected date.
  • Element : Returns the Scheduler element tapped.
  • WeekNumber : Returns the tapped week number value.

MainPage.xaml

<scheduler:SfScheduler x:Name="Scheduler" 
                       Tapped="OnSchedulerTapped" >
</scheduler:SfScheduler>

MainPage.xaml.cs

this.Scheduler.Tapped += this.OnSchedulerTapped;

private void OnSchedulerTapped(object sender, SchedulerTappedEventArgs e)
{
    var appointments = e.Appointments;
    var selectedDate = e.Date;
    var schedulerElement = e.Element;
    var weekNumber = e.WeekNumber;
}

NOTE

• View scheduler appointment sample in GitHub
• View business object sample in GitHub

DoubleTapped

Whenever the SfScheduler elements are double-tapped onto the view, the DoubleTapped event occurs. Below is a list of the arguments:

• Sender: This contains the SfScheduler object.

• DoubleTapped: This double tapped action performed on a Scheduler element can be found in the SchedulerDoubleTappedEventArgs, and you can see the details about the double-tapped dates, appointments, and elements.

  • Appointments: Returns the double-tapped appointments.
  • Date : Returns the double-tapped date.
  • Element : Returns the double-tapped Scheduler element.
  • WeekNumber : Returns the double-tapped week number value.

MainPage.xaml

<scheduler:SfScheduler x:Name="Scheduler" 
                       DoubleTapped="OnSchedulerDoubleTapped" >
</scheduler:SfScheduler>

MainPage.xaml.cs

this.Scheduler.DoubleTapped += this.OnSchedulerDoubleTapped;

private void OnSchedulerDoubleTapped(object sender, SchedulerDoubleTappedEventArgs e)
{
    var appointments = e.Appointments;
    var selectedDate = e.Date;
    var schedulerElement = e.Element;
    var weekNumber = e.WeekNumber;
}

NOTE

• View scheduler appointment sample in GitHub
• View business object sample in GitHub

LongPressed

Whenever the SfScheduler elements are long-pressed onto the view, the LongPressed event occurs. Below is a list of the arguments:

• Sender: This contains the SfScheduler object.

• LongPressed: This long-pressed action performed on a Scheduler element can be found in the SchedulerLongPressedEventArgs, and you can see details about the long-pressed dates, appointments, and elements.

  • Appointments: Returns the long-pressed appointments.
  • Date : Returns the long-pressed date.
  • Element : Returns the long-pressed Scheduler element.
  • WeekNumber : Returns the long-pressed week number value.

MainPage.xaml

<scheduler:SfScheduler x:Name="Scheduler" 
                       LongPressed="OnSchedulerLongPressed" >
</scheduler:SfScheduler>

MainPage.xaml.cs

this.Scheduler.LongPressed += this.OnSchedulerLongPressed;

private void OnSchedulerLongPressed(object sender, SchedulerLongPressedEventArgs e)
{
    var appointments = e.Appointments;
    var selectedDate = e.Date;
    var schedulerElement = e.Element;
    var weekNumber = e.WeekNumber;
}

NOTE

• View scheduler appointment sample in GitHub
• View business object sample in GitHub

SelectionChanged

The SelectionChanged event is used to notify when the cell selection is changed onto the view in the SfScheduler.

• Sender: This contains the SfScheduler object.

• SelectionChanged: The selection is changed when the selection-changed action is performed on the element available in the SchedulerSelectionChangedEventArgs.

  • NewValue`: Returns the new selected date.
  • OldValue : Returns the old selected date.

MainPage.xaml

<scheduler:SfScheduler x:Name="Scheduler" 
                       SelectionChanged="OnSchedulerSelectionChanged" >
</scheduler:SfScheduler>

MainPage.xaml.cs

this.Scheduler.SelectionChanged += this.OnSchedulerSelectionChanged;

private void OnSchedulerSelectionChanged(object sender, SchedulerSelectionChangedEventArgs e)
{
    var oldDateTime = e.OldValue;
    var newdateTime = e.NewValue;
}

NOTE

The Tapped event is triggered first, followed by ‘selection-changed’ event will be performed.

ViewChanged

The ViewChanged event is used to notify when the current view of scheduler is changed, that is when the view is swiped to previous or next view, and when the scheduler view is switched to another scheduler view.

• Sender: This contains the SfScheduler object.

• ViewChanged: The scheduler current view visible dates are available in the SchedulerViewChangedEventArgs when the scheduler visible dates or view is changed.

  • NewVisibleDates: Returns the new visible date range of the view.
  • OldVisibleDates : Returns the old visible date range of the view.
  • NewView: Returns the new scheduler view.
  • OldView : Returns the old scheduler view.

MainPage.xaml

<scheduler:SfScheduler x:Name="Scheduler" 
                       ViewChanged="OnSchedulerViewChanged" >
</scheduler:SfScheduler>

MainPage.xaml.cs

this.Scheduler.ViewChanged += this.OnSchedulerViewChanged;

private void OnSchedulerViewChanged(object sender, SchedulerViewChangedEventArgs e)
{
    var oldVisibleDates = e.OldVisibleDates;
    var newVisibleDates = e.NewVisibleDates;
    var oldSchedulerView = e.OldView;
    var newSchedulerView = e.NewView;
}

NOTE

Whenever a scheduler view is changed, the SelectableDayPredicate function must be called to decide whether the cell is selectable or not in the SfScheduler.

Commands

Scheduler commands allow to map Tapped event, Double tapped event, Long Pressed event and View Changed event to Commands which supports the MVVM (Model-View-ViewModel) pattern.

TappedCommand

The TappedCommand will be triggered when you tap the scheduler view and pass the SchedulerTappedEventArgs as parameter.

MainPage.xaml

<scheduler:SfScheduler x:Name="Scheduler"
                       View="Month"
                       AllowedViews="Day,Month,TimelineDay,TimelineMonth,TimelineWeek,TimelineWorkWeek,Agenda"
                       TappedCommand="{Binding SchedulerTappedCommand}">
                       <scheduler:SfScheduler.BindingContext>
                            <local:SchedulerInteractionViewModel />
                       </scheduler:SfScheduler.BindingContext>
</scheduler:SfScheduler>

MainPage.xaml.cs

public class SchedulerInteractionViewModel
{
    public ICommand SchedulerTappedCommand { get; set; }

    public SchedulerInteractionViewModel()
    {
        this.SchedulerTappedCommand = new Command<SchedulerTappedEventArgs>(ExecuteTapped);
    }

    private void ExecuteTapped(SchedulerTappedEventArgs obj)
    {
        var selectedDate = obj.Date;
    }

}

DoubleTappedCommand

The DoubleTappedCommand will be triggered when you double-tap the scheduler view and pass the SchedulerDoubleTappedEventArgs as parameter.

MainPage.xaml

<scheduler:SfScheduler x:Name="Scheduler"
                       View="Month"
                       AllowedViews="Day,Month,TimelineDay,TimelineMonth,TimelineWeek,TimelineWorkWeek,Agenda"
                       DoubleTappedCommand="{Binding SchedulerDoubleTappedCommand}">
                       
                       <scheduler:SfScheduler.BindingContext>
                            <local:SchedulerInteractionViewModel />
                       </scheduler:SfScheduler.BindingContext>
</scheduler:SfScheduler>

MainPage.xaml.cs

public class SchedulerInteractionViewModel
{
    public ICommand SchedulerDoubleTappedCommand { get; set; }

    public SchedulerInteractionViewModel()
    {
        this.SchedulerDoubleTappedCommand = new Command<SchedulerDoubleTappedEventArgs>(ExecuteDoubleTapped);
    }

    private void ExecuteDoubleTapped(SchedulerDoubleTappedEventArgs obj)
    {
        var selectedDate = obj.Date;
    }

}

LongPressedCommand

The LongPressedCommand will be triggered when you long-press the scheduler view and pass the SchedulerLongPressedEventArgs as parameter.

MainPage.xaml

<scheduler:SfScheduler x:Name="Scheduler"
                       View="Month"
                       AllowedViews="Day,Month,TimelineDay,TimelineMonth,TimelineWeek,TimelineWorkWeek,Agenda"
                       LongPressedCommand="{Binding SchedulerLongPressedCommand}">

                       <scheduler:SfScheduler.BindingContext>
                            <local:SchedulerInteractionViewModel />
                       </scheduler:SfScheduler.BindingContext>
</scheduler:SfScheduler>

MainPage.xaml.cs

public class SchedulerInteractionViewModel
{
    public ICommand SchedulerLongPressedCommand { get; set; }   

    public SchedulerInteractionViewModel()
    {
        this.SchedulerLongPressedCommand = new Command<SchedulerLongPressedEventArgs>(ExecuteLongPressed);
    }

    private void ExecuteLongPressed(SchedulerLongPressedEventArgs obj)
    {
        var selectedDate = obj.Date;
    }
}

ViewChangedCommand

The ViewChangedCommand will be triggered when you long-press the scheduler view and pass the SchedulerViewChangedEventArgs as parameter.

MainPage.xaml

<scheduler:SfScheduler x:Name="Scheduler"
                       View="Month"
                       AllowedViews="Day,Month,TimelineDay,TimelineMonth,TimelineWeek,TimelineWorkWeek,Agenda"
                       ViewChangedCommand="{Binding SchedulerViewChangedCommand}">

                       <scheduler:SfScheduler.BindingContext>
                            <local:SchedulerInteractionViewModel />
                       </scheduler:SfScheduler.BindingContext>
</scheduler:SfScheduler>

MainPage.xaml.cs

public class SchedulerInteractionViewModel
{
    public ICommand SchedulerViewChangedCommand { get; set; }

    public SchedulerInteractionViewModel()
    {
        this.SchedulerViewChangedCommand = new Command<SchedulerViewChangedEventArgs>(ExecuteViewChanged);
    }

    private void ExecuteViewChanged(SchedulerViewChangedEventArgs obj)
    {
        var oldVisibleDates = obj.OldVisibleDates;
        var newVisibleDates = obj.NewVisibleDates;
        var oldSchedulerView = obj.OldView;
        var newSchedulerView = obj.NewView;
    }
}

• SelectionChangedCommand

The SelectionChangedCommand will be triggered when the scheduler view changes and pass the SchedulerSelectionChangedEventArgs as parameter.

MainPage.xaml

<scheduler:SfScheduler x:Name="Scheduler"
                       View="Month"
                       AllowedViews="Day,Month,TimelineDay,TimelineMonth,TimelineWeek,TimelineWorkWeek,Agenda"
                       SelectionChangedCommand="{Binding SchedulerSelectionChangedCommand}">
                       <scheduler:SfScheduler.BindingContext>
                            <local:SchedulerInteractionViewModel />
                       </scheduler:SfScheduler.BindingContext>
</scheduler:SfScheduler>

MainPage.xaml.cs

public class SchedulerInteractionViewModel
{
    public ICommand SchedulerSelectionChangedCommand { get; set; }

    public SchedulerInteractionViewModel()
    {
        this.SchedulerSelectionChangedCommand = new Command<SchedulerSelectionChangedEventArgs>(ExecuteSelectionChanged);
    }

    private void ExecuteSelectionChanged(SchedulerSelectionChangedEventArgs obj)
    {
        var newDateTime = obj.NewValue;
        var oldDateTime = obj.OldValue;
    }
}