Skip to content

FreakySignatureView's

Gulam Ali H edited this page Nov 11, 2023 · 11 revisions

Inspired by https://github.com/xamarin/SignaturePad

Our SignatureViews make capturing, saving, exporting, and displaying signatures extremely simple on .net Maui.

FreakySignatureCanvasView

FreakySignatureCanvasView is a View that you can use to create a Canvas which can be used to capture signatures. It's more of just a canvas rather than a full-fledged control, if you want to create your own control that handles signatures then this is the one you want to use.

An example of its usage is our FreakySignaturePadView which can be found here but if you want to use the default version it has its section of documentation

Properties:

  • IsBlank: Of type bool, gets if the Signature View is blank.

  • StrokeWidth: Of type float, gets and sets the Width of the Signature Strokes.

  • StrokeColor: Of type Color, gets and sets the Color of the Signature Strokes.

  • Points: Of type IEnumerable<Maui.Graphics.Point>, gets and sets the Points of your Signature Strokes.

  • Strokes: Of type IEnumerable<IEnumerable<Maui.Graphics.Point>>, gets and sets the Strokes drawn on your SignatureView.

  • ClearedCommand: Of type ICommand, defines the command that will be invoked when you Invoke the Clear method to clear the SignatureView.

  • StrokeCompletedCommand: Of type ICommand, defines the command that will be invoked when a Stroke is completed on your SignatureView.

Methods:

  • GetImageStreamAsync: Gets the Image of your Current SignatureView as a Stream, There are multiple overrides of this method that can be found, The only mandatory field that you need to provide is SignatureImageFormat the options are Png or Jpeg. Other arguments for this method are as follows:

    1. shouldCrop: If the extra parts of the SignatureView get cropped out of the image, the default is true.
    2. keepAspectRatio: Maintain the AspectRatio as shown on the screen, the default is true.
    3. size: Specifies the Size of the Image that will be sized accordingly.
    4. scale: Specifies the Scale of the Image that will be scaled accordingly.
    5. strokeColor: If you want to specify a different Stroke Color for your captured Image. (This will override the Color you have set in your SignatureView control).
    6. fillColor: If you want to specify a different Background Color for your captured Image. (This will override the Color you have set in your SignatureView control).
    7. settings: If you want to specify all the above-mentioned arguments then this is the class for you, Create a new object of the following class and you can use all the above-mentioned arguments.
  • Clear: Clear all the drawn strokes on the current SignatureView.

Events:

  • Cleared: An event which is triggered when your call to Clear() has now cleared your SignatureView.

  • ClearRequested: An event which is triggered when you call Clear() on your SignatureView.

  • StrokeCompleted: An event which is triggered when a stroke is completed on your SignatureView.

  • ImageStreamRequested: An event which is triggered when you request an Image through GetImageStreamAsync.

  • IsBlankRequested: An event which is triggered when you request to check the IsBlank property.

  • PointsRequested: An event which is triggered when you request the Points of your SignatureView.

  • PointsSpecified: An event which is triggered when you specify the Points of your SignatureView.

  • StrokesRequested: An event which is triggered when you request the Strokes of your SignatureView.

  • StrokesSpecified: An event which is triggered when you specify the Strokes of your SignatureView.

FreakySignaturePadView

FreakySignaturePadView is a full-fledged signature control based on FreakySignatureCanvasView that you can use to capture signatures. All the properties and methods of FreakySignatureCanvasView are also present here (events are not included), there are some additional APIs as mentioned below.

Properties:

  • CaptionText: Of type string, Gets or sets the text for the caption displayed under the signature Underline.

  • CaptionFontSize: Of type double, Gets or sets the font size of the caption.

  • CaptionTextColor: Of type Color, Gets or sets the colour of the caption text.

  • CaptionFontFamily: Of type string, Gets or sets the font family for the caption text.

  • SignatureUnderlineColor: Of type Color, Gets or sets the colour of the signature line.

  • SignatureUnderlineWidth: Of type double, Gets or sets the width of the signature line.

  • ClearImageColor: Of type Color, Gets or sets the Color of the image that clears the pad when clicked.

  • ClearImageAssembly: Of type Assembly, specify the Assembly for your ResourceId.

  • ClearResourceId: Of type string, specifies the source of the SVG image. A default clear button exists if you keep this field empty.

  • ClearImageBase64: Of type string, specifies the Base64 source of the SVG image.

  • BackgroundImage: Of type ImageSource, Gets or sets the background image for your signature pad.

  • BackgroundImageAspect: Of type Aspect, Gets or sets the aspect for the background image.

  • BackgroundImageOpacity: Of type double, Gets or sets the transparency of the background image.

  • ClearHeightRequest: Of type double, Gets or sets the height of the clear button.

  • ClearWidthRequest: Of type double, Gets or sets the width of the clear button.

Clone this wiki locally