Category / Section
How to show appointment drag time indicator in WPF Scheduler (Calendar)
4 mins read
Show the time indicator only on a specific time while dragging and dropping the appointment in the WPF Schedule by using the DragDropSetting and the ShowTimeIndicator property in an AppointmentDragOver event.
C#
In the AppointmentDragOver event, the ShowTimeIndicator property is updated based on the dragging time.
private void OnScheduleAppointmentDragOver(object sender, AppointmentDragOverEventArgs e)
{
if (e.DraggingTime.Minute == 30 || e.DraggingTime.Minute == 00)
{
schedule.DragDropSettings.ShowTimeIndicator = true;
}
else
schedule.DragDropSettings.ShowTimeIndicator = false;
}
C#
Create a collection of Events for the Scheduler.
public SchedulerViewModel()
{
this.Events = new ScheduleAppointmentCollection();
var scheduleAppointment = new ScheduleAppointment()
{
StartTime = DateTime.Now,
EndTime = DateTime.Now.AddHours(1),
AppointmentBackground = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FF339933")),
Subject = "Conference",
};
Events.Add(scheduleAppointment);
}
XAML
Bind the appointments from the view model to a schedule by using the ItemsSource property and set AllowDrop as true.
<Window.DataContext>
<local:SchedulerViewModel/>
</Window.DataContext>
<Grid x:Name="grid">
<syncfusion:SfScheduler x:Name="schedule"
ViewType="WorkWeek" AllowDrop="True"
ItemsSource="{Binding Events}"
>
</syncfusion:SfScheduler>
<interactivity:Interaction.Behaviors>
<local:ScheduleBehavior/>
</interactivity:Interaction.Behaviors>
</Grid>
