# Create a WPF Ribbon Application

> Turn MainWindow into a RibbonWindow, add RibbonFormattingTab, RibbonInsertTab and other TX Text Control tabs in XAML, and show a Table Tools contextual tab.

- **Product:** TX Text Control .NET for WPF
- **Section:** Documentation
- **Kind:** Topic
- **Path:** TX Text Control .NET for WPF > Getting Started > Document Editor > Create a WPF Ribbon Application
- **3590 words**
- **Web URL:** https://docs.textcontrol.com/tx-text-control-dotnet-wpf/getting-started/document-editor/ribbon/
- **LLMs URL:** https://docs.textcontrol.com/tx-text-control-dotnet-wpf/getting-started/document-editor/ribbon/llms.txt
- **LLMs-Full URL:** https://docs.textcontrol.com/tx-text-control-dotnet-wpf/getting-started/document-editor/ribbon/llms-full.txt

---

In WPF, the ribbon itself comes from Microsoft: the `Ribbon` control of `System.Windows.Controls.Ribbon`, usually in a `RibbonWindow`. TX Text Control adds the tabs that fill it, such as **Home**, **Insert** and **View**, each a ready-made set of word processing commands that works as soon as it is connected to the editor. Following the steps below, you turn *MainWindow* into a `RibbonWindow`, place five tabs of TX Text Control in the ribbon, add rulers and a status bar, and finish with a **Table Tools** tab that appears only while the input position is in a table.

### Prerequisites

- A WPF project for .NET 8 or higher with the package `TXTextControl.TextControl.WPF.SDK`, as in the first two sections of [Create Your First WPF Application](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/getting-started/document-editor/first-application/llms-full.txt). Start with the *MainWindow.xaml* of the template; the ribbon replaces the button bar of that tutorial.
- The Professional or Enterprise edition: the ribbon tabs are not part of the Standard edition. See [Editions and Feature Availability](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/overview/editions/llms-full.txt).

### Make the Window a RibbonWindow

A `RibbonWindow` is a WPF window that integrates the ribbon into its title bar, including the headers of contextual tab groups. Two lines change:

1. In *MainWindow.xaml*, replace the element name `Window` with `RibbonWindow`, in the opening and the closing tag.
2. In *MainWindow.xaml.cs*, derive the class from `RibbonWindow` instead of `Window`, and add `using System.Windows.Controls.Ribbon;`:

```csharp
public partial class MainWindow : RibbonWindow
```

In a .NET project, the WPF ribbon assembly is part of the framework, and the XAML finds `RibbonWindow`, `Ribbon` and their related elements in the default XAML namespace, without a declaration of their own.

### Add the Ribbon and the Tabs

The tabs of TX Text Control are in the toolbox tab **TX Text Control 34.0**, from **RibbonFormattingTab** to **RibbonViewTab**. The XAML is short enough to write by hand. Replace the contents of *MainWindow.xaml* with the following, and keep the namespace of `x:Class` that Visual Studio created:

```xml
<RibbonWindow x:Class="MyWPFApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:WPF="clr-namespace:TXTextControl.WPF;assembly=TXTextControl.WPF"
        Title="MainWindow" Height="600" Width="1000">
    <DockPanel>
        <Ribbon x:Name="ribbon1" DockPanel.Dock="Top">
            <WPF:RibbonFormattingTab x:Name="ribbonFormattingTab1" />
            <WPF:RibbonInsertTab x:Name="ribbonInsertTab1" />
            <WPF:RibbonPageLayoutTab x:Name="ribbonPageLayoutTab1" />
            <WPF:RibbonViewTab x:Name="ribbonViewTab1" />
            <WPF:RibbonProofingTab x:Name="ribbonProofingTab1" />
        </Ribbon>

        <WPF:StatusBar x:Name="statusBar1" DockPanel.Dock="Bottom" />
        <WPF:RulerBar x:Name="rulerBar1" DockPanel.Dock="Top" />
        <WPF:RulerBar x:Name="rulerBar2" DockPanel.Dock="Left"
                      HorizontalAlignment="Left" VerticalAlignment="Stretch" />

        <WPF:TextControl x:Name="textControl1" Loaded="textControl1_Loaded"
                         RibbonFormattingTab="ribbonFormattingTab1"
                         RibbonInsertTab="ribbonInsertTab1"
                         RibbonPageLayoutTab="ribbonPageLayoutTab1"
                         RibbonViewTab="ribbonViewTab1"
                         RibbonProofingTab="ribbonProofingTab1"
                         RulerBar="rulerBar1"
                         VerticalRulerBar="rulerBar2"
                         StatusBar="statusBar1" />
    </DockPanel>
</RibbonWindow>
```

