No Excel? No Problem with RadSpreadsheet for WPF and Silverlight

Introduction

Most businesses require Excel in order to operate. They use excel for a variety of reasons, but the most common is organizing and manipulating data. Most businesses are also faced with increased license cost or the inability to install Excel on a machine. RadSpreadsheet handles all of these issues as it is a control that allows editing tabular data utilizing a variety of cell formatting options, styles and themes. In today’s post, we will explore RadSpreadsheet from scratch and walk you through step-by-step how to use it in your next line-of-business application.

Before jumping in, you may want to download a trial of RadControls for WPF or Silverlight.

Let’s Get Started!

Select the “RadControls WPF Application” project template found inside of Visual Studio 2012 and give it some sort of meaningful name. On the “Project Configuration Wizard”, select Telerik.Windows.Documents.Spreadsheet and Telerik.Windows.Documents.Spreadsheet.FormatProviders.OpenXml as shown in Figure 1 and it will automatically select the other dependent references. Click “Finish” and our WPF application will load.

Figure 1: Project Configuration Wizard found in the RadControls for WPF or Silverlight template.

Adding RadSpreadsheet

The most basic implementation can be accomplished with adding one line of XAML:

By running the application, we can see that that you can create additional sheets, navigate pages and add/edit cells as shown in Figure 2.

Figure 2: RadSpreadsheet for WPF or Silverlight.

Adding RadRibbonView to Enhance our End-Users Experience

While it was easy to get started, our end-users will demand more functionality such as manipulating cells, using formulas, etc. We can do much better by tying in our RadRibbonView control. Select “Telerik” from the Visual Studio menu and select “Radcontrols for WPF” then “Configure Project”. Make sure there is a reference to Telerik.Windows.Controls.RibbonView and click finish. Let's switch back to MainPage.xaml and replace the XAML with the markup from this downloadable file.

Note: You will also want to make sure you have resolved the proper XML Namespaces.

With the snippet inserted into MainPage.xaml, we can see the RadRibbonView inserted directly above our RadSpreadsheet and our RadSpreadsheetStatusBar directly below it in Figure 3.

Figure 3: RadSpreadsheet Using RadRibbonView to give our app Excel-like features.

With the XAML that we just added, our app now has Excel-like features and functionality without adding any code-behind. You will notice that by default, we have images for many icons without adding them manually to our project. This is because the IconManager embeds the various icons into the RadSpreadsheet’s assembly. Each icon comes with two versions that can be used in the light or dark themes. But please note that the IconManager changes the icons for the light or dark theme only if you tell it to do so with the following line of code:

This line explicitly states, that we would like to use the icon set for the dark theme. This works exceptionally well as shown in the Expression Dark Theme available with the WPF/Silverlight control suites as shown below:

You can see an example of this by taking a look at the “Bold” command shown in Figure 3:

 

Not only do the icons appear, but the button functionality has been added as well. This has been added by a set of Commands built into the control. In this same example, we can also automatically toggle properties such as IsEnabled by binding to our “SetIsBold.IsEnabled”. This command makes the toggle button dim out when you enter edit mode and also changes the button’s toggle state depending on the current selected cell. This sort of functionality is built in for the other buttons as well. There is no need to manually wire up any of this functionality.

If we go ahead and run our application, you will notice that all of the Home, Insert, Page Layout and Formulas tabs work as expected.

Adding Saving and Loading Functionality

If you click on the “Save” or “Load” button, then you will notice that by default it only saves to .txt or .csv. Let’s go ahead and add support to save our workbook in Excel format. Remember in Figure 1, where we added the Telerik.Windows.Documents.Spreadsheet.FormatProviders.OpenXml component? Now we can easily use it by going to MainPage.xaml.cs and adding the following line above our InitializeComponent method.

With this one line added, we can now save and load Excel File. After editing some text in our application, save the file and you will notice that it opens up in Excel with no problems as shown in Figure 4. Notice how it also preserved the formatting style.

Figure 4: RadSpreadsheet Saved to Excel Format.

You can also edit this same document from within Excel and save and open it back inside your application. Very easily to implement with just one line of code!

Customizing RadRibbonView to Add Features

If you click on the SmartTag as shown in Figure 5, you can change various properties as well as add an additional Tab.

Figure 5: RadRibbonView Smart Tag.

By clicking the “Add” button, we have the ability to create a new RibbonTab and I have added two buttons called, “Load Data” and “Save Data” as shown in Figure 6.

Figure 6: RadRibbonTab Buttons being added.

The XAML generated looks like the following:

 

We can add the following code to our MainPage.xaml.cs to automatically load an excel worksheet into the current control.

Once we press the “Load Data” button, the data will appear as shown in Figure 7.

Figure 7: RadSpreadsheet being loaded on demand.

Conclusion

We took an in-depth look today at RadSpreadsheet for WPF and Silverlight. Starting from scratch, we were able to see that this control is extremely flexible by coupling it with RadRibbonView. We were able to get excel-like functionality with only adding XAML and support for XLSX by adding one line of code. We further extended our app by loading data remotely. This control is still in Beta, and it is already powerful enough to include in your next line-of-business application. If you have any questions, then feel free to drop me a line in the comments below.

Don’t forget you may want to download a trial of RadControls for WPF or Silverlight now.

-Michael Crump (@mbcrump)