VS Dev Essentials Program Includes Syncfusion’s Xamarin & UWP

The Xamarin and UWP component suites from Syncfusion include all the common user interface controls needed for building line-of-business applications such as grids, charts, gauges, maps, calendars, treemaps, schedulers, and editors. The suites also include full-fledged libraries for reading and writing Microsoft Excel, Microsoft Word, Adobe PDF, and Microsoft PowerPoint files. The Xamarin suite provides components for all flavors of Xamarin, including Xamarin.iOS, Xamarin.Android, and Xamarin.Forms platforms. The Xamarin and UWP suite of components can be used together to build powerful line-of-business applications that target all the major platforms, including Windows 10, iOS, and Android.

All the available components are feature-rich and easy to use. There is also extensive documentation available to help integrate the components into your application within a few minutes. To demonstrate this, let us walk through the process of including charts and Excel reporting in an existing Xamarin application.

Adding charting capabilities

Step 1 : Install the required Chart NuGet packages as demonstrated here .

Step 2: Define a data model that represents a data point in SfChart.

public class Model   
{
       
public string Name { get; set; }
 
       
public double Height { get; set; }

}

Step 3: Populate the view model with data using the previous model as shown next.

public class ViewModel   
{
       
public List<Model> Data { get; set; }
 
       
public ViewModel()       
{
            Data = new List<Model>()
            {
                new Model { Name = "David", Height = 180 },
                new Model { Name = "Michael", Height = 170 },
                new Model { Name = "Steve", Height = 160 },
                new Model { Name = "Joel", Height = 182 }
            };
       
}
}

Step 4: Now add the namespace of SfChart and ViewModel to your XAML page, and then set the BindingContext with the instance of ViewModel.

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage >="http://xamarin.com/schemas/2014/forms"
             >="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="ChartDemo.MainPage"
             >="clr-namespace:Syncfusion.SfChart.XForms;assembly=Syncfusion.SfChart.XForms"
             >="clr-namespace: ChartDemo">
 
   
<ContentPage.BindingContext>
       
<local:ViewModel></local:ViewModel>
   
</ContentPage.BindingContext>
 
</ContentPage>

Step 5: Initialize the SfChart and then add ColumnSeries, as we are going to visualize the comparison of heights here. Next, bind the Data property of the above ViewModel to the ColumnSeries.ItemsSource property.

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage >="http://xamarin.com/schemas/2014/forms"
             >="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="ChartDemo.MainPage"
             >="clr-namespace:Syncfusion.SfChart.XForms;assembly=Syncfusion.SfChart.XForms"
             >="clr-namespace: ChartDemo">
 
   
<ContentPage.BindingContext>
       
<local:ViewModel></local:ViewModel>
   
</ContentPage.BindingContext>
  
 
<chart:SfChart>
   
<chart:SfChart.PrimaryAxis>
     
<chart:CategoryAxis></chart:CategoryAxis>
   
</chart:SfChart.PrimaryAxis>
  
   
<chart:SfChart.SecondaryAxis>
       
<chart:NumericalAxis>
            <chart:NumericalAxis.Title>
               <chart:ChartAxisTitle Text="Height (in cm)"></chart:ChartAxisTitle>
            </chart:NumericalAxis.Title>      
       
</chart:NumericalAxis>   
  
</chart:SfChart.SecondaryAxis>
  
   
<chart:SfChart.Series>
       
<chart:ColumnSeries ItemsSource="{Binding Data}" XBindingPath="Name"      
YBindingPath="Height"></chart:ColumnSeries>
   
</chart:SfChart.Series>
 
</chart:SfChart>
 
</ContentPage>

SfChart chart = new SfChart
            {
                PrimaryAxis = new CategoryAxis(),
                SecondaryAxis = new NumericalAxis()
            };
 
            chart.SecondaryAxis.Title = new ChartAxisTitle
            {
                Text = "Height (in cm)"
            };
 
            ColumnSeries columneSeries = new ColumnSeries();
 
            columneSeries.ItemsSource = new List<Model>()
            {
                new Model { Name = "David", Height = 180 },
                new Model { Name = "Michael", Height = 170 },
                new Model { Name = "Steve", Height = 160 },
                new Model { Name = "Joel", Height = 182 }
            };
 
            columneSeries.XBindingPath = "Name";
          
 columneSeries.YBindingPath = "Height";
 
           
chart.Series.Add(columneSeries);

Adding Excel reporting capabilities

Step 1 : Install the required XlsIO NuGet packages as demonstrated here .

Step 2: Read and write Excel files as shown in the following sample.

//Create an instance of ExcelEngine.
using (ExcelEngine excelEngine = new ExcelEngine())
{
         //Set the default application version as Excel 2013.            
         excelEngine.Excel.DefaultVersion = ExcelVersion.Excel2013;
         //Open an existing workbook.
         IWorkbook workbook = excelEngine.Excel.Workbooks.Open(inputExcelStream);
         //Access first worksheet from the workbook instance.
         IWorksheet worksheet = workbook.Worksheets[0];
         //Set the text value to the cell
         worksheet["N1"].Text = "Total";
         worksheet["A6"].Text = "Average";
 
         //Set the formulas to the cell or range of cells
         worksheet["N2:N5"].FormulaR1C1 = "SUM(RC[-12]:RC[-1])";
         worksheet["B6:M6"].FormulaR1C1 = "AVERAGE(R[-4]C:R[-1]C)";
         worksheet["N6"].Formula = "SUM(B2:M5)";
 
         //Set the column width in points.
         worksheet["A1:N1"].ColumnWidth = 10;
 
         //Save the workbook to stream in xlsx format.
         workbook.SaveAs(outputExcelStream);
}