We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to refresh the Xamarin.Forms Calendar using MVVM pattern?

Platform: Xamarin.Forms |
Control: SfCalendar |
Published Date: November 14, 2018 |
Last Revised Date: April 10, 2019

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

2X faster development

The ultimate Xamarin UI toolkit to boost your development speed.
ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Up arrow icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon