Android Tutorial Signature Capture Tutorial

Status
Not open for further replies.
Several developers were interested in adding support for signature capturing in their Android application.
The attached code module makes it easy to capture the signature and save it to a file.

signaturecapture_1.png


You should create a layout similar to the above layout.
The drawing is done on a Panel view.

Load the layout (or create it programmatically), initialize the canvas object which does the actual drawing and initialize the SignatureData object:
B4X:
Sub Globals
    Dim Panel1 As Panel
    Dim Canvas1 As Canvas
    Dim SD As SignatureData 'This object holds the data required for SignatureCapture
End Sub

Sub Activity_Create(FirstTime As Boolean)
    Activity.LoadLayout("1")
    Canvas1.Initialize(Panel1)
    SD.Initialize
    SD.Canvas = Canvas1
    SD.Panel = Panel1
    SD.SignatureColor = Colors.Black
    SD.SignatureWidth = 5dip 'Stroke width
End Sub
Add events for the panel Touch event and for the buttons. These events call the SignatureCapture module.
B4X:
Sub Panel1_Touch (Action As Int, X As Float, Y As Float)
    SignatureCapture.Panel_Touch(SD, x, y, Action)
End Sub
Sub btnSave_Click
    SignatureCapture.Save(SD, File.DirRootExternal, "sign.png")
    ToastMessageShow("Signature saved to: " & File.Combine(File.DirRootExternal, "sign.png"), True)
End Sub
Sub btnClear_Click
    SignatureCapture.Clear(SD)
End Sub
That's it.
 

Attachments

  • SignatureCapture.zip
    6.4 KB · Views: 4,037

Beja

Expert
Licensed User
Longtime User
Thanks Erel,
Don't know how I didn't consider this.
 

padvou

Active Member
Licensed User
Longtime User
How could I create an eraser to erase drawn stuff when I touch an area on the panel? and maybe even moving the finger on the touch screen, erasing anything under it.
 

AHilberink

Active Member
Licensed User
Longtime User
Hi,

Is it possible to check if the signature is empty? I mean no Signature?

Best regards,
André
 

Sam H

Member
Licensed User
Longtime User
This looks really simple but I'm still having trouble with it.

I am trying to get it working without using the designer, which is where I am having problems.

I added some code in an attempt to recreate the creation of the panel and canvas that the design view was doing.

I am having lots of errors and don't known whether to initialise the panel or canvas first or which to add to the activity and that sort of thing.

This is what I have so far.

B4X:
Sub Globals
    'These global variables will be redeclared each time the activity is created.
    'These variables can only be accessed from this module.
  

    Dim Panel1 As Panel
    Dim Canvas1 As Canvas
    Dim SD As SignatureData 'This object holds the data required for SignatureCapture
 
End Sub

Sub Activity_Create(FirstTime As Boolean)
   
    Panel1.Initialize("Panel")
    Panel1.Color = Colors.Gray
   
    Canvas1.Initialize(Panel1)
   
    Activity.AddView(Panel1, 20%x, 20%y, 60%x, 40%y)

    SD.Initialize
    SD.Canvas = Canvas1
    SD.Panel = Panel1
    SD.SignatureColor = Colors.Black
    SD.SignatureWidth = 5dip 'Stroke width

End sub

Thanks in advance.


Sam
 

Roberto P.

Well-Known Member
Licensed User
Longtime User
what is the best way to open an existing image (long) in a canvas to add your signature?

with this code

B4X:
    mPath                =    aPath
    mFileName     = aFileName
   
    Dim aAltezza, aLarghezza As Int
   
    bmp.Initialize(mPath, mFileName)


    If bmp.Height >  bmp.Width Then
        aAltezza        =    bmp.Height
        aLarghezza    =    bmp.Width
    Else
        aAltezza        =    bmp.Width
        aLarghezza    =    bmp.Height
    End If
       
    Dim aRect As Rect
    aRect.Initialize(1dip, 3dip, aAltezza ,  aLarghezza)

    mCanvasFirma.DrawBitmap(bmp, Null, aRect)

the image is deformed.
thanks
 

gapi

Active Member
Licensed User
Longtime User
How can I get the final transparent image rather than the white background? thanks
 

hatzisn

Well-Known Member
Licensed User
Longtime User
I suppose, you will have to set the panel color to Colors.Transparent and save it as .PNG
 
Status
Not open for further replies.
Top