diff --git a/MAUI/UIKit/GettingStarted.md b/MAUI/UIKit/GettingStarted.md index 5293e9e6ee..8fd1268e7a 100644 --- a/MAUI/UIKit/GettingStarted.md +++ b/MAUI/UIKit/GettingStarted.md @@ -86,6 +86,60 @@ N> The **Essential® UI Kit for .NET MAUI** add-in will be shown when ![MAUI UI Kit Visual Studio Code](UI-Kit-images/visual-studio-code-maui-ui-kit.gif) +{% endtabcontent %} + +{% tabcontent JetBrains Rider %} + +**Prerequisites** + +* JetBrains Rider 2024.2 or later is required. +* Ensure the .NET MAUI workload (.NET 8 and later) is installed before proceeding. +* Ensure the **Essential® UI Kit for .NET MAUI - Syncfusion®** plugin is installed in JetBrains Rider. To check, go to **Settings > Plugins > Installed**. If the plugin is not installed, follow the steps below: + 1. Open JetBrains Rider. + 2. Navigate to **File > Settings > Plugins**. + 3. Select the **Marketplace** tab, type **Essential® UI Kit for .NET MAUI** in the search field, and click **Install**. + 4. Restart JetBrains Rider if prompted. + +**Add UI Kit templates to a .NET MAUI project** + +1. Open JetBrains Rider and open an existing .NET MAUI project, or create a new MAUI app first. + +2. In the **Solution Explorer**, right-click the project and choose **Tools → Essential UI Kit for .NET MAUI - Syncfusion®** as shown in the following screenshot. + + ![Syncfusion Essential UI Kit for .NET MAUI Context menu in MAUI](UI-Kit-images/Menu.png) + +3. The category dialog wizard will open with pre-defined templates. + + ![Add new item dialog box](UI-Kit-images/Maui-Wizard.png) + +4. Choose one or more page templates (for example, `About Us Page With Cards`), and then click **Next**. + +5. Enter a name for the new page and click **Add** to scaffold the XAML page, View, ViewModel, Model classes, and resources. + + ![Edit page Name in MAUI UI Kit Plugin](UI-Kit-images/Edit-Wizard.png) + +6. The selected pages will be added along with the **View, ViewModel, Model** classes, resource files, and the **Syncfusion® NuGet package** reference as shown in the following screenshots. + + ![Added files in MAUI Project](UI-Kit-images/ViewFiles.png) + + ![Added Resources in MAUI Project](UI-Kit-images/Resources.png) + + ![Added NuGet in MAUI Project](UI-Kit-images/Packages.png) + +7. To set the new page as the startup page, see the [How to Render the Added Page?](#how-to-render-the-added-page) section below. + +**Troubleshooting** + +* **Templates don't appear:** Restart Rider after installing the plugin, or verify the plugin is enabled under **Settings > Plugins > Installed**. +* **NuGet packages failing to restore:** Ensure your NuGet sources are available and the project targets a supported MAUI framework (.NET 8 and later). + +**References** + +* [Essential® UI Kit for .NET MAUI Plugin | Syncfusion]([https://help.syncfusion.com/maui/extension/getting-started](https://help.syncfusion.com/extension/netmaui-extension/jetbrains/essential-ui-kit)) +* [JetBrains Rider extension documentation](https://github.com/syncfusion-content/extension-docs/tree/master/Extension/NETMAUI-Extension/JetBrains) + +N> Syncfusion® licensing registration is required if you have installed the trial setup or NuGet packages, since Syncfusion® introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio® release. When a page is added, a licensing message box will appear with a link to register the key. Refer to the [Syncfusion licensing overview](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key) to generate and register the license key in your project. Refer to this [blog](https://www.syncfusion.com/blogs/post/whats-new-in-2018-volume-2.aspx) post for details on the licensing changes introduced in Essential Studio®. + {% endtabcontent %} {% endtabcontents %} diff --git a/MAUI/UIKit/UI-Kit-images/Edit-Wizard.png b/MAUI/UIKit/UI-Kit-images/Edit-Wizard.png new file mode 100644 index 0000000000..e26d74b790 Binary files /dev/null and b/MAUI/UIKit/UI-Kit-images/Edit-Wizard.png differ diff --git a/MAUI/UIKit/UI-Kit-images/Maui-Wizard.png b/MAUI/UIKit/UI-Kit-images/Maui-Wizard.png new file mode 100644 index 0000000000..32a41b05ff Binary files /dev/null and b/MAUI/UIKit/UI-Kit-images/Maui-Wizard.png differ diff --git a/MAUI/UIKit/UI-Kit-images/Menu.png b/MAUI/UIKit/UI-Kit-images/Menu.png new file mode 100644 index 0000000000..75ef18d610 Binary files /dev/null and b/MAUI/UIKit/UI-Kit-images/Menu.png differ diff --git a/MAUI/UIKit/UI-Kit-images/Packages.png b/MAUI/UIKit/UI-Kit-images/Packages.png new file mode 100644 index 0000000000..edad3777a5 Binary files /dev/null and b/MAUI/UIKit/UI-Kit-images/Packages.png differ diff --git a/MAUI/UIKit/UI-Kit-images/Resources.png b/MAUI/UIKit/UI-Kit-images/Resources.png new file mode 100644 index 0000000000..547eb131d7 Binary files /dev/null and b/MAUI/UIKit/UI-Kit-images/Resources.png differ diff --git a/MAUI/UIKit/UI-Kit-images/ViewFiles.png b/MAUI/UIKit/UI-Kit-images/ViewFiles.png new file mode 100644 index 0000000000..f42a858a70 Binary files /dev/null and b/MAUI/UIKit/UI-Kit-images/ViewFiles.png differ