The XAML works as follows:

- **The tabs.** [RibbonFormattingTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/ribbonformattingtab/llms-full.txt) is the **Home** tab with the clipboard, font, paragraph, styles and editing commands. [RibbonInsertTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/ribboninserttab/llms-full.txt) inserts pages, images, hyperlinks, bookmarks, headers and footers, text frames and symbols. [RibbonPageLayoutTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/ribbonpagelayouttab/llms-full.txt) edits the page setup and layout, [RibbonViewTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/ribbonviewtab/llms-full.txt) the view settings, and [RibbonProofingTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/ribbonproofingtab/llms-full.txt) the proofing options such as spelling and hyphenation. Each is derived from the WPF `RibbonTab` and brings its own header, groups and buttons.
- **The connection.** Like the bars, each tab is connected by name: [RibbonFormattingTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/textcontrol/ribbonformattingtab-property/llms-full.txt), [RibbonInsertTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/textcontrol/ribboninserttab-property/llms-full.txt), [RibbonPageLayoutTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/textcontrol/ribbonpagelayouttab-property/llms-full.txt), [RibbonViewTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/textcontrol/ribbonviewtab-property/llms-full.txt) and [RibbonProofingTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/textcontrol/ribbonproofingtab-property/llms-full.txt) of the `TextControl` each hold the `x:Name` of a tab. Through this connection, the commands of a tab act on the document in the editor.
- **The bars.** The status bar is docked at the bottom, the horizontal ruler below the ribbon and the vertical ruler at the left. [RulerBar](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/textcontrol/rulerbar-property/llms-full.txt), [VerticalRulerBar](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/textcontrol/verticalrulerbar-property/llms-full.txt) and [StatusBar](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/textcontrol/statusbar-property/llms-full.txt) connect them. The `TextControl` is the last child of the `DockPanel` and fills the rest of the window.

The TX Words sample adds four more tabs the same way: [RibbonReferencesTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/ribbonreferencestab/llms-full.txt), [RibbonPermissionsTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/ribbonpermissionstab/llms-full.txt), [RibbonFormFieldsTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/ribbonformfieldstab/llms-full.txt) and [RibbonReportingTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/ribbonreportingtab/llms-full.txt), each with a property of the same name on the `TextControl`.

### Set the Focus When the Window Opens

The `Loaded` attribute of the `TextControl` names a handler in *MainWindow.xaml.cs*. Complete the file as follows:

```csharp
using System;
using System.Windows;
using System.Windows.Controls.Ribbon;

namespace MyWPFApp
{
    public partial class MainWindow : RibbonWindow
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void textControl1_Loaded(object sender, RoutedEventArgs e)
        {
            // Let the user type at once
            textControl1.Focus();
        }
    }
}
```

### Run the Application

Press **F5**. The window shows the ribbon with its five tabs, starting with **Home** and **Insert**, above the rulers and the editor, and the status bar at the bottom. Type some text and format it with the **Home** tab, insert a table with **Insert**, or change the margins of the page with the page layout tab.

### Add a Table Tools Tab

A contextual tab belongs to a group that is visible only in a certain context, like the **Table Tools** of a word processor. In the TX Words sample, the group appears while the input position is in a table and holds the table layout tab:

