Signature Pad Component - Appears to cut off text

I recently bought the Signature Pad component and have been having issues with how it displays on any device. The text that says "Sign Here" appears to be cut off and the X is going into the signature line (See attached screenshot). Anyone else running into this issue? Any workarounds? The documentation included isn't very helpful.

Thanks!

Posts

  • I'm having the same problem. This is running on a Galaxy S3

  • RobCrossleyRobCrossley USMember ✭✭✭

    Glad I'm not the only one experiencing this.

    The odd thing is that it looks perfectly fine on older devices. I tried it on an HTC Inspire and it looked just fine. I guess I should have noted in my original post that I get this result when I use the default code provided as an example:

    using SignaturePad;
    ...
    
    protected override void OnCreate (Bundle bundle)
    {
        base.OnCreate (bundle);
    
        var signature = new SignaturePadView (this);
        AddContentView (signature,
            new ViewGroup.LayoutParams (ViewGroup.LayoutParams.FillParent, ViewGroup.LayoutParams.FillParent));
    }
    

    Thanks!

  • MikeHannafordMikeHannaford USMember
    edited May 2017

    I think I solved the issue, but not 100% sure what what I am doing worked.

    I looked into the component itself; specifically at the "sample" provided. I assume the component adds the same view to your application when you call new SignaturePadView, so I copied the sample code directly into the application instead of calling it and it seemed to work!

    XML:

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:minWidth="25px"
        android:minHeight="25px"
        android:background="#ff777777">
      <SignaturePad.SignaturePadView
          android:id="@+id/signatureView"
          android:layout_width="fill_parent"
          android:layout_height="fill_parent"
          android:layout_marginLeft="10dp"
          android:layout_marginTop="10dp"
          android:layout_marginRight="10dp"
          android:layout_marginBottom="70dp" />
      <Button
          android:id="@+id/btnSave"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="Save"
          android:layout_marginLeft="10dp"
          android:layout_marginRight="10dp"
          android:layout_alignParentBottom="true"
          android:layout_alignParentLeft="true"
          android:layout_marginBottom="10dp" />
      <Button
          android:id="@+id/btnLoad"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="Load"
          android:layout_marginLeft="10dp"
          android:layout_marginRight="10dp"
          android:layout_alignParentBottom="true"
          android:layout_alignParentRight="true"
          android:layout_marginBottom="10dp" />
    </RelativeLayout>
    

    and the CS File:

        public class GetSignature : Activity
        {
            System.Drawing.PointF[] points;
    
            protected override void OnCreate(Bundle bundle)
            {
                base.OnCreate(bundle);
    
    
                // Set our view from the "main" layout resource
                SetContentView(Resource.Layout.signatureview);
    
                SignaturePadView signature = FindViewById<SignaturePadView>(Resource.Id.signatureView);
    
                // Get our button from the layout resource,
                // and attach an event to it
                Button btnSave = FindViewById<Button>(Resource.Id.btnSave);
                btnSave.Click += delegate
                {
                    if (signature.IsBlank)
                    {//Display the base line for the user to sign on.
                        AlertDialog.Builder alert = new AlertDialog.Builder(this);
                        alert.SetMessage("No signature to save.");
                        alert.SetNeutralButton("Okay", delegate { });
                        alert.Create().Show();
                    }
                    points = signature.Points;
                };
                btnSave.Dispose();
    
                Button btnLoad = FindViewById<Button>(Resource.Id.btnLoad);
                btnLoad.Click += delegate
                {
                    if (points != null)
                        signature.LoadPoints(points);
                };
                btnLoad.Dispose();
            }
        }
    }
    

    Once that's there you should be able to do whatever you want with the "Save" button. Hope this helps!

  • RobCrossleyRobCrossley USMember ✭✭✭

    Fantastic! I'll give it a shot. Thanks for looking at this!

  • mattleibowmattleibow ZAXamarin Team Xamurai

    I just wanted to mention 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 some brand new features that should make processing and customizing the signatures far easier. For example, you can now access all of the sub-views of the signature pad. And, changing the fonts (or fonts on high resolution displays) should adjust the layout correctly. In addition, you can now get the individual Points and Lines with the properties, as well as use GetImage and GetImageStreamAsync to get a native Bitmap or encoded Stream respectively.

Sign In or Register to comment.