Search This Blog

Loading...

Sunday, 31 March 2013

How to Integrate Telerik RadPivotGrid in LightSwitch 2012

Hi Everybody...

Data analysis is a crucial part in a business application. To represent huge amount of data we need a high performance analysis tool. Telerik Silverlight RadPivotGrid is one of them. Its really a powerful and high performance pivot grid control in the market.



Today I am going to show you how to integrate Telerik RadPivotGrid control in LightSwitch 2012.

Requirement

1. Visual Studio 2012 Professional or Higher
2. Latest Telerik Silverlight Control

Step-1
First I have created a LightSwitch C# project called "RadPivotGrid". And an entity called "Product". After that created two screens based on Product entity. One is Search Screen and the other one is Editable Grid Screen.


Step-2
By the help of Editable Grid Screen I inserted some demo data into the application.


Step-3
Created a Silverlight User Control ("RadProductPivotGrid") and add the following assemblies in the Client Project which is required to integrate the PivotGrid control in lightswitch.

Telerik.Pivot.Core
Telerik.Windows.Controls
Telerik.Windows.Controls.Pivot
Telerik.Windows.Controls.PivotFieldList

In the Xaml page (RadProductPivotGrid.xaml) write the below code.


<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:pivot="http://schemas.telerik.com/2008/xaml/presentation/pivot" x:Class="LightSwitchApplication.CustomControls.RadProductPivotGrid"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <UserControl.Resources>
        <pivot:LocalDataSourceProvider x:Key="LocalDataProvider" AggregatesPosition="Rows">
            <pivot:LocalDataSourceProvider.RowGroupDescriptions>
                <pivot:PropertyGroupDescription PropertyName="Name"/>
            </pivot:LocalDataSourceProvider.RowGroupDescriptions>
            <pivot:LocalDataSourceProvider.ColumnGroupDescriptions>
                <pivot:DateTimeGroupDescription PropertyName="PurchaseDate" Step="Month" />
            </pivot:LocalDataSourceProvider.ColumnGroupDescriptions>
            <pivot:LocalDataSourceProvider.AggregateDescriptions>
                <pivot:PropertyAggregateDescription PropertyName="Price" StringFormat="C" AggregateFunction="Average" />
                <pivot:PropertyAggregateDescription PropertyName="Quantity"/>
            </pivot:LocalDataSourceProvider.AggregateDescriptions>
        </pivot:LocalDataSourceProvider>
    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="White">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>
        <pivot:RadPivotGrid x:Name="xRadPivotGridView" Grid.Column="0"/>
        <pivot:RadPivotFieldList Name="xradPivotFieldList" Grid.Column="1"/>
    </Grid>
</UserControl>

and in RadProductPivotGrid.xaml.cs page write the below code


public partial class RadProductPivotGrid : UserControl
    {
        DataWorkspace workspace = new DataWorkspace();
        public RadProductPivotGrid()
        {
            InitializeComponent();
            LocalDataSourceProvider dataProvider = (this.Resources["LocalDataProvider"] as LocalDataSourceProvider);
            workspace.Details.Dispatcher.BeginInvoke(()=>
            {
                dataProvider.ItemsSource = workspace.ApplicationData.Products;
            });
            this.xRadPivotGridView.DataProvider = dataProvider;
            this.xradPivotFieldList.DataProvider = dataProvider;
        }
    }

Step-4
Rebuild your project and Integrate your Silverlight Custom Control into LightSwitch Search Screen. Play the solution and see the Powerful RadPivotGrid control in action.



Conclusion
This is just a sample PivotGrid integration. Visit Telerik Official Silverlight Demo page to customize your pivot grid as per your requirement. Also I would like to thank to Paul Van Bladel for redirect me in right direction.

Hope you enjoy this.

Feel free to reply here if you got any doubt.

As Jan (LightSwitch Hacker) said Keep Rocking LightSwitch

No comments:

Post a Comment

< >