SignaturePad
TsgcHTMLComponent_SignaturePad — 渲染基于指针事件的画布签名板,带有清除、撤销和保存操作,适用于 Delphi、C++ Builder 和 .NET。
TsgcHTMLComponent_SignaturePad — 渲染基于指针事件的画布签名板,带有清除、撤销和保存操作,适用于 Delphi、C++ Builder 和 .NET。
一个基于画布的签名板,在客户端捕获 PNG 格式的签名。配置画笔和画布,接入 ShowClear/ShowUndo/UploadURL,然后读取 HTML 属性。
TsgcHTMLComponent_SignaturePad
HTML5 <canvas> 签名板 + PNG data URL
Delphi, C++ Builder, .NET
设置 FieldName、Width/Height 和画笔颜色,可选地设置 UploadURL 以 POST 提交签名,然后读取 HTML。
uses
sgcHTML_Component_SignaturePad;
var
oPad: TsgcHTMLComponent_SignaturePad;
begin
oPad := TsgcHTMLComponent_SignaturePad.Create(nil);
try
oPad.FieldName := 'signature';
oPad.Width := 500;
oPad.Height := 220;
oPad.PenColor := '#1a1a2e';
oPad.PenWidth := 3;
oPad.UploadURL := '/api/signatures/upload';
WebModule.Response := oPad.HTML; // <canvas> + Clear/Undo/Save buttons
finally
oPad.Free;
end;
end;
// includes: sgcHTML_Component_SignaturePad.hpp
TsgcHTMLComponent_SignaturePad *oPad = new TsgcHTMLComponent_SignaturePad(NULL);
try
{
oPad->FieldName = "signature";
oPad->Width = 500;
oPad->Height = 220;
oPad->PenColor = "#1a1a2e";
oPad->PenWidth = 3;
oPad->UploadURL = "/api/signatures/upload";
String html = oPad->HTML; // <canvas> + Clear/Undo/Save buttons
}
__finally
{
delete oPad;
}
using esegece.sgcWebSockets;
var pad = new TsgcHTMLComponent_SignaturePad();
pad.FieldName = "signature";
pad.Width = 500;
pad.Height = 220;
pad.PenColor = "#1a1a2e";
pad.PenWidth = 3;
pad.UploadURL = "/api/signatures/upload";
string html = pad.HTML; // <canvas> + Clear/Undo/Save buttons
您最常使用的成员。
Width(默认 400)和 Height(默认 200)设置 <canvas> 的尺寸;PenColor(#1a1a2e)和 PenWidth(2)设置笔画样式;BackgroundColor(#ffffff)填充签名板。
FieldName(默认 'signature')渲染一个隐藏输入框,内联脚本会在每次落笔后用 PNG data URL 刷新它。
ShowClear 和 ShowUndo(均默认 True)添加清除/撤销按钮;ClearCaption 和 UndoCaption 可覆盖其文案,默认回退到当前语言环境。
点击保存时,UploadURL 在客户端 POST 提交 PNG data URL;SaveCaption 自定义该按钮的文本。
ReadOnly 渲染一个静态 <img>(或一个空占位框)而非实时签名板,在设置了 SignatureDataURL 时显示它。
WSSend 将签名板包裹在一个 data-sgc-ws-send 表单中,使签名在提交时推送到服务器,这与 Chat 和 Form 组件使用的机制相同。