SignaturePad Component — sgcHTML | eSeGeCe

SignaturePad

TsgcHTMLComponent_SignaturePad — renderizza un pad firma su canvas basato su pointer-events con azioni Clear, Undo e Save, in Delphi, C++ Builder e .NET.

In sintesi

TsgcHTMLComponent_SignaturePad

Un pad basato su canvas che cattura una firma PNG lato client. Configura la penna e il canvas, collega ShowClear/ShowUndo/UploadURL, quindi leggi la proprietà HTML.

Classe del componente

TsgcHTMLComponent_SignaturePad

Renderizza

HTML5 <canvas> pad + PNG data URL

Famiglia

Moduli e Campi

Linguaggi

Delphi, C++ Builder, .NET

QuickStart

Crealo, configura la penna, renderizzalo

Imposta FieldName, Width/Height e i colori della penna, facoltativamente imposta UploadURL per inviare la firma con POST, quindi leggi 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

Riferimento

Proprietà e metodi principali

I membri che utilizzerai più spesso.

Canvas

Width (predefinito 400) e Height (predefinito 200) dimensionano il <canvas>; PenColor (#1a1a2e) e PenWidth (2) definiscono lo stile del tratto; BackgroundColor (#ffffff) riempie il pad.

Invio del tratto

FieldName (predefinito 'signature') renderizza un input nascosto che lo script inline aggiorna con una data URL PNG dopo ogni tratto.

Azioni

ShowClear e ShowUndo (entrambi predefiniti a True) aggiungono i pulsanti Clear/Undo; ClearCaption e UndoCaption sovrascrivono le relative etichette e ricadono sulla lingua attiva.

Salvataggio

UploadURL invia con POST la data URL PNG lato client quando si clicca Save; SaveCaption personalizza il testo di quel pulsante.

Visualizzazione in sola lettura

ReadOnly renderizza un’<img> statica (oppure un riquadro segnaposto vuoto) invece di un pad attivo, mostrando SignatureDataURL quando impostato.

Invio via WebSocket

WSSend avvolge il pad in un modulo data-sgc-ws-send così la firma viene inviata al server all’invio, lo stesso meccanismo usato dai componenti Chat e Form.

Risorse

Continua a esplorare

	Guida in lineaRiferimento API completo e guida all’uso per questo componente.	Apri
	Tutti i componenti sgcHTMLEsplora la matrice completa delle funzionalità di oltre 80 componenti.	Apri
	Scarica la Prova GratuitaLa prova di 30 giorni include i progetti demo 60.HTML.	Apri
	PrezziLicenze Single, Team e Site con codice sorgente completo.	Apri