How to add Essential UI Kit pages in Xamarin.Android project

This section describes how to add Syncfusion Essential UI Kit UI pages in Xamarin.Android project.

Visual Studio extension of Essential UI Kit was developed to add XAML paged in Xamarin.Forms projects. For more details please see here.

You can also add the XAML pages in your Xamarin.Android project by following the below steps.

• Create Xamarin.Android project.
• Add Xamarin.Forms nuget packages to Xamarin.Android project.
• Save the project.
• Right click on the Xamarin.Android project and you can see “Essential UI Kit for Xamarin.Forms” option.

• Select the category and pages you need to add in your application.  For example, we have added Simple Login Page from the Login category.

• Add Forms Initialization in MainActivity.cs file above the SetContentView() line.

   
  Forms.Init(this, savedInstanceState);
   
  

• Add FrameLayout in activity_main.xml

   
  <FrameLayout
  android:id="@+id/frameLayout1"        
  android:layout_width="match_parent"
               android:layout_height="match_parent"/>
   
  

• Add the following line in MainActivity.cs file under the line of SetContentView().

   
  Android.Support.V4.App.Fragment mainpage = new Views.Forms.SimpleLoginPage().CreateSupportFragment(this);
   
  SupportFragmentManager.BeginTransaction().Replace(Resource.Id.frameLayout1, mainpage).Commit();
   
  

• Add Theme in SimpleLoginPage.xaml file Resource.MergedDictionaries

   
  <theme:LightTheme/>
   
  

• Add theme file in Style.xaml file as like below

   
  <ResourceDictionary.MergedDictionaries>
          <theme:LightTheme/>
  </ResourceDictionary.MergedDictionaries>
   
  

• Remove DataContract in BaseViewModel.cs

   
  [DataContract]
   
  

• Use Color code like return Color.FromHex(“#959eac”) instead of Get Application.Resources value like below in BooleanToColorConverter.cs & ErrorValidationColorConverter.cs.

  Application.Current.Resources.TryGetValue("Gray-500", out var focusVal);
  return (Color)focusVal;
  

You can find the complete sample here.

Output