diff --git a/Document-Processing/Word/Word-Processor/uwp/Getting-Started.md b/Document-Processing/Word/Word-Processor/uwp/Getting-Started.md index 43744fdec9..f34e0d8977 100644 --- a/Document-Processing/Word/Word-Processor/uwp/Getting-Started.md +++ b/Document-Processing/Word/Word-Processor/uwp/Getting-Started.md @@ -1,12 +1,12 @@ --- title: Getting Started with UWP RichTextBox control | Syncfusion -description: Learn here about getting started with Syncfusion UWP RichTextBox (SfRichTextBoxAdv) control, its elements and more. +description: Learn here all about getting started with Syncfusion UWP RichTextBox (SfRichTextBoxAdv) control and more. platform: document-processing control: SfRichTextBoxAdv documentation: ug -keywords: getting-started +keywords: getting started, docx editor --- -# Getting started with Syncfusion® UWP RichTextBox +# Getting Started with Syncfusion® UWP RichTextBox Syncfusion® [UWP RichTextBox](https://www.syncfusion.com/docx-editor-sdk/uwp-docx-editor) (SfRichTextBoxAdv) enables you to create, edit, view, and print Word documents in UWP applications. This section guides you through the steps to get started and create a RichTextBox in a UWP application. @@ -28,7 +28,7 @@ The steps below cover the essential tasks required to add and use the SfRichText N> The **project name** is used as the default namespace (for example, in `x:Class`). It is recommended to use **DocumentEditor** to match the code examples provided. -- Select the **target version** and **minimum version** of Windows as required. +- Select the **target version** and **minimum version** of Windows as required. See [Syncfusion® UWP system requirements](https://help.syncfusion.com/uwp/system-requirements) for tooling and supported Windows versions. - Click **Create**. @@ -40,7 +40,7 @@ N> The **project name** is used as the default namespace (for example, in `x:Cla **Using NuGet Package Manager (UI):** -1. In Solution Explorer, right-click the project and select **Manage NuGet Packages**. +1. In Solution Explorer, right-click the project and choose **Manage NuGet Packages**. 2. Search for [Syncfusion.SfRichTextBoxAdv.UWP](https://www.nuget.org/packages/Syncfusion.SfRichTextBoxAdv.UWP) and install the latest version. 3. Verify that all [required dependencies](https://help.syncfusion.com/uwp/control-dependencies#sfrichtextboxadv) are installed and the project is successfully restored. @@ -63,6 +63,7 @@ The following assembly references are required to use the **SfRichTextBoxAdv** c - Syncfusion.SfRichTextBoxAdv.UWP - Syncfusion.DocIO.UWP +- Syncfusion.OfficeChart.UWP - Syncfusion.SfRadialMenu.UWP - Syncfusion.SfShared.UWP @@ -70,7 +71,11 @@ The following assembly references are required to use the **SfRichTextBoxAdv** c {% endtabcontents %} -N> 1. Starting with v16.2.0.41 (2018 Vol 2), if you reference Syncfusion® assemblies from trial setup or from the NuGet feed, you also have to add "Syncfusion.Licensing" assembly reference and include a license key in your projects. Please refer to this [link](https://help.syncfusion.com/common/essential-studio/licensing/overview) to know about registering Syncfusion license key in your UWP application to use our components. +N> A valid Syncfusion® license key is required from **v16.2.0.41 (2018 Vol 2)** onwards. + + - The required `Syncfusion.Licensing` assembly is installed automatically as a NuGet dependency — no separate reference is needed. + - If you are using the **Assemblies** installation, you must add a reference to `Syncfusion.Licensing.dll` in your project. + - Register the license key in the `App` constructor of `App.xaml.cs` before any Syncfusion control is initialized. For the exact `RegisterLicense` code, refer to [Register Syncfusion® License key in a UWP application](https://help.syncfusion.com/common/essential-studio/licensing/how-to-register-in-an-application#uwp). ### Add SfRichTextBoxAdv control @@ -156,9 +161,9 @@ namespace DocumentEditor ### Run the Application -1. Press **F5** or click **Debug → Start Debugging** in Visual Studio. -2. The UWP application is deployed and launched on the selected target device and displays the SfRichTextBoxAdv control -3. Press Ctrl+O to open an existing document. The selected document will be displayed within the SfRichTextBoxAdv control, as shown below. +1. Press **F5** or click **Debug > Start Debugging** in Visual Studio. +2. The UWP application is deployed and launched on the selected target device and displays the SfRichTextBoxAdv control. +3. Press **Ctrl+O** to open an existing document. The selected document will be displayed within the SfRichTextBoxAdv control, as shown below. ![UWP SfRichTextBoxAdv Control](Getting-Started_images/uwp-sfrichtextboxadv-control.png) @@ -168,4 +173,4 @@ N> [View Sample in GitHub](https://github.com/SyncfusionExamples/UWP-RichTextBox - [Import and Export](https://help.syncfusion.com/document-processing/word/word-processor/uwp/import-and-export) - [Selection](https://help.syncfusion.com/document-processing/word/word-processor/uwp/selection) -- [Commands](https://help.syncfusion.com/document-processing/word/word-processor/uwp/commands) \ No newline at end of file +- [Commands](https://help.syncfusion.com/document-processing/word/word-processor/uwp/commands) diff --git a/Document-Processing/Word/Word-Processor/wpf/Getting-Started.md b/Document-Processing/Word/Word-Processor/wpf/Getting-Started.md index 83bc8f4d8e..3fd7aa73bc 100644 --- a/Document-Processing/Word/Word-Processor/wpf/Getting-Started.md +++ b/Document-Processing/Word/Word-Processor/wpf/Getting-Started.md @@ -4,10 +4,10 @@ description: Learn here all about getting started with Syncfusion WPF RichTextBo platform: document-processing control: SfRichTextBoxAdv documentation: ug -keywords: getting started +keywords: getting started, docx editor --- -# Getting started with Syncfusion® WPF RichTextBox +# Getting Started with Syncfusion® WPF RichTextBox [WPF RichTextBox](https://www.syncfusion.com/docx-editor-sdk/wpf-docx-editor) (SfRichTextBoxAdv) enables you to create, edit, view, and print Word documents in WPF applications. This section guides you through the steps to get started and create a RichTextBox in a WPF application. @@ -33,9 +33,11 @@ N> The **project name** is used as the default namespace (for example, in `x:Cla - Select the **target framework**: - For **.NET** → Click **Next** and choose the **latest supported .NET version** - - For **.NET Framework** → Select the required version in the same window + - For **.NET Framework** → Select **4.6.2 or above** in the same window - Click **Create** +N> The control supports **.NET 8, .NET 9, .NET 10**, as well as **.NET Framework 4.6.2 and above**. + ### Add SfRichTextBoxAdv dependencies {% tabcontents %} @@ -45,7 +47,7 @@ N> The **project name** is used as the default namespace (for example, in `x:Cla **Using NuGet Package Manager (UI):** 1. In Solution Explorer, right-click the project and choose **Manage NuGet Packages**. -2. Search for [Syncfusion.SfRichTextBoxAdv.Wpf](https://www.nuget.org/packages/Syncfusion.SfRichTextBoxAdv.WPF) and install the latest version. +2. Search for [Syncfusion.SfRichTextBoxAdv.WPF](https://www.nuget.org/packages/Syncfusion.SfRichTextBoxAdv.WPF) and install the latest version. 3. Ensure the [necessary dependencies](https://help.syncfusion.com/wpf/control-dependencies#sfrichtextboxadv) are installed correctly, and the project is restored. **Using Package Manager Console:** @@ -74,7 +76,11 @@ The following assembly references are required to use the **SfRichTextBoxAdv** c {% endtabcontents %} -N> Starting with v16.2.0.41 (2018 Vol 2), if you reference Syncfusion® assemblies from trial setup or from the NuGet feed, you also have to add "Syncfusion.Licensing" assembly reference and include a license key in your project. Please refer to this [link](https://help.syncfusion.com/common/essential-studio/licensing/overview) to know about registering Syncfusion® license key in your WPF application to use our components. +N> A valid Syncfusion® license key is required from **v16.2.0.41 (2018 Vol 2)** onwards. + + - The required `Syncfusion.Licensing` assembly is installed automatically as a NuGet dependency — no separate reference is needed. + - If you are using the **Assemblies** installation, you must add a reference to `Syncfusion.Licensing.dll` in your project. + - Register the license key in the `App` constructor of `App.xaml.cs` before any Syncfusion control is initialized. For the exact `RegisterLicense` code, refer to [Register Syncfusion® License key in a WPF application](https://help.syncfusion.com/common/essential-studio/licensing/how-to-register-in-an-application#wpf). ### Add SfRichTextBoxAdv control @@ -157,9 +163,11 @@ namespace DocumentEditor ### Run the Application -1. Press **F5** or click **Debug → Start Debugging** in Visual Studio. +N> Ensure you have registered the Syncfusion® license key in `App.xaml.cs` before running — see the [licensing note](#add-sfrichtextboxadv-dependencies) earlier on this page. + +1. Press **F5** or click **Debug > Start Debugging** in Visual Studio. 2. The application launches and displays the **SfRichTextBoxAdv** control. -3. Press Ctrl+O to open an existing document. The selected document will be displayed within the SfRichTextBoxAdv control, as shown below. +3. Press **Ctrl+O** to open an existing document. The selected document will be displayed within the SfRichTextBoxAdv control, as shown below. ![WPF SfRichTextBoxAdv Control](Getting-Started_images/wpf-sfrichtextboxadv-control.png) @@ -167,7 +175,7 @@ N> [View Sample in GitHub](https://github.com/SyncfusionExamples/WPF-RichTextBox ## Add ribbon UI to SfRichTextBoxAdv -If you need a ribbon-based user interface, you can add **SfRichTextRibbon** with **SfRichTextBoxAdv** control. It enhances the user experience by organizing commands into tabs and groups, similar to Microsoft Word. +If you need a ribbon-based user interface, you can add **SfRichTextRibbon** with the **SfRichTextBoxAdv** control. It enhances the user experience by organizing commands into tabs and groups, similar to Microsoft Word. ### Add SfRichTextRibbon Dependencies @@ -178,7 +186,7 @@ If you need a ribbon-based user interface, you can add **SfRichTextRibbon** with **Using NuGet Package Manager (UI)** 1. In Solution Explorer, right-click the project and choose **Manage NuGet Packages**. -2. Search for [Syncfusion.SfRichTextRibbon.Wpf](https://www.nuget.org/packages/Syncfusion.SfRichTextRibbon.WPF) and install the latest version. +2. Search for [Syncfusion.SfRichTextRibbon.WPF](https://www.nuget.org/packages/Syncfusion.SfRichTextRibbon.WPF) and install the latest version. 3. Ensure the [necessary dependencies](https://help.syncfusion.com/wpf/control-dependencies#sfrichtextribbon) are installed correctly, and the project is restored. @@ -216,11 +224,9 @@ The following assembly references are required to use the **SfRichTextRibbon** c To use the **SfRichTextRibbon** control in a WPF application, the application must use **Syncfusion® RibbonWindow** instead of the default **Window**. -1. Import the **Syncfusion® WPF schema** `http://schemas.syncfusion.com/wpf` in the **MainWindow.xaml** file. +1. In **MainWindow.xaml**, rename the root element from `` to `` and, if not already present, add the Syncfusion® WPF schema declaration `xmlns:syncfusion="http://schemas.syncfusion.com/wpf"` to the root element. -2. Replace the root element **Window** with **syncfusion:RibbonWindow** in the **MainWindow.xaml** file. - -3. Additionally, in the *MainWindow.xaml.cs* file, change the base class of `MainWindow` from **Window** to **RibbonWindow** to enable full support for the **SfRichTextRibbon** control. +2. In *MainWindow.xaml.cs*, change the base class of `MainWindow` from **Window** to **RibbonWindow** to enable full support for the **SfRichTextRibbon** control. ### Add SfRichTextRibbon to the application @@ -228,7 +234,8 @@ To use the **SfRichTextRibbon** control in a WPF application, the application mu {% tabcontent Via Designer %} -Open the Toolbox window and drag the **SfRichTextRibbon** and **SfRichTextBoxAdv** onto the Design view. Bind the SfRichTextBoxAdv as DataContext to the SfRichTextRibbon in XAML. +1. Open the **Toolbox** window and drag the **SfRichTextRibbon** and **SfRichTextBoxAdv** controls onto the Design view of `MainWindow.xaml`. +2. Switch to the **XAML** view of `MainWindow.xaml` and bind the `SfRichTextBoxAdv` as the `DataContext` of the `SfRichTextRibbon`. For the exact binding syntax, see the **Via XAML** tab. ![Dragging SfRichTextRibbon Control from Toolbox](Getting-Started_images/wpf-sfrichtextribbon-dragfrom-toolbox.png) @@ -314,8 +321,7 @@ namespace DocumentEditor // Enable pixel snapping for sharper rendering richTextRibbon.SnapsToDevicePixels = true; - // Set the DataContext of the ribbon to the editor - // This allows the ribbon to interact with the editor (binding commands) + // Bind the ribbon's commands to the editor instance richTextRibbon.DataContext = richTextBoxAdv; // Position the ribbon in the first row @@ -328,7 +334,7 @@ namespace DocumentEditor rootGrid.Children.Add(richTextRibbon); rootGrid.Children.Add(richTextBoxAdv); - // Set the constructed grid as the content of the UserControl + // Set the constructed grid as the content of the RibbonWindow this.Content = rootGrid; } } @@ -340,11 +346,11 @@ namespace DocumentEditor {% endtabcontents %} -N> Prefer using `SfRichTextRibbon` within `RibbonWindow` in your application, since the backstage of Ribbon will be opened only when the ribbon is loaded under the `RibbonWindow` +N> Prefer using `SfRichTextRibbon` within `RibbonWindow` — the ribbon's **backstage view** (File tab options like New, Open, Save, Print) is only available when the ribbon is hosted in a `RibbonWindow`. ### Run the Application with Ribbon UI -1. Press **F5** or click **Debug → Start Debugging** in Visual Studio. +1. Press **F5** or click **Debug > Start Debugging** in Visual Studio. 2. The application will launch with the **SfRichTextRibbon** and **SfRichTextBoxAdv** controls. 3. Press **Ctrl + O** or use the **Open** option in the **SfRichTextRibbon** to open a document, which will be displayed in the **SfRichTextBoxAdv** control, with ribbon options available for editing and formatting, as shown below @@ -368,8 +374,8 @@ The steps below outline the essential tasks required to configure and apply them 1. In Solution Explorer, right-click the project and choose **Manage NuGet Packages**. 2. In the **Browse** tab, search for and install the latest version of the following packages: - - [Syncfusion.SfRichTextBoxAdv.Wpf](https://www.nuget.org/packages/Syncfusion.SfRichTextBoxAdv.WPF) – Rich text editor control - - [Syncfusion.SfRichTextRibbon.Wpf](https://www.nuget.org/packages/Syncfusion.SfRichTextRibbon.WPF) – Ribbon UI for the editor + - [Syncfusion.SfRichTextBoxAdv.WPF](https://www.nuget.org/packages/Syncfusion.SfRichTextBoxAdv.WPF) – Rich text editor control + - [Syncfusion.SfRichTextRibbon.WPF](https://www.nuget.org/packages/Syncfusion.SfRichTextRibbon.WPF) – Ribbon UI for the editor - [Syncfusion.Themes.Windows11Light.WPF](https://www.nuget.org/packages/Syncfusion.Themes.Windows11Light.WPF) – Windows 11 Light theme 3. Ensure all dependencies are installed successfully and the project is restored without errors. @@ -414,7 +420,7 @@ In this section, the **Windows 11 Light** theme is used as an example to demonst To explore the complete list of available themes and learn how to create custom themes, refer to: * [Apply theme using SfSkinManager](https://help.syncfusion.com/wpf/themes/skin-manager) - + * [Create a custom theme using ThemeStudio](https://help.syncfusion.com/wpf/themes/theme-studio#creating-custom-theme) ### Apply Themes to SfRichTextBoxAdv and SfRichTextRibbon @@ -427,9 +433,9 @@ To add the controls and apply a theme manually in XAML, follow these steps: **Add SfRichTextBoxAdv and SfRichTextRibbon in XAML** -Refer to the following link for detailed instructions: +The XAML snippet below assumes both `SfRichTextBoxAdv` and `SfRichTextRibbon` are already declared in `MainWindow.xaml`, with the `SfRichTextBoxAdv` set as the ribbon's `DataContext`. -[Add SfRichTextBoxAdv and SfRichTextRibbon in XAML](https://help.syncfusion.com/document-processing/word/word-processor/wpf/getting-started?tabcontent=via-xaml#add-ribbon-ui-to-sfrichtextboxadv) +For the full declaration, see the [**Add SfRichTextRibbon to the application → Via XAML**](https://help.syncfusion.com/document-processing/word/word-processor/wpf/getting-started#add-sfrichtextribbon-to-the-application) section of this page. **Apply Theme in XAML** @@ -515,8 +521,7 @@ namespace DocumentEditor // Enable pixel snapping for sharper rendering richTextRibbon.SnapsToDevicePixels = true; - // Set the DataContext of the ribbon to the editor - // This allows the ribbon to interact with the editor (binding commands) + // Bind the ribbon's commands to the editor instance richTextRibbon.DataContext = richTextBoxAdv; // Position the ribbon in the first row @@ -529,7 +534,7 @@ namespace DocumentEditor rootGrid.Children.Add(richTextRibbon); rootGrid.Children.Add(richTextBoxAdv); - // Set the constructed grid as the content of the UserControl + // Set the constructed grid as the content of the RibbonWindow this.Content = rootGrid; // Applies the Windows 11 Light theme to the window @@ -546,7 +551,7 @@ namespace DocumentEditor ### Run the Application with Theme Applied -1. Press **F5** or click **Debug → Start Debugging** in Visual Studio. +1. Press **F5** or click **Debug > Start Debugging** in Visual Studio. 2. The application will launch with the **SfRichTextRibbon** and **SfRichTextBoxAdv** controls using the **Windows 11 Light theme**. 3. Press **Ctrl + O** or use the **Open** option in the **SfRichTextRibbon** to open a document. 4. The document is displayed in the editor, along with the themed ribbon and editor interface, as shown below. @@ -559,4 +564,4 @@ N> [View Sample in GitHub](https://github.com/SyncfusionExamples/WPF-RichTextBox - [Import and Export](https://help.syncfusion.com/document-processing/word/word-processor/wpf/import-and-export) - [Selection](https://help.syncfusion.com/document-processing/word/word-processor/wpf/selection) -- [Commands](https://help.syncfusion.com/document-processing/word/word-processor/wpf/commands) \ No newline at end of file +- [Commands](https://help.syncfusion.com/document-processing/word/word-processor/wpf/commands)