[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Collapse]WPF Controls
  Prerequisites
 [Expand]What's Installed
 [Expand].NET Core 3 Support
 [Expand]Common Concepts
 [Expand]MVVM Framework
 [Collapse]Controls and Libraries
   Reporting
  [Expand]Data Grid
  [Expand]Ribbon, Bars and Menu
  [Expand]Charts Suite
  [Expand]Pivot Grid
  [Expand]Scheduler
  [Collapse]Spreadsheet
    Product Structure
   [Collapse]Getting Started
     Lesson 1 - Create a Simple Spreadsheet
     Lesson 2 - Create Separate Ribbon Pages for the Spreadsheet
     Lesson 3 - Create an Application using the Instant Layout Assistant (for VS 2015 and earlier)
     Lesson 4 - Customize the Integrated Ribbon UI for the Spreadsheet
     Lesson 5 - Customize the Spreadsheet Status Bar
   [Expand]Spreadsheet Document
    Supported Formats
   [Expand]Cell Basics
   [Expand]Formulas
    Defined Names
    Data Binding
    Data Validation
   [Expand]Data Presentation
   [Expand]Pivot Table Overview
   [Expand]Charts and Graphics
    Printing
    Events
    Protection
    Operation Restrictions
    Find and Replace
   [Expand]Mail Merge
   [Expand]Visual Elements
    Services
    Themes and Templates
   [Expand]Shortcuts
   [Expand]Examples
  [Expand]Rich Text Editor
  [Expand]Tree List
  [Expand]Gauge Controls
  [Expand]Map Control
  [Expand]Layout Management
  [Expand]Windows Modern UI
  [Expand]Printing-Exporting
  [Expand]Data Editors
  [Expand]Navigation Controls
  [Expand]Spell Checker
  [Expand]Property Grid
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Gantt Control
  [Expand]Diagram Control
  [Expand]Windows and Utility Controls
   Dialogs, Notifications and Panels
  [Expand]Scheduler (legacy)
 [Expand]Scaffolding Wizard
 [Expand]Localization
  Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Reporting
[Expand]Report and Dashboard Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Lesson 1 - Create a Simple Spreadsheet

This document provides step-by-step instructions on how to create a WPF Spreadsheet application and change its appearance.

This tutorial includes the following sections:

Expanded Create a New Spreadsheet Application

  1. Create a new WPF Application project and open the MainWindow.xaml file in the Visual Studio Designer.

  2. Drag the SpreadsheetControl item from the DX.19.2: Spreadsheet toolbox tab onto the canvas.

  3. Reset the Spreadsheet control's layout to fill the entire window. Right-click the control and select Layout | Reset All in the context menu.

  4. As a result, your XAML should appear as follows:

    You can also overwrite your MainWindow.xaml file with the code above to add the Spreadsheet control to your application. In this case, add references to the following libraries:

    • DevExpress.Charts.v19.2.Core.dll
    • DevExpress.Data.v19.2.dll
    • DevExpress.Images.v19.2.dll
    • DevExpress.Mvvm.v19.2.dll
    • DevExpress.Office.v19.2.Core.dll
    • DevExpress.Printing.v19.2.Core.dll
    • DevExpress.Spreadsheet.v19.2.Core.dll
    • DevExpress.Xpf.Charts.v19.2.dll
    • DevExpress.Xpf.Core.v19.2.dll
    • DevExpress.Xpf.Docking.v19.2.dll
    • DevExpress.Xpf.NavBar.v19.2.dll
    • DevExpress.Xpf.Printing.v19.2.dll
    • DevExpress.Xpf.Ribbon.v19.2.dll
    • DevExpress.Xpf.Spreadsheet.v19.2.dll
  5. Click the Window's smart tag and select the Convert to ThemedWindow task to convert the Window to a ThemedWindow.

  6. Use the SpreadsheetControl.DocumentSource property to load a document into the Spreadsheet control. You can load documents from a stream, byte array or use a file path or URI to specify the location. If SpreadsheetControl.DocumentSource is null, an empty document is created.

    The example below uses a pack URI as the document source. A workbook is added to the root of the project as a resource file.

  7. Run the project. The image below shows the result.

Expanded Remove the Integrated Ribbon, Formula Bar or Status Bar

The newly created WPF Spreadsheet application includes the following integrated elements:

If you do not need these elements, remove them as described below.

Method 1 (At design time)

Click the SpreadsheetControl's smart tag. In the invoked menu, select Empty from the CommandBarStyle drop-down list and clear the ShowFormulaBar and ShowStatusBar checkboxes.

Method 2 (In XAML)

Change the following properties' values as shown in the table below or delete them from the markup.

Property Value
SpreadsheetControl.CommandBarStyle CommandBarStyle.Empty
SpreadsheetControl.ShowFormulaBar False
SpreadsheetControl.ShowStatusBar False

Expanded Change the Application's Appearance

Change the application's theme

The newly created Spreadsheet control uses the Office2016White theme, so the DevExpress.Xpf.Themes.Office2016White.v19.2.dll library should be deployed to a client machine.

See the list of available DevExpress WPF Themes.

Do one of the following to apply a different theme to your application:

  • Click the ThemedWindow's smart tag, and select a theme from the ApplicationTheme drop-down menu.

  • Set the ApplicationThemeHelper.ApplicationThemeName property to a theme name at the application's startup:

  • Apply a theme to the SpreadsheetControl's container (for example, a window) via the attached ThemeManager.ThemeName property:

Use bitmap or vector icons

When you create a WPF Spreadsheet application with an integrated ribbon, it displays vector icons. This ensures the application is rendered correctly on high-DPI devices.

Set the static ApplicationThemeHelper.UseDefaultSvgImages property to false at the application's startup to use bitmap icons everywhere in your WPF application's GUI:

Use the SpreadsheetControl.UseDefaultSvgImages property to disable SVG icons in the SpreadsheetControl's UI only. This option has priority over the ApplicationThemeHelper.UseDefaultSvgImages property.

The following images illustrate the standard WPF Spreadsheet's ribbon UI with default vector and bitmap icons.

  • SVG Icons

  • Bitmap Icons

Expanded See Also

Is this topic helpful?​​​​​​​