Interface ISignature
- All Superinterfaces:
IAnyGroup<ISignature>,IComponent<ISignature>,IHtmlBasedComponent<ISignature>,IXulElement<ISignature>
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)
- undo: to remove the last step that was drawn on the signature pad.
- save: to save the signature image to the server, a user can get the image by listening onSave event.
- 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
-
Nested Class Summary
Nested ClassesModifier and TypeInterfaceDescriptionstatic classBuilds instances of typeISignature.static classBuilds an updater of typeISignatureforUiAgent.smartUpdate(Locator, SmartUpdater). -
Field Summary
FieldsModifier and TypeFieldDescriptionstatic final ISignatureConstant for default attributes of this immutable component. -
Method Summary
Modifier and TypeMethodDescriptiondefault StringReturns the background color of the signature pad.Returns the background image URI of signature pad.Returns the label on clear button.default StringReturns the pen color of the signature pad.default intReturns the pen size of the signature pad.Returns the label on save button.default StringReturns the type for saving signature image.Returns the label on undo button.default StringReturns the client widget class.default booleanReturns whether the background color and image are included while saved.default booleanReturns the visibility of the toolbar for signature pad.static ISignatureReturns the instance with the given id.static ISignatureReturns the instance with the given size, width and height.withBackgroundColor(String backgroundColor) Returns a copy ofthisimmutable component with the specifiedbackgroundColor.withBackgroundImage(String backgroundImage) Returns a copy ofthisimmutable component with the specifiedbackgroundImage.withBackgroundIncluded(boolean backgroundIncluded) Returns a copy ofthisimmutable component with the specifiedbackgroundIncluded.withClearLabel(String clearLabel) Returns a copy ofthisimmutable component with the specifiedclearLabel.withPenColor(String penColor) Returns a copy ofthisimmutable component with the specifiedpenColor.withPenSize(int penSize) Returns a copy ofthisimmutable component with the specifiedpenSize.withSaveLabel(String saveLabel) Returns a copy ofthisimmutable component with the specifiedsaveLabel.withSaveType(String saveType) Returns a copy ofthisimmutable component with the specifiedsaveType.withToolbarVisible(boolean toolbarVisible) Returns a copy ofthisimmutable component with the specifiedtoolbarVisible.withUndoLabel(String undoLabel) Returns a copy ofthisimmutable component with the specifiedundoLabel.Methods inherited from interface org.zkoss.stateless.sul.IComponent
getAction, getActions, getClientAttributes, getId, getMold, getWidgetListeners, getWidgetOverrides, isVisible, withAction, withAction, withAction, withAction, withAction, withAction, withAction, withAction, withAction, withAction, withAction, withActions, withActions, withClientAttribute, withClientAttributes, withId, withMold, withVisible, withWidgetClass, withWidgetListener, withWidgetListeners, withWidgetOverride, withWidgetOverridesMethods inherited from interface org.zkoss.stateless.sul.IHtmlBasedComponent
getClientAction, getDraggable, getDroppable, getHeight, getHflex, getLeft, getRenderdefer, getSclass, getSkeleton, getStyle, getTabindex, getTooltiptext, getTop, getVflex, getWidth, getZclass, getZIndex, isFocus, withClientAction, withDraggable, withDroppable, withFocus, withHeight, withHflex, withLeft, withRenderdefer, withSclass, withSkeleton, withStyle, withTabindex, withTabindex, withTooltiptext, withTop, withVflex, withWidth, withZclass, withZIndexMethods inherited from interface org.zkoss.stateless.sul.IXulElement
getContext, getCtrlKeys, getPopup, getTooltip, withContext, withCtrlKeys, withPopup, withTooltip
-
Field Details
-
DEFAULT
Constant for default attributes of this immutable component.
-
-
Method Details
-
getWidgetClass
Returns the client widget class.Default:
"zkmax.signature.Signature"- Specified by:
getWidgetClassin interfaceIComponent<ISignature>- Returns:
-
getBackgroundImage
Returns the background image URI of signature pad.Default:
null. -
withBackgroundImage
Returns a copy ofthisimmutable component with the specifiedbackgroundImage.Sets the background image URI of signature pad.
- Parameters:
backgroundImage- The background image URI of signature padDefault:
null.- Returns:
- A modified copy of the
thisobject
-
getUndoLabel
Returns the label on undo button.Default:
null. -
withUndoLabel
Returns a copy ofthisimmutable component with the specifiedundoLabel.Sets the label on undo button.
- Parameters:
undoLabel- The label on undo button.Default:
null.- Returns:
- A modified copy of the
thisobject
-
getSaveLabel
Returns the label on save button.Default:
null. -
withSaveLabel
Returns a copy ofthisimmutable component with the specifiedsaveLabel.Sets the label on save button.
- Parameters:
saveLabel- The label on save button.Default:
null.- Returns:
- A modified copy of the
thisobject
-
getClearLabel
Returns the label on clear button.Default:
null. -
withClearLabel
Returns a copy ofthisimmutable component with the specifiedclearLabel.Sets the label on clear button.
- Parameters:
clearLabel- The label on save button.Default:
null.- Returns:
- A modified copy of the
thisobject
-
getPenSize
default int getPenSize()Returns the pen size of the signature pad.Default:
1. -
withPenSize
Returns a copy ofthisimmutable component with the specifiedpenSize.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
thisobject
-
getPenColor
Returns the pen color of the signature pad.Default:
"black". -
withPenColor
Returns a copy ofthisimmutable component with the specifiedpenColor.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
thisobject
-
getBackgroundColor
Returns the background color of the signature pad.Default:
"white". -
withBackgroundColor
Returns a copy ofthisimmutable component with the specifiedbackgroundColor.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
thisobject
-
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
Returns a copy ofthisimmutable component with the specifiedsaveType.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
thisobject
-
isBackgroundIncluded
default boolean isBackgroundIncluded()Returns whether the background color and image are included while saved.Default:
true. -
withBackgroundIncluded
Returns a copy ofthisimmutable component with the specifiedbackgroundIncluded.Sets whether the background color and image are included while saved.
- Parameters:
backgroundIncluded- Whether the background color and image are included while savedDefault:
true.- Returns:
- A modified copy of the
thisobject
-
isToolbarVisible
default boolean isToolbarVisible()Returns the visibility of the toolbar for signature pad.Default:
true. -
withToolbarVisible
Returns a copy ofthisimmutable component with the specifiedtoolbarVisible.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
thisobject
-
ofSize
Returns the instance with the given size, width and height.- Parameters:
width- The width of the componentheight- The height of the component
-
ofId
Returns the instance with the given id.- Parameters:
id- The id to identify this component
-