The SignatureField extension for Sencha Touch 2.x extends Ext.field.Field and provides the ability to draw signatures via canvas. The outputted value is a base64 encoded string. The extension also includes an Android work around for devices < 3.0. Specifically, the Android developers decided not to build the toDataURL function into android until version 3.0.
I did not include the Sencha Touch source files in the example application folder. To use the example application, first copy the SignatureField source to the example's root directory.
Now copy the touch folder to the root of the SenchaTouchExample application.
You can easily get a copy of the touch folder via command line by creating a sample application with Sencha CMD. Make sure you are using the Sencha Touch framework folder and run the following command via Sencha CMD:
sencha generate app TestApp \path\to\generate\app
Once the generic application has been generated by Sencha CMD, copy the touch folder to the example application root.
Note: The example application was generated using Sencha Touch 2.3.1
Step 1) Copy the SignatureField folder to the root of your Sencha Touch application.
Step 2) Add a requires to SignatureField in your app.js file (or the direct view that uses it)
requires: [
'SignatureField.SignatureField'
]
Step 3) If you want to compile with Sencha CMD, make sure to update the app.classpath in your sencha.cfg file and add ${app.dir}/SignatureField
sencha.cfg is located in ".sencha/app/sencha.cfg"
Example: app.classpath=${app.dir}/app.js,${app.dir}/app,${app.dir}/SignatureField
The SignatureField class extends Ext.field.Field making standard field methods available. For example, methods such as getValue and SetValue are all viable.
SignatureField.SignatureField (xtype: signaturefield)
sigWidth
The width of the signature canvas element
sigHeight
The height of the signature canvas element
setSigWidth
Updates the signature canvas width
setSigHeight
Updates the signature canvas height