Events and Methods in .NET MAUI SignaturePad

21 Jul 20265 minutes to read

This section covers the events and methods exposed by the .NET MAUI SignaturePad control:

  • Events
    • DrawStarted
    • DrawCompleted
  • Methods
    • GetSignaturePoints
    • ToImageSource
    • Clear

Prerequisites

Before using the SfSignaturePad, ensure the following NuGet package is installed in your .NET MAUI project:

  • Syncfusion.Maui.SignaturePad

For a step-by-step setup, refer to the Getting Started documentation.

Events

The SfSignaturePad control raises the following events to notify you of user interaction with the pad.

DrawStarted

The DrawStarted event is raised when the user starts a new stroke on the SignaturePad. The event handler receives a CancelEventArgs instance. Set e.Cancel to true to cancel the stroke before it is drawn.

<signaturePad:SfSignaturePad DrawStarted="OnDrawStarted" />
SfSignaturePad signaturePad = new SfSignaturePad();
signaturePad.DrawStarted += OnDrawStarted;
this.Content = signaturePad;

private void OnDrawStarted(object? sender, CancelEventArgs e)
{
    // Cancel the stroke so it is not drawn.
    e.Cancel = true;
}

DrawCompleted

The DrawCompleted event is raised when the user completes a stroke on the SfSignaturePad. The event handler receives an EventArgs instance.

<signaturePad:SfSignaturePad DrawCompleted="OnDrawCompleted" />
SfSignaturePad signaturePad = new SfSignaturePad();
signaturePad.DrawCompleted += OnDrawCompleted;
this.Content = signaturePad;

private void OnDrawCompleted(object? sender, EventArgs e)
{
    // Handle the completed stroke here.
}

Methods

The SfSignaturePad control exposes the following methods for reading, exporting, and clearing signature data.

GetSignaturePoints

The GetSignaturePoints() method retrieves the points of every stroke drawn on the SignaturePad. It returns a List<List<float>> where each inner list represents the points of a single stroke in the order they were drawn. Coordinates are returned in the SignaturePad’s local coordinate space, with the origin (0, 0) at the top-left corner of the pad.

<signaturePad:SfSignaturePad x:Name="signaturePad"
                             StrokeColor="Red"
                             MinimumStrokeThickness="1"
                             MaximumStrokeThickness="6"
                             DrawCompleted="OnDrawCompleted" />
SfSignaturePad signaturePad = new SfSignaturePad()
{
    StrokeColor = Colors.Red,
    MinimumStrokeThickness = 1,
    MaximumStrokeThickness = 6,
};
signaturePad.DrawCompleted += OnDrawCompleted;
this.Content = signaturePad;

private void OnDrawCompleted(object? sender, EventArgs e)
{
    List<List<float>> pointsCollection = signaturePad.GetSignaturePoints();
}

ToImageSource

Use the ToImageSource() method to save the signature drawn on the SfSignaturePad as a ImageSource. The method returns a nullable ImageSource?; if the pad is empty, null is returned. The resulting ImageSource can be assigned to an Image control, exported to a file, or shared with other applications.

<VerticalStackLayout>
    <signaturePad:SfSignaturePad x:Name="signaturePad" />
    <Button Text="Save"
            Clicked="OnSaveButtonClicked" />
</VerticalStackLayout>
SfSignaturePad signaturePad = new SfSignaturePad();
Button saveButton = new Button { Text = "Save" };
saveButton.Clicked += OnSaveButtonClicked;
this.Content = new VerticalStackLayout { signaturePad, saveButton };

private void OnSaveButtonClicked(object? sender, EventArgs e)
{
    ImageSource? source = signaturePad.ToImageSource();
    if (source is not null)
    {
        // Use the image source, for example, assign it to an Image control.
    }
}

Clear

The Clear() method removes every stroke from the SignaturePad. The method is a no-op when the pad is already empty.

<VerticalStackLayout>
    <signaturePad:SfSignaturePad x:Name="signaturePad" />
    <Button Text="Clear"
            Clicked="OnClearButtonClicked" />
</VerticalStackLayout>
SfSignaturePad signaturePad = new SfSignaturePad();
Button clearButton = new Button { Text = "Clear" };
clearButton.Clicked += OnClearButtonClicked;
this.Content = new VerticalStackLayout { signaturePad, clearButton };

private void OnClearButtonClicked(object? sender, EventArgs e)
{
    signaturePad.Clear();
}

See Also