Signature Pad 2.0!

I just wanted to announce that we have a brand new release of SignaturePad. You should now be able to get the latest (v2.0) on NuGet with all it's improvements: https://www.nuget.org/packages/Xamarin.Controls.SignaturePad.Forms/ and https://www.nuget.org/packages/Xamarin.Controls.SignaturePad/

There are some release notes here: https://github.com/xamarin/SignaturePad/releases/tag/v2.0

This has been re-designed and re-architected from the ground up to make all platforms more consistent and customizable. Not only have all the native views (iOS/Android/WP8/UWP) be reworked for the better, but now the Xamarin.Forms views also have the same level of features and customization.

You can now access all the points in a 1D array using the Points property and a series of strokes as a 2D array of points usng the Strokes property. To get a finely-tuned, platform-specific image, you can use the GetImage method. In addition, you can get a PNG or JPEG encoded image using the GetImageStreamAsync method. Not only are these features available on all the platforms, they at accessible in Xamarin.Forms as well.

With regards to customization, you can access all the various views of the signature pad using the various properties. And, there are also a few convenience properties to access specific parts of the subviews. For example, you can access the SignatureLine view to manipulate various properties, such as color or height. But for convenience, you can also just use the SignatureLineColor property directly. All these features are available in both the native and forms views. And, if you are using the native views, they are available from the designers!

If you need some signature view in your app, but don't want to have to hide all the subviews on the default signature view, you can now just use the new SignaturePadCanvasView. This view has all the features of the full signature pad, except that is has no subviews. This allows for a fully chrome-less UI that you can use anywhere. And, you are not restricted in any way, because you can access all the properties and methods for creating, processing and encoding the signatures.

Give the new SignaturePad a go and let us know how you find it. You can leave comments here. If you have any suggestions or requests, be sure to open an issue on the repository: https://github.com/xamarin/SignaturePad/issues. We also will look at all pull requests and try to get them in for all the developers out there.

Posts

  • JybeeJybee FRMember

    HI !
    I can not implement it, version 2.1.

    My error is : System.MissingMethodException: Default constructor not found for type Xamarin.Controls.SignaturePadView

    thank you.

  • DaveCarsonDaveCarson GBUniversity ✭✭✭

    Hi @mattleibow - and chance you can shed some light on my Signature Pad issue - https://forums.xamarin.com/discussion/98486/broken-strokes-in-signature-pad-ios?

    Any pointers appreciated

  • RodyRody USMember ✭✭

    @mattleibow I am having an issue with 2.1.1 on both iOS and Android where the points returned are missing sections if signing too fast. When I sign at a slower pace the points for the line drawn are complete but when I sign faster as someone would normally do, the points returned from the SignaturePad are missing sections. When I display it the line looks all cut up. The weird thing is that the lines shown in the SignaturePad itself where the signature is captured looks complete. On version 1.3.8 it works fine though.

  • mattleibowmattleibow ZAXamarin Team Xamurai

    @Rody, Are you able to test with v2.0? I added some optimizations in v2.1 to reduce the number of points.
    https://github.com/xamarin/SignaturePad/releases/tag/v2.1

    It may be that, but could you attach a screenshot of the strokes when drawing, and then the loaded strokes. Also, what happens if you get the image from the view using GetImage(...)?

  • RodyRody USMember ✭✭

    I just tried it with 2.0 and am getting the same thing. I attached the images of three lines:
    Top Line - Different speeds - slow, fast, slow
    Middle Line - Fast speed
    Bottom - Slow speed

  • DonovanJarquinDonovanJarquin USMember

    como puedo hacer para guardar una imagen de la firma una imagen png o jpg real? por favor agradeceria mucho la ayuda

  • mattleibowmattleibow ZAXamarin Team Xamurai

    @Rody - I have never seen that before... Are you sure you aren't putting something above the lines in some cases? Does this sample work for you?
    https://github.com/mattleibow/SignaturePadDemo

    I think I need a bit more information before I can say anything useful.

  • mattleibowmattleibow ZAXamarin Team Xamurai

    @DonovanJarquin - you can save the image of the signature using the GetImage and GetImageStreamAsync methods. GetImage will return the native bitmap, and the GetImageStreamAsync will return a stream with an encoded png/jpeg image.

  • DonovanJarquinDonovanJarquin USMember

    @Mattleibow - muchas gracias ya le llegue a como utilizar el GetImageStreamAsync() ya que solo hay que convertirlo y mostrarlo, todavía no lo accedo desde una web pero espero que sea igual de fácil que acceder lo en el teléfono

  • RodyRody USMember ✭✭

    I just wanted to post an update on the issue I was having. It turns out that it was an issue with the custom control I was using to display the signatures from points. The actual Signature capture was working 100% and was a whole lot better than version 1.38 as far as efficiency goes.

    if (Math.Abs(currentPoint.X - nextPoint.X) > 30 || Math.Abs(currentPoint.Y - nextPoint.Y) > 30)
    {
    path.MoveTo(nextPoint.X, nextPoint.Y);
    currentPoint = nextPoint;
    }
    else
    {
    path.LineTo(nextPoint.X, nextPoint.Y);
    currentPoint = nextPoint;
    }

    The number I was using before was too low (5), but after changing it to 30 it worked great.

Sign In or Register to comment.