Introducing Syncfusion .NET MAUI Visible Studio Code Extension

Syncfusion is glad to introduce the .NET MAUI Visible Studio Code Extension in our Important Studio 2024 Quantity 1 launch. It’s a utility for including Syncfusion .NET MAUI controls within the XAML file of a .NET MAUI app. This code snippet utility saves builders time when including Syncfusion .NET MAUI controls to their tasks.

This weblog will discover utilizing the brand new code snippet utility so as to add Syncfusion .NET MAUI parts to your apps.

Stipulations

Putting in the Syncfusion .NET MAUI Visible Studio Code Extension

We are able to set up the Syncfusion .NET MAUI Extension immediately from Visible Studio Code or the Visible Studio Market.

Let’s see the steps to take action!

Putting in the extension from Visible Studio Code

Observe these steps to put in the Syncfusion .NET MAUI Extension from Visible Studio Code:

1. Open Visible Studio Code.
2. Then, open the Command Palette by navigating to View -> Command Palette.
3. Now, seek for Set up Extensions within the Command Palette and develop the Set up Extensions choice when it seems.
4. Seek for Syncfusion .NET MAUI within the search field to find .NET MAUI VS Code Extensions – Syncfusion.
5. Set up the .NET MAUI VS Code Extensions – Syncfusion extension by clicking the Set up button.

Putting in the extension from Market

Observe these steps to put in the Syncfusion .NET MAUI extensions from Market:

1. Open the Syncfusion .NET MAUI Code Extensions in Visible Studio Code Market and click on Set up.
2. A pop-up will seem requesting to open Visible Studio Code. Click on on Open Visible Studio Code.
3. Within the subsequent pop-up that seems, click on Set up to put in the extension.

Including Syncfusion .NET MAUI controls utilizing the Visible Studio Code Extension

The code snippet utility for Visible Studio Code facilitates easy insertion of numerous Syncfusion .NET MAUI controls with their respective options into the XAML code editor of the .NET MAUI app.

Observe these steps so as to add a Syncfusion .NET MAUI management to your .NET MAUI app:

1. Open an present .NET MAUI app or create a brand new one in Visible Studio Code.
2. Then, open the required XAML file and place the cursor the place you wish to add the Syncfusion .NET MAUI management.
3. To entry a Syncfusion .NET MAUI management with its options, sort sf within the following format.

   Sf-<Syncfusion part title>-<Syncfusion part characteristic>

   For instance, sf-datagrid-grouping

4. Choose the required Syncfusion management and its options and press Enter or Tab. The Syncfusion .NET MAUI management and the code to make use of the characteristic shall be added to the XAML file. Consult with the next picture.

   

5. After including the required Syncfusion .NET MAUI management to the XAML file, the directions shall be included within the TODO part to your reference. It will information you in figuring out whether or not so as to add the View Mannequin file or solely add the namespace and NuGet entries to run the Syncfusion management.
   To discover additional particulars in regards to the added .NET MAUI management options, you may entry the documentation web page by clicking on the assist hyperlink on the prime of the code snippet.
   

Configuring the .NET MAUI app

The Syncfusion .NET MAUI Visible Studio Code Extension utility provides solely the code for the controls within the XAML file. So, we have to set up the required NuGet packages and add namespaces by following these steps:

1. Open the .NET MAUI app’s undertaking file and manually add the required Syncfusion .NET MAUI particular person NuGet package deal(s) as a package deal reference for the Syncfusion .NET MAUI controls. We’ve included a commented code pattern indicating every part’s corresponding NuGet package deal entry. Copy and paste the NuGet package deal entry into your .NET MAUI undertaking file. This NuGet package deal shall be robotically restored throughout the undertaking’s construct or save course of. 
   
2. To combine Syncfusion controls into your app, go to the XAML file and insert the required Syncfusion .NET MAUI namespace entries. We’ve included a commented code pattern indicating the corresponding namespace entry for every part. Copy the namespace entry and paste it into your XAML file.
   
3. Lastly, run the app to see the Syncfusion .NET MAUI management.

Conclusion

Thanks for studying! This weblog explored the brand new Syncfusion .NET MAUI Visible Studio Code Extension within the Important Studio 2024 Quantity 1 launch. I belief this weblog will enable you to make the most of our code snippet utility to seamlessly combine Syncfusion .NET MAUI controls into your apps, saving you time and enhancing your app’s performance.

To discover extra updates from this launch, please confer with our Launch Notes and What’s New pages.

For those who’re not a Syncfusion buyer, we encourage you to attempt our 30-day free trial to expertise these newest options firsthand.

We welcome your suggestions and questions within the feedback part beneath or by way of our help boards, help portal, or suggestions portal. We’re right here that can assist you each step of the best way!

Associated blogs