Category / Section
How to bind appointments in Xamarin.Forms Schedule using MVVMCross
1 min read
Schedule allows you to bind appointments using MVVMCross Framework. To achieve this follow below steps.
Step 1: Add MVVMCross.Forms.StarterPack package in your project.
Step 2: Add Schedule inside MVVM container using MVVM.Forms assembly.
Step 3: Create a view model inherits from CustomMvxViewModel and add data on this
C#
public class CustomMvxFormsViewModel : MvxViewModel { public ObservableCollection<Meeting> Meetings { get; set; } //public ObservableCollection<Meeting> meetings { get; set; } public MvxFormsViewModel() { Meetings = new ObservableCollection<Meeting>(); for (int i = 0; i < 15; i++) { Meetings.Add(new Meeting() { EventName = "Client Meeting", From = new DateTime(2018, 5, 1, 9, 0, 0).AddDays(i), To = new DateTime(2018, 5, 1, 11, 0, 0).AddDays(i), Color = Color.Green }); } } public override Task Initialize() { //TODO: Add starting logic here return base.Initialize(); } }
Step 4: Use MVVM.Bindings assembly to bind the data to schedule, and refer the view model class as assembly to bind the data from the view model
XAML
<?xml version="1.0" encoding="UTF-8"?> <d:MvxContentPage x:TypeArguments="viewModels:MvxFormsViewModel" xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:MvxForms.Core.Pages" x:Class="MvxForms.Core.Pages.MvxFormsPage" xmlns:viewModels="clr-namespace:MvxForms.Core.ViewModels;assembly=MvxForms.Core" xmlns:d="clr-namespace:MvvmCross.Forms.Views;assembly=MvvmCross.Forms" xmlns:mvx="clr-namespace:MvvmCross.Forms.Bindings;assembly=MvvmCross.Forms" xmlns:syncfusion="clr-namespace:Syncfusion.SfSchedule.XForms;assembly=Syncfusion.SfSchedule.XForms"> <ContentPage.Content> <syncfusion:SfSchedule x:Name="schedule" ScheduleView="MonthView" ShowAppointmentsInline="true" mvx:Bi.nd="DataSource Meetings" > <syncfusion:SfSchedule.AppointmentMapping> <syncfusion:ScheduleAppointmentMapping SubjectMapping="EventName" StartTimeMapping="From" EndTimeMapping="To" ColorMapping="Color"> </syncfusion:ScheduleAppointmentMapping> </syncfusion:SfSchedule.AppointmentMapping> </syncfusion:SfSchedule> </ContentPage.Content> </d:MvxContentPage>
Example: MVVMCross