How to use DrawingView in .Net MAUI?

Hi guys, In this blog, we will learn how to use DrawingView in .Net MAUI.

DrawingView can be useful for creating paint apps or can be used for taking a signature of users etc.

DrawingView is not directly available in .Net MAUI for use it’s available in CommunityToolki.Maui.

Output

Install CommunityToolkit.Maui

We need to install CommunityToolkit.Maui to use DrawingView in .Net MAUI.

So, Right click on solution & click on Manage NuGet Packages for Solution. And browse CommunityToolkit.Maui.

CommunityToolkit.Maui

Usage of DrawingView

Once installed CommnityToolkit.Maui, Simply declare the namespace in your page XAML & use the DrawingView.

Usage

Namespace:

xmlns:toolkit=”clr-namespace:CommunityToolkit.Maui.Views;assembly=CommunityToolkit.Maui”

You can see IsMultiLineModeEnabled is set to true which allows us to draw multiple lines on the canvas.

You can explore more DrawingView properties from the documentation.

Convert DrawingView Canvas to Image

There will be no use of DrawingView if we can’t convert the output of DrawingView to an Image.

To do that DrawingView has the GetImageStream method which takes height & width parameters for image output.

Convert to Image

Sample App Code

MainPage.xaml code

MainPage Code behind

Output

Output

Do let me know what topics I should cover in the future till then thanks for following the blog till here.

Happy Coding :D