Interface ISignature

All Superinterfaces:
IAnyGroup<ISignature>, IComponent<ISignature>, IHtmlBasedComponent<ISignature>, IXulElement<ISignature>

public interface ISignature extends IXulElement<ISignature>, IAnyGroup<ISignature>
Immutable Signature component.

A signature pad for user to sign a signature on it with save, undo, clear method.

Support @Action

Name Action Type
onSave ActionData: FileData
When user invoke the save method, the action would be triggered.
onClear When user invoke the clear method, the action would be triggered.

Example

Buttons

There are 3 buttons when you hover on this component: (from left to right)

  1. undo: to remove the last step that was drawn on the signature pad.
  2. save: to save the signature image to the server, a user can get the image by listening onSave event.
  3. clear: to clear signature pad.

Toolbar Visible

The toolbar contain three buttons: undo button, clear button and save button, it is enabled by default. If you don't want to show the toolbar, please use the following API to hide it.

.withToolbarVisible(false)

The toolbar button only contains icon by default. If you want to show message after icons on the button, we provide three attributes: undoLabel, clearLabel, and saveLabel.

Default:

Customized:

 
 ISignature.DEFAULT.withUndoLabel("Undo").withClearLabel("Clear").withSaveLabel("Save");
 
 

Upload

After calling save method, the signature will be uploaded to server. You can listen onSave action to get the uploaded image and integrate with IImage.

For example:

 @RichletMapping("/example/upload")
 public IComponent uploadExample() {
     return IVlayout.of(
         ISignature.ofSize("600px", "300px").withAction(this::doUpload), IImage.ofId("image"));
 }

 @Action(type= Events.ON_SAVE)
 public void doUpload(UiAgent uiAgent, FileData data) {
     uiAgent.smartUpdate(Locator.ofId("image"), new IImage.Updater().content((AImage) data.getMedia()));
 }
 
Author:
katherine
See Also:
  • Signature
  • Field Details

    • DEFAULT

      static final ISignature DEFAULT
      Constant for default attributes of this immutable component.
  • Method Details

    • getWidgetClass

      default String getWidgetClass()
      Returns the client widget class.

      Default: "zkmax.signature.Signature"

      Specified by:
      getWidgetClass in interface IComponent<ISignature>
      Returns:
    • getBackgroundImage

      @Nullable String getBackgroundImage()
      Returns the background image URI of signature pad.

      Default: null.

    • withBackgroundImage

      ISignature withBackgroundImage(@Nullable String backgroundImage)
      Returns a copy of this immutable component with the specified backgroundImage.

      Sets the background image URI of signature pad.

      Parameters:
      backgroundImage - The background image URI of signature pad

      Default: null.

      Returns:
      A modified copy of the this object
    • getUndoLabel

      @Nullable String getUndoLabel()
      Returns the label on undo button.

      Default: null.

    • withUndoLabel

      ISignature withUndoLabel(@Nullable String undoLabel)
      Returns a copy of this immutable component with the specified undoLabel.

      Sets the label on undo button.

      Parameters:
      undoLabel - The label on undo button.

      Default: null.

      Returns:
      A modified copy of the this object
    • getSaveLabel

      @Nullable String getSaveLabel()
      Returns the label on save button.

      Default: null.

    • withSaveLabel

      ISignature withSaveLabel(@Nullable String saveLabel)
      Returns a copy of this immutable component with the specified saveLabel.

      Sets the label on save button.

      Parameters:
      saveLabel - The label on save button.

      Default: null.

      Returns:
      A modified copy of the this object
    • getClearLabel

      @Nullable String getClearLabel()
      Returns the label on clear button.

      Default: null.

    • withClearLabel

      ISignature withClearLabel(@Nullable String clearLabel)
      Returns a copy of this immutable component with the specified clearLabel.

      Sets the label on clear button.

      Parameters:
      clearLabel - The label on save button.

      Default: null.

      Returns:
      A modified copy of the this object
    • getPenSize

      default int getPenSize()
      Returns the pen size of the signature pad.

      Default: 1.

    • withPenSize

      ISignature withPenSize(int penSize)
      Returns a copy of this immutable component with the specified penSize.

      Sets the pen size of the signature pad.

      Parameters:
      penSize - The pen size of the signature pad.

      Default: 1.

      Returns:
      A modified copy of the this object
    • getPenColor

      default String getPenColor()
      Returns the pen color of the signature pad.

      Default: "black".

    • withPenColor

      ISignature withPenColor(String penColor)
      Returns a copy of this immutable component with the specified penColor.

      Sets the pen color of the signature pad.

      Parameters:
      penColor - The pen color of the signature pad.

      Default: "black".

      Returns:
      A modified copy of the this object
    • getBackgroundColor

      default String getBackgroundColor()
      Returns the background color of the signature pad.

      Default: "white".

    • withBackgroundColor

      ISignature withBackgroundColor(String backgroundColor)
      Returns a copy of this immutable component with the specified backgroundColor.

      Sets the background color of the signature pad.

      Parameters:
      backgroundColor - The background color of the signature pad.

      Default: "white".

      Returns:
      A modified copy of the this object
    • getSaveType

      default String getSaveType()
      Returns the type for saving signature image. The supported type is MIME type, e.g., "image/png", "image/jpeg". If the requested type is invalid or unspecified, it will use "image/png". Default: "image/png".
    • withSaveType

      ISignature withSaveType(String saveType)
      Returns a copy of this immutable component with the specified saveType.

      Sets the type for saving signature image. The supported type is MIME type, e.g., "image/png", "image/jpeg". If the requested type is invalid or unspecified, it will use "image/png".

      Parameters:
      saveType - The type for saving signature image.

      Default: "image/png".

      Returns:
      A modified copy of the this object
    • isBackgroundIncluded

      default boolean isBackgroundIncluded()
      Returns whether the background color and image are included while saved.

      Default: true.

    • withBackgroundIncluded

      ISignature withBackgroundIncluded(boolean backgroundIncluded)
      Returns a copy of this immutable component with the specified backgroundIncluded.

      Sets whether the background color and image are included while saved.

      Parameters:
      backgroundIncluded - Whether the background color and image are included while saved

      Default: true.

      Returns:
      A modified copy of the this object
    • isToolbarVisible

      default boolean isToolbarVisible()
      Returns the visibility of the toolbar for signature pad.

      Default: true.

    • withToolbarVisible

      ISignature withToolbarVisible(boolean toolbarVisible)
      Returns a copy of this immutable component with the specified toolbarVisible.

      Sets the visibility of the toolbar for signature pad.

      Parameters:
      toolbarVisible - The visibility of the toolbar for signature pad.

      Default: true.

      Returns:
      A modified copy of the this object
    • ofSize

      static ISignature ofSize(String width, String height)
      Returns the instance with the given size, width and height.
      Parameters:
      width - The width of the component
      height - The height of the component
    • ofId

      static ISignature ofId(String id)
      Returns the instance with the given id.
      Parameters:
      id - The id to identify this component