![A ribbon of the TX Words sample for WPF with the tabs Home, Insert, Permissions and Form Fields and, under the header Table Tools, the contextual tabs Table Layout and Formulas.](https://docs.textcontrol.com/assets/img/tx-text-control-dotnet-wpf/table-tools-tab-group.22db06a3.webp)

1. Add a [RibbonTableLayoutTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/ribbontablelayouttab/llms-full.txt) and a contextual tab group to the `Ribbon`, after the other tabs:

    ```xml
    <WPF:RibbonTableLayoutTab x:Name="ribbonTableLayoutTab1" ContextualTabGroupHeader="Table Tools" />
    <Ribbon.ContextualTabGroups>
        <RibbonContextualTabGroup x:Name="tableToolsGroup" Header="Table Tools"
                                  Background="#6600FF00" Visibility="Collapsed" />
    </Ribbon.ContextualTabGroups>
    ```
2. Connect the tab to the editor by adding `RibbonTableLayoutTab="ribbonTableLayoutTab1"` to the `WPF:TextControl` element.
3. In *MainWindow.xaml.cs*, handle the event that reports a new input position. Add the line to the constructor and the method to the class:

```csharp
public MainWindow()
{
    InitializeComponent();
    textControl1.InputPositionChanged += textControl1_InputPositionChanged;
}

private void textControl1_InputPositionChanged(object sender, EventArgs e)
{
    // Show Table Tools only while the input position is in a table
    tableToolsGroup.Visibility = textControl1.Tables.GetItem() != null
        ? Visibility.Visible
        : Visibility.Collapsed;
}
```

1. Press **F5**, insert a table with the **Insert** tab and click into it. The **Table Tools** header appears in the title bar with the **Table Layout** tab below it, and it disappears when you click outside the table.

The code works as follows:

- `ContextualTabGroupHeader` of the tab and `Header` of the `RibbonContextualTabGroup` contain the same text, which is how the WPF ribbon assigns a tab to its group. `Visibility="Collapsed"` hides the group until the code shows it.
- [RibbonTableLayoutTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/textcontrol/ribbontablelayouttab-property/llms-full.txt) of the `TextControl` connects the tab like the other tabs.
- [InputPositionChanged](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/textcontrol/inputpositionchanged-event/llms-full.txt) occurs each time the input position moves. [Tables](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/textcontrol/tables-property/llms-full.txt)`.`[GetItem](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol/tablecollection/getitem-method/llms-full.txt) returns the table at the input position, or `null` outside a table.

The TX Words sample puts a [RibbonFormulaTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/ribbonformulatab/llms-full.txt) into the same group, and a [RibbonFrameLayoutTab](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/reference/txtextcontrol-wpf/ribbonframelayouttab/llms-full.txt) into a **Frame Tools** group, which appears while an image, a text frame or a drawing is selected.

### The TX Words Sample

The setup installs a complete ribbon application with all ribbon tabs of TX Text Control, an application menu with recent files, a Quick Access Toolbar, contextual tab groups for tables and frames, and three sidebars. Its source code is in *%USERPROFILE%\\Documents\\TX Text Control 34.0.NET for WPF\\CSharp\\TX Words\\Ribbon*. [TX Words WPF Sample Application](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/examples/tx-words/llms-full.txt) describes it.

### Next Steps

- [Add a Sidebar](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/getting-started/document-editor/sidebar/llms-full.txt): open the styles, comments or search panels beside the document from ribbon buttons.
- [Load and Save Documents](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/getting-started/document-editor/load-save/llms-full.txt): add New, Open and Save to the application menu of the ribbon.
- [Connecting Ribbon Tabs in XAML](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/document-editor/ribbon-ui/ribbon-xaml/llms-full.txt): every tab and its connection in detail.
- [Custom Tabs and Commands](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/document-editor/ribbon-ui/custom-tabs/llms-full.txt): change the built-in tabs and add your own.

---

## Nearby

- **Previous:** [Connect Rulers, Toolbars, and a Status Bar](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/getting-started/document-editor/rulers-toolbars/llms-full.txt)
- **Next:** [Add a Sidebar](https://docs.textcontrol.com/tx-text-control-dotnet-wpf/getting-started/document-editor/sidebar/llms-full.txt)