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: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Xamarin Holiday Challenge Guidelines for Mac

System requirements

  • Xamarin.Forms 4.0.0.425677 or greater is required to complete this challenge.

Follow these steps to add the required pages:

  1. Download the Essential UI Kit for Xamarin.Forms from here, and follow these instructions to install the downloaded extension in your Visual Studio for Mac.
  1. Create a new Xamarin.Forms project in Visual Studio for Mac:
    1. Set the App Name to XamarinHolidayChallenge.
    2. Leave the remaining fields as it is and click Next.
    3. Leave all the fields as it is and click Create.
  1. Right-click on the .NET Standard project and select Essential UI Kit for Xamarin.Forms.
  1. Select the following screens from the Essential UI Kit dialog and click Add.
    1. Forms -> Simple Login Page.
    2. Onboarding -> Walkthrough Page.

    Note: This extension adds all the files and NuGet packages required for the selected screens to the .NET Standard and platform projects.

  1. As documented here, install the NuGet package of SfScheduler in .NET Standard, Android, and iOS projects and call the init method of renderers.
  1. Create a new class called Meeting in the Model folder in your .NET Standard project. Then copy and paste the model code from this link.
  1. Create a new class called SchedulerPageViewModel in the ViewModel folder in your .NET Standard project. Copy and paste the view model code from this link.
  1. Add the following namespace in the SchedulerPageViewModel.cs file.
  2. using System.Collections.Generic; using XamarinHolidayChallenge.Models;
  1. Add a new content page in your .NET Standard project with the name Scheduler:
    1. Right-click the .NET Standard project.
    2. Click Add and choose New File.
    3. Choose Forms ContentPage XAML in the Forms category.
    4. Set the name to “Scheduler”.
    5. Click New.
  1. Add the following namespaces in the Scheduler.xaml file.
  2. xmlns:syncfusion="clr-namespace:Syncfusion.SfSchedule.XForms;assembly=Syncfusion.SfSchedule.XForms"

    This namespace helps to access the APIs of Syncfusion’s Scheduler.

    xmlns:local="clr-namespace:XamarinHolidayChallenge.ViewModels"

    This namespace helps to access the ViewModel added in step 7.

  1. Add the following code in the Scheduler.xaml file. The SchedulerPageViewModel mentioned in this code is a class created in step 7.
  2. <ContentPage.BindingContext>
       <local:SchedulerPageViewModel/>
    </ContentPage.BindingContext>

    <ContentPage.Content>
      <syncfusion:SfSchedule ScheduleView="WorkWeekView" DataSource="{Binding Meetings}" AllowAppointmentDrag="True">
       <syncfusion:SfSchedule.AppointmentMapping>
       <syncfusion:ScheduleAppointmentMapping EndTimeMapping="EndTime" StartTimeMapping="StartTime" ColorMapping="Color" SubjectMapping="Subject"/>
       </syncfusion:SfSchedule.AppointmentMapping>
      </syncfusion:SfSchedule>
    </ContentPage.Content>

    Set the binding context and configure the Scheduler control.

  1. Hide the navigation bar using the NavigationPage.HasNavigationBar property of ContentPage, as follows.

Follow these steps to add navigation across the pages.

  • Set the OnBoardingAnimationPage to MainPage of the application as follows in the App.xaml.cs file in the .NET Standard project.
  • public App()
    {
         InitializeComponent();
         MainPage = new NavigationPage(new Views.Onboarding.OnBoardingAnimationPage());
    }
  • Navigate to the SimpleLoginPage after the walk-through process is completed. Add the following code inside the MoveToNextPage method in OnBoardingAnimationViewModel.cs.
  • private void MoveToNextPage()
    {
         Application.Current.MainPage.Navigation.PopAsync();
         Application.Current.MainPage.Navigation.PushAsync(new Views.Forms.SimpleLoginPage());
    }
  • Navigate to the Scheduler view from the login page. Add the following code inside the LoginClicked method of LoginPageViewModel.cs.
  • private void LoginClicked(object obj)
    {
         Application.Current.MainPage.Navigation.PushAsync(new Scheduler());
    }

Build and run it on Android and iOS.

Build and run the app on Android and iOS devices or emulators to see what you've built with the Essential UI Kit and Syncfusion’s Scheduler control.

Troubleshooting

If you are getting any type of “not found” error while building the project, then open the .NET Standard project file in edit mode and search for ItemGroup with the remove command. If you find it, then delete that item group from the project file and rebuild the project again. Reference https://github.com/mhutch/MonoDevelop.AddinMaker/issues/78.

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