How to create an Electronic Signature Capture in Android using Basic4Android

Good day! This is my other tutorial on Android creating a Signature Capture using Basic4Android. An electronic signature is any electronic means that indicates either that a person adopts the contents of an electronic message, or more broadly that the person who claims to have written a message is the one who wrote it and that the message received is the one that was sent. By comparison, a signature is a stylized script associated with a person. In commerce and the law, a signature on a document is an indication that the person adopts the intentions recorded in the document. Thus, creating this electronic signature that can capture of what you entered will be an advantage to the people. On this, you need to create one panel and named it as "Panel1", two buttons named btnClear and btnSave. Next, named your abstract design as "1". Your abstract designer will be like this one below: Abstract Design Signature Declare your variable in the Sub_Global like this:
  1. Sub Globals
  2.         Dim Panel1 As Panel
  3.         Dim Canvas1 As Canvas
  4.         Dim SD As SignatureData 'This object holds the data required for SignatureCapture
  5. End Sub

Note:

Dim SD As SignatureData holds the data required for SignatureCapture. First, we will have to create another module named SignatureCapture as our Code Module aside from our Main Activity Module. Write the following code below in the created Code Module.
  1. Sub Process_Globals
  2.         Dim px, py As Int
  3.         Type SignatureData (Canvas As Canvas, Panel As Panel, SignatureColor As Int, SignatureWidth As Int)
  4. End Sub
  5.  
  6. Sub Panel_Touch(SD As SignatureData, x As Int,y As Int, Action As Int)
  7.         If Action = 0 Then 'mouse down constant
  8.                 px = x
  9.                 py = y
  10.         Else
  11.                 SD.Canvas.DrawLine(px, py, x, y, SD.SignatureColor, SD.SignatureWidth)
  12.                 SD.Panel.Invalidate
  13.                 px = x
  14.                 py = y
  15.         End If
  16. End Sub
  17. Sub Clear(SD As SignatureData)
  18.         SD.Canvas.DrawColor(Colors.White)
  19.         SD.Panel.Invalidate
  20. End Sub
  21. Sub Save(SD As SignatureData, Dir As String, Name As String)
  22.         Dim out As OutputStream
  23.         out = File.OpenOutput(Dir, Name, False)
  24.         SD.Canvas.Bitmap.WriteToStream(out, 100, "PNG")
  25.         out.Close
  26. End Sub

Note:

In our Sub Panel_Touch(SD As SignatureData, x As Int,y As Int, Action As Int) procedure, we make our signature that can be inputted with a canvas to draw a line with a black color. In our Sub Save(SD As SignatureData, Dir As String, Name As String) we put it in this procedure that we save the created signature in File Directory in the SD Card and put as an image of .png extension. In our Sub Clear(SD As SignatureData), we clear the value of our inputted signature in the panel. Now create our Main Activity. Type the following code below:
  1. Sub Activity_Create(FirstTime As Boolean)
  2.         Activity.LoadLayout("1")
  3.         Canvas1.Initialize(Panel1)
  4.        
  5.         SD.Initialize
  6.         SD.Canvas = Canvas1
  7.         SD.Panel = Panel1
  8.         SD.SignatureColor = Colors.Black
  9.         SD.SignatureWidth = 5dip 'Stroke width
  10. End Sub

Note:

SD.Panel = Panel1 - this syntax holds the signature input in the Panel1. SD.SignatureColor = Colors.Black - this syntax turns the Signature color in Black. SD.SignatureWidth = 5dip - this syntax turns the Signature stroke in 5dip. Now your activity when run will look like this: First run signature Now type the folllowing code below:
  1. Sub Panel1_Touch (Action As Int, X As Float, Y As Float)
  2.         SignatureCapture.Panel_Touch(SD, X, Y, Action)
  3. End Sub
  4. Sub btnSave_Click
  5.         SignatureCapture.Save(SD, File.DirRootExternal, "sign.png")
  6.         ToastMessageShow("Signature saved to: " & File.Combine(File.DirRootExternal, "sign.png"), True)
  7.         'The next line will load the image and set it as the activity background.
  8.         Activity.SetBackgroundImage(LoadBitmap(File.DirRootExternal, "sign.png"))
  9. End Sub
  10. Sub btnClear_Click
  11.         SignatureCapture.Clear(SD)
  12. End Sub

Note:

We already call the value in our Code Module to the specific buttons with their certain functions. Now, you can write your signature in the panel and will look like this. this is just an example of my signature. writing signature Then click the Save button and it will save in the SD card and then it will set as your Activity Background like this one below. Save Signature Download the source code below and try it! :) For more inquiries and need programmer for your thesis systems in any kind of programming languages, just contact my number below. Best Regards, Engr. Lyndon R. Bermoy IT Instructor/System Developer/Android Developer STI College - Surigao City Mobile: 09488225971 E-mail:[email protected] Follow and add me in my Facebook Account: https://www.facebook.com/donzzsky

Comments

دمت گرم آقای دانبرموی

Thanks for this great article, how can make the final .png transparent ?

Add new comment