Category / Section
How to refresh the Xamarin.Forms Calendar using MVVM pattern?
2 mins read
SfCalendar provides support to refresh the calendar layout by calling the Refresh method.
This article explains you how to refresh calendar from ViewModel.
Step 1: Define the command used to refresh the calendar layout in MVVM pattern.
public class ViewModel : INotifyPropertyChanged
{
private ICommand _refresh;
public ICommand Refresh
{
get
{
return _refresh;
}
set
{
_refresh = value;
RaisePropertyChanged("Refresh");
}
}
public ViewModel()
{
Refresh = new Command(ExecuteRefresh);
}
// Refresh Calendar from ViewModel
private void ExecuteRefresh(object obj)
{
if (obj is SfCalendar)
{
(obj as SfCalendar).Refresh();
}
}
public event PropertyChangedEventHandler PropertyChanged;
private void RaisePropertyChanged(string name)
{
if (PropertyChanged != null)
PropertyChanged(this, new PropertyChangedEventArgs(name));
}
}
Step 2: Pass the SfCalendar instance as CommandParameter property of button to get the calendar instance, using which you can call the Refresh method to update the calendar layouts after the button command has been executed.
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:RefreshCalendar"
xmlns:syncfusion="clr-namespace:Syncfusion.SfCalendar.XForms;assembly=Syncfusion.SfCalendar.XForms"
x:Class="RefreshCalendar.CalendarView">
<ContentPage.BindingContext>
<local:ViewModel/>
</ContentPage.BindingContext>
<ContentPage.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="50" />
</Grid.RowDefinitions>
<syncfusion:SfCalendar x:Name="calendar" Grid.Row="0"/>
<Button Grid.Row="1" Text="Refresh" Command="{Binding Refresh}" CommandParameter="{Binding Source={x:Reference calendar}}" WidthRequest="100" HeightRequest="30" />
</Grid>
</ContentPage.Content>
</ContentPage>
Sample Demo: RefreshCalendar
