Skip to content

Interface: SignatureInkViewNativeProps ​

Extends ​

  • ViewProps

Properties ​

PropertyTypeDescription
baselineColor?____ColorValue_InternalBaseline color.
baselineOffsetFromBottom?numberDistance in points/dp from the baseline to the canvas bottom. Only used when the built-in toolbar is hidden; otherwise the baseline auto-anchors to the toolbar's top edge for symmetric icon gaps.
baselineStyle?WithDefault<string, "dashed">Baseline line style: 'solid', 'dashed' (default), or 'dotted'. Unrecognised values fall back to 'dashed'.
baselineWidth?numberBaseline stroke width in points/dp. 0 (the default) means "use the per-style auto value"; any positive value overrides it.
defaultInkType?WithDefault<string, "pen">Initial PencilKit ink type (iOS only).
inkBackgroundColor?____ColorValue_InternalCanvas background color. Named inkBackgroundColor natively so it doesn't collide with the host backgroundColor Fabric style prop; the high-level wrapper re-maps the public backgroundColor prop onto this name.
onBegin?DirectEventHandler<null>Stroke begin.
onEnd?DirectEventHandler<null>Stroke end.
onReplayProgress?DirectEventHandler<ReplayProgressPayload>Fires every frame while replay() is running.
onResult?DirectEventHandler<ResultPayload>Generic back-channel for Promise-based commands. The JS wrapper matches requestId to a pending Promise.
onStrokesChange?DirectEventHandler<ChangePayload>Drawing content changed (new stroke, undo/redo, clear, setStrokeData). Named onStrokesChange (not onChange) because React Native's core already registers topChange as a bubbling event for TextInput / Switch, which would clobber our payload typing.
onToolbarAction?DirectEventHandler<ToolbarActionPayload>Fires after a built-in toolbar button is tapped.
pencilOnly?WithDefault<boolean, false>iOS: only Apple Pencil input is accepted. Android: only TOOL_TYPE_STYLUS events are accepted.
penColor?____ColorValue_InternalInk color (captured literally on iOS; PencilKit auto-inversion is disabled).
penMaxWidth?numberMaximum stroke width at the slowest pen velocity, in the same density-independent units as penMinWidth. Default: 3.
penMinWidth?numberMinimum stroke width at the fastest pen velocity, in density-independent units (points on iOS, dp on Android). A given value renders at the same physical thickness on both platforms and across all screen densities. Default: 1.
showBaseline?WithDefault<boolean, false>Show the signing baseline.
showToolbar?WithDefault<boolean, false>Render the built-in native toolbar.
showToolPicker?WithDefault<boolean, false>Attach PencilKit's system tool picker (iOS only).
toolbarBackgroundColor?____ColorValue_InternalToolbar background fill.
toolbarHeight?numberToolbar height in points/dp. With auto-anchored baseline, the symmetric vertical gap above/below the icons equals (toolbarHeight - iconVisualHeight) / 2.
toolbarIconSpacing?numberHorizontal gap in points/dp between adjacent toolbar buttons.
toolbarItemsJson?WithDefault<string, "">JSON-serialized array of toolbar item objects (the high-level wrapper maps the public toolbarButtons prop onto this). Each entry is { id, icon?, text?, tintColor?, accessibilityLabel, disabled }, where tintColor is a processed color int. An empty string means "use the default undo/redo/clear/copy toolbar".
toolbarMaxVisibleButtons?WithDefault<number, 0>Hard cap on inline buttons; extras collapse into an overflow menu. 0 means "compute from available width at layout time".
toolbarPosition?WithDefault<string, "bottom">'top'
toolbarTintColor?____ColorValue_InternalToolbar icon tint (SF Symbols on iOS, vector drawables on Android).
velocityFilterWeight?numberAndroid only: velocity smoother weight (0..1). Ignored on iOS.

Released under the MIT License.