The Spread WPF Designer provides useful properties and settings that developers can change to create specific sheets and templates for use in their application. This functionality could be useful to users as well, and the bulk of that functionality is contained within a Ribbon toolbar. This tutorial provides step-by-step instructions for adding an open-source Ribbon toolbar to a WPF application with Spread. The toolbar that is used in this tutorial is an open-source ribbon for WPF applications called “Fluent Ribbon”, and it can be found here: Fluent Ribbon GitHub Alternatively, the Fluent Ribbon can be installed in the project from the NuGet Package Manager in Visual Studio by searching for “Fluent.Ribbon”. Other ribbons can be used, but this is a simple example to show how to connect a ribbon to a Spread control in a WPF application. For a tutorial on adding a ribbon to another Spread project, such as Spread Win, see here: Adding a Ribbon to Spread for Winforms Download the source code for this tutorial: Spread WPF Ribbon

Set Up the Project

Start out by creating a WPF application and add a Spread component to it. Find instructions here: Adding a Spread Component to a WPF Application Next, add the Fluent.Ribbon package to your project. This can be done via the NuGet Package Manager as mentioned above. Once it has been added, you can follow these steps here to add it to a window in your application: Fluent Ribbon Basic Setup Once the ribbon has been added to the application, it should show as an empty ribbon in the design window like the screen shot below: The empty Fluent Ribbon component in the window You can follow the steps in the basic setup tutorial linked above for adding tabs, panels, and buttons into the ribbon. Once the buttons have been added, the application will look something like the screen shot below: The Fluent Ribbon control with buttons and tabs added

Connecting the Buttons to the Spread Control

In order to create the event handlers for the buttons, we can utilize the XAML design interface to add event handlers for the Click property of each button:

<Fluent:RibbonGroupBox Header="Rows">  
    <Fluent:Button x:Name="insertRowButton"  
                   Header="Insert Row"  
                   Icon="Images\\InsertRow.png"  
                   LargeIcon="Images\\InsertRow.png"  
                   Click="insertRowButton_Click" >  
        <Fluent:Button.SizeDefinition>  
            <Fluent:RibbonControlSizeDefinition Large="Middle"  
                                                Middle="Small" />  
        </Fluent:Button.SizeDefinition>  
    </Fluent:Button>  
</Fluent:RibbonGroupBox>  

In the underlying C# code, the event handler that is fired when the Insert Row button is clicked is as follows:

private void insertRowButton_Click(object sender, RoutedEventArgs e)  
{  
    this.gcSpread1.ActiveSheet.AddRows(this.gcSpread1.ActiveSheet.ActiveRow.Index, 1);  
}  

When the user clicks on this button, a row will be inserted at the position of the active row in the spreadsheet. The finished window for the application Once the code for each button has been written, the ribbon will be connected to the Spread control and the user can interact with both Spread and the ribbon.