Date Navigations in Xamarin Scheduler (SfSchedule)

8 Aug 20236 minutes to read

Enabling Navigation

By default, Schedule views can be moved backwards and forwards using touch swipe gesture. This navigation gesture can be enabled or disabled by setting EnableNavigation property of SfSchedule. By default, it is enabled.

<schedule:SfSchedule EnableNavigation="False"/>
//disabling navigation gesture
schedule.EnableNavigation = false;

NOTE
Move to time:

  • The scrolled position of timeslots will be maintained in day/week/work week view when swiping the next or previous views and switching between day, week or work week views,
  • If view switch from month/timeline view to week/work/day week views, move to time will be considered if move time mentioned in MoveToDate otherwise, position scrolled to work start hour in day/week/work week views.

Programmatically change to specific dates

Visible dates can be moved to specific date using NavigateTo method and MoveToDate property available in SfSchedule. It will move to any specific date if the schedule view is Day View, similarly it will move to the specific week if it is week view and to specific month if it is month view

//using NavigateTo

DateTime currentDate = DateTime.Now;
DateTime SpecificDate = new DateTime(currentDate.Year - 5,currentDate.Month - 3, currentDate.Day, 0, 0, 0);
Schedule.NavigateTo(SpecificDate);

//using MoveToDate
DateTime currentDate = DateTime.Now;
DateTime SpecificDate = new DateTime(currentDate.Year - 5,currentDate.Month - 3, currentDate.Day, 0, 0, 0);
Schedule.MoveToDate = SpecificDate;

NOTE
The specified date should lies between MinDisplayDate and MaxDisplayDate, if the specified date is greater than MaxDisplayDate then the view moved to MaxDisplayDate similarly if the specified date is lesser than the MinDisplayDate then the view moved to MinDisplayDate.

Programmatically change to adjacent dates.

By default the date can be navigated to next and previous view using touch gesture, by swiping the control in right to left and right to left direction. The view can be also changed programmatically using Forward and Backward method available in SfSchedule.

  • Forward
  • Backward

Forward

You can use the Forward method for viewing the next immediate visible dates in the SfSchedule. It will move to next month if the schedule view is month, similarly it will move to next week for week view and next day for day view.

//Viewing next immediate visible dates
schedule.Forward();

NOTE
Date can be navigated until it reaches the Min Max date.**

Backward

You can use the Backward method for viewing the previous immediate visible dates in the SfSchedule. It will move to previous month if the schedule view is month, similarly it will move to previous week for week view and previous day for day view.

//Viewing previous immediate visible dates
schedule.Backward();

NOTE
Date can be navigated until it reaches the Min Max date.**

Range for visible dates

Visible dates can be restricted between certain range of dates, using MinDisplayDate and MaxDisplayDate property in SfSchedule. It is applicable in all the schedule views.

Minimum Display Date

MinDisplayDate will restrict date navigations features of Backward, MoveToDate and also can’t swipe the control using touch gesture beyond the min max date range. Thus, Inline and selection feature in month view will works only within the min max date range.

int monthRange = 2; DateTime currentDate = DateTime.Now;
//setting minimum display date
DateTime minDate = new DateTime(currentDate.Year, currentDate.Month - monthRange, currentDate.Day, 10, 0, 0);
schedule.MinDisplayDate = minDate;

Maximum Display Date

MaxDisplayDate will restrict date navigations features of Forward, MoveToDate and also can’t swipe the control using touch gesture beyond the max date range. Thus, Inline and selection in month view will works only within the max date range.

int monthRange = 2; DateTime currentDate = DateTime.Now;
//setting maximum display date
DateTime maxDate = new DateTime(currentDate.Year, currentDate.Month + monthRange, currentDate.Day, 10, 0, 0);
schedule.MaxDisplayDate = maxDate;

VisibleDatesChanged event

You can get the visible dates of the Schedule using VisibleDatesChangedEvent in SfSchedule. It is applicable in all the schedule views.The event handler receives an argument of type VisibleDatesChangedEventArgs containing visibleDates and Schedule.

schedule.VisibleDatesChangedEvent += Schedule_VisibleDatesChangedEvent;

..... 

private void Schedule_VisibleDatesChangedEvent(object sender, VisibleDatesChangedEventArgs e)
{
	var visibleDates = e.visibleDates;
	var Schedule = e.Schedule;
}

VisibleDatesChangedEvent will be triggered when view is swiped back or forth and also when schedule view is switched dynamically.

You can add appointments on demand based on the visible date range in this event by setting DataSource property to schedule in the VisibleDatesChangedEvent.

private void Schedule_VisibleDatesChangedEvent(object sender, VisibleDatesChangedEventArgs e)
{
	schedule.DataSource = scheduleAppointmentCollection;
}

You can also move to specific time of the day or current time of day when view is swiped by setting specific time in MoveToDate property in the VisibleDatesChanged event. Such that when the schedule view is swiped, it moves to the mentioned time.

schedule.VisibleDatesChangedEvent += Schedule_VisibleDatesChangedEvent;

...

private void Schedule_VisibleDatesChangedEvent(object sender, VisibleDatesChangedEventArgs e)
{
	var date = DateTime.Now;
	var formatDate = e.visibleDates[0];
	schedule.MoveToDate = new DateTime(formatDate.Year, formatDate.Month, formatDate.Day, date.Hour, date.Minute, date.Second);
}

NOTE

You can refer to our Xamarin Scheduler feature tour page for its groundbreaking feature representations. You can also explore our Xamarin Scheduler example to understand how to schedule and manage appointments.