You are here: Creating a Signature Using a Constructor: voltmx.ui.SignatureCapture

SignatureCapture Widget

A SignatureCapture widget enables you to capture a signature on a form, and save it as an image for easy uploading.

SignatureCapture widget can be used only in Windows platform.

To use a SignatureCapture widget, follow these steps:

1. From the Project explorer, navigate to the Forms of desired channel type.
2. From the platform selection drop-down, select Windows 8: Native or Windows 8: Web or Desktop: Windows, as required.
3. In the Default Library, click on the search icon. In the search bar, enter SignatureCapture.
4. From the result, drag and drop the SignatureCapture widget onto the form in the canvas.

Following are the real-time use cases of SignatureCapture widget:

• SignatureCapture widget is widely used in uploading signatures while filling job applications.

• To apply for finance to buy a car or a house, you need to fill the loan application, submit the documents of proof, and upload your signature.

• While applying for a Life Insurance policy, you need to upload your signature along with a few documents of proof.

• SignatureCapture widget could be used as a proof of courier delivery.

The SignatureCapture widget capabilities can be broadly categorized into the following:

• Layout
• Animations
• Data Management
• 3D Touch
• User Input
• Enabling RTL
• Miscellaneous
• Configurations Common To All Widgets

Layout

Animations

Data Management

3D Touch

User Input Handling

Enabling RTL

Miscellaneous

Configurations Common To All Widgets

SignatureCapture Widget Basics

Note: This widget is only supported on Windows platform.

Creating a Signature Using a Constructor: voltmx.ui.SignatureCapture

var mysignature = new voltmx.ui.SignatureCapture(basicConf, layoutConf, pspConf);

• basicConf is an object with basic properties.
• layoutConf is an object with layout properties.
• pspConf is an object with platform specific properties.

Note: The configuration properties should be passed only in the respective configuration objects otherwise they are ignored.

Example

//Defining the properties for a SignatureCapture.
var signatureBasic = {
    id: "signature",
    info: {
        key: "signature"
    },
    skin: "signatureSkin",
    isVisible: true,
    penWidth: 3
};

var signatureLayout = {
    hExpand: false,
    vExpand: true,
    widgetAlignment: constants.WIDGET_ALIGN_TOP_LEFT,
    containerWeight: 100
};

//Creating the SignatureCapture.
var signature = new voltmx.ui.SignatureCapture(signatureBasic, signatureLayout, {});

//signature clear method call.
signature.clear();

Customizing Appearance

You can customize the appearance of the SignatureCapture widget using the following properties:

• widgetAlignment: Specifies the alignment of the widget.
• skin: Specify the skin to be applied to the SignatureCapture widget.

Important Considerations

The following are the important considerations for SignatureCapture:

• The padding and margin properties are not applicable for this widget.