Controlled Mode

By default, the Signature is in an uncontrolled state.

The Signature provides options for:

• Controlling its value
• Controlling its popup state

Controlling the Value

The value of the Signature is a string containing an image encoded as a Data URL.

To manage the value of the Signature:

1. Use its value property.
2. Handle the onChange event.
3. Pass the new value through the props.

Export Resolution

The Signature allows you to control the resolution of the exported image using the exportScale property. When set to 1, the exported image will match the element size on screen. We recommend using the default value of 2 or higher to improve the quality on high-resolution screens and print.

The following example demonstrates how to set the export scale.

Import Scaling

The Signature scales any images provided as a value to the dimensions of the component. Use images with the same aspect ratio and resolution to avoid distortion.

Controlling the Popup State

To manage the popup and set the open state of the Signature, use its open property.

The following example demonstrates how to control the state of the Signature upon display.

Suggested Links

• API Reference of the Signature