Blazor framework is widely used to build interactive and reusable web UI in web technologies. Moreover, Blazor WebAssembly apps execute directly in the browser on a WebAssembly-based .NET runtime. This article covers how to use System.Drawing library in a Blazor WebAssembly app. The API can be used to draw text strings, images, vector graphics, etc. Let us go through this article under the following headings to learn more details:
- Create a C# Blazor WebAssembly App Project
- Update the Project References
- Add the Code to Draw an Image
- Add the License and Initialization Code
- Run the Application
Create a C# Blazor WebAssembly App Project
In Microsoft Visual Studio IDE, create a Blazor WebAssembly app. Press the ‘Next’ button and then mark .NET 5.0 and ASP.NET Core checkboxes as per the following screenshots.
Update the Project References
Browse the NuGet gallery and configure Aspose.Drawing package to be added as the project dependency.
Add the Code to Draw an Image
Replace the Pages/Index.razor file contents with the following code snippet to create an image containing the drawing.
Add the License and Initialization Code
Now you can add the license file as an embedded resource and add the following license initialization code to the main method in the Program.cs file. However, in case you do not have a license, you may request a free temporary license.
Run the Application
Run the application from the Microsoft Visual Studio IDE and the browser will show the gradient image as under:
Conclusion
In this article, you have learned how to use System.Drawing functionality in Blazor WebAssembly application. You may visit the documentation space for more details about the features offered by the API. Moreover, please reach out to us via the forum in case you need to discuss any of your requirements or concerns.