SignaturePad Bileşeni — sgcHTML | eSeGeCe

SignaturePad

TsgcHTMLComponent_SignaturePad — Delphi, C++ Builder ve .NET'te Temizle, Geri Al ve Kaydet eylemleri içeren, işaretçi olaylarıyla çalışan bir tuval imza pedi işleyin.

TsgcHTMLComponent_SignaturePad

İstemci tarafında bir PNG imza yakalayan, tuval tabanlı bir ped. Kalemi ve tuvali yapılandırın, ShowClear/ShowUndo/UploadURL'i bağlayın, ardından HTML özelliğini okuyun.

Bileşen sınıfı

TsgcHTMLComponent_SignaturePad

İşler

HTML5 <canvas> ped + PNG veri URL'si

Diller

Delphi, C++ Builder, .NET

Oluşturun, kalemi yapılandırın, işleyin

FieldName, Width/Height ve kalem renklerini ayarlayın, imzayı POST etmek için isteğe bağlı olarak UploadURL'i ayarlayın, ardından HTML'i okuyun.

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

Temel özellikler & yöntemler

En sık başvurduğunuz üyeler.

Tuval

Width (varsayılan 400) ve Height (varsayılan 200), <canvas>'ı boyutlandırır; PenColor (#1a1a2e) ve PenWidth (2), vuruşu biçimlendirir; BackgroundColor (#ffffff), pedi doldurur.

Vuruşu gönderme

FieldName (varsayılan 'signature'), satır içi betiğin her vuruştan sonra bir PNG veri URL'siyle yenilediği gizli bir girdi işler.

Eylemler

ShowClear ve ShowUndo (ikisi de varsayılan True), Temizle/Geri Al düğmeleri ekler; ClearCaption ve UndoCaption, başlıklarını geçersiz kılar ve etkin yerel ayara geri döner.

Kaydetme

UploadURL, Kaydet'e tıklandığında PNG veri URL'sini istemci tarafında POST eder; SaveCaption, o düğmenin metnini özelleştirir.

Salt okunur görüntü

ReadOnly, canlı bir ped yerine statik bir <img> (ya da boş bir yer tutucu kutu) işler ve ayarlandığında SignatureDataURL'i gösterir.

WebSocket gönderimi

WSSend, pedi bir data-sgc-ws-send formuyla sarar, böylece imza gönderimde sunucuya iletilir; bu, Chat ve Form bileşenlerinin kullandığı aynı mekanizmadır.

Keşfetmeye devam edin

Çevrimiçi yardımBu bileşen için tam API referansı ve kullanım kılavuzu.
Tüm sgcHTML Bileşenleri80'den fazla bileşenin tam özellik matrisine göz atın.
Ücretsiz Deneme Sürümünü İndirin30 günlük deneme, 60.HTML demo projeleriyle birlikte gelir.
FiyatlandırmaTam kaynak kodlu Single, Team ve Site lisansları.

Başlamaya Hazır mısınız?

Ücretsiz deneme sürümünü indirin ve Delphi, C++ Builder ve .NET'te web arayüzleri oluşturmaya başlayın.