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. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to load the data from SQLite offline database into SfCalendar?

Platform: Xamarin.Forms |
Control: SfCalendar

SfCalendar allows you to bind the data from local database by using SQLite.

Refer the following link to know how to create SQLite connection,




Custom appointment class defined.

    /// <summary>   
    /// Represents custom data properties.   
    /// </summary>  
    public class AppointmentDB
        public string Subject { get; set; }
        public string StartTime { get; set; }
        public string EndTime { get; set; }
        public string AllDay { get; set; }
        public string Color { get; set; }


Since SQLite doesn’t support for DateTime type, we have used it as string type and convert into DateTime while adding items to local collection from DB. SQLite data table is created which is used to populate the data and then store them as CalendarEventCollection.

   public class ViewModel
        SQLiteConnection database;
        public CalendarEventCollection Meetings { get; set; }
        public ViewModel()
            //Create connection
            database = DependencyService.Get<ISQLite>().GetConnection();
            //Create table
            var currentDate = DateTime.Now.Date;
            database.Query<AppointmentDB>("DELETE From AppointmentDB");
            //Insert data in to table 
            database.Query<AppointmentDB>("INSERT INTO AppointmentDB (Subject,StartTime,EndTime,AllDay,Color)values ('Yoga Therapy','" + currentDate.AddHours(1).ToString() + "', '" + currentDate.AddHours(2).ToString() + "','false','#ff0000')");
            database.Query<AppointmentDB>("INSERT INTO AppointmentDB (Subject,StartTime,EndTime,AllDay,Color)values ('Client Meeting','" + currentDate.ToString() + "', '" + currentDate.AddHours(1).ToString() + "','true','#0000ff')");
            database.Query<AppointmentDB>("INSERT INTO AppointmentDB (Subject,StartTime,EndTime,AllDay,Color)values ('Client Meeting','" + currentDate.AddHours(5).ToString() + "', '" + currentDate.AddHours(7).ToString() + "','false','#ffa500')");
        /// <summary>
        /// Creates meetings and stores in a collection.  
        /// </summary>
        private void AddAppointments()
            var table = (from i in database.Table<AppointmentDB>() select i);
            Meetings = new CalendarEventCollection();
            foreach (var order in table)
                var EventName = order.Subject;
                var From = DateTime.Parse(order.StartTime);
                var To = DateTime.Parse(order.EndTime);
                var AllDay = Convert.ToBoolean(order.AllDay);
                Meetings.Add(new CalendarInlineEvent()
                    Subject = order.Subject,
                    StartTime = DateTime.Parse(order.StartTime),
                    EndTime = DateTime.Parse(order.EndTime),
                    Color = Color.FromHex(order.Color),
                    IsAllDay = Convert.ToBoolean(order.AllDay),


Refer the following code to bind the data from SQLite to SfCalendar by using DataSource Property.

    <syncfusion:SfCalendar x:Name="calendar" ShowInlineEvents="true"
        DataSource = "{Binding Meetings}">



To run this sample in UWP, install sqlite.net.pcl, version v1.0.10 (Only this version of SQLite supports UWP platform, later versions don’t support UWP).

View sample in GitHub

2X faster development

The ultimate Xamarin UI toolkit to boost your development speed.
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