ColorPicker Bileşeni — sgcHTML | eSeGeCe

ColorPicker

TsgcHTMLComponent_ColorPicker — Delphi, C++ Builder ve .NET'te isteğe bağlı bir hex metin alanı ve tek tıkla renk örneği ön ayarları içeren yerel bir HTML5 renk girdisi işleyin.

Bir bakışta

TsgcHTMLComponent_ColorPicker

Etiketli, yerel bir renk <input>'u. Başlangıç Value'sunu ayarlayın, ön ayarlı Swatches ekleyin, ardından HTML özelliğini okuyun (ya da tek satırlık kullanım için statik Build yardımcısını çağırın).

Bileşen sınıfı

TsgcHTMLComponent_ColorPicker

İşler

Yerel HTML5 <input type="color"> + renk örnekleri

Aile

Formlar & Girdiler

Diller

Delphi, C++ Builder, .NET

QuickStart

Oluşturun, renk örnekleri ekleyin, işleyin

FieldName, LabelText ve başlangıç Value'sunu ayarlayın, Swatches'a tek tıkla ön ayarlar ekleyin, ardından HTML'i okuyun — ya da statik Build yardımcısını çağırın.

uses
  sgcHTML_Component_ColorPicker;

var
  oColor: TsgcHTMLComponent_ColorPicker;
begin
  oColor := TsgcHTMLComponent_ColorPicker.Create(nil);
  try
    oColor.FieldName := 'brand_color';
    oColor.LabelText := 'Brand color';
    oColor.Value := '#0d6efd';
    oColor.ShowValueInput := True;

    oColor.Swatches.Add('#0d6efd');
    oColor.Swatches.Add('#198754');
    oColor.Swatches.Add('#dc3545');

    WebModule.Response := oColor.HTML;   // color input + hex field + swatches
  finally
    oColor.Free;
  end;
end;

// Or the static one-liner (field name, value, label):
Result := TsgcHTMLComponent_ColorPicker.Build('brand_color', '#0d6efd', 'Brand color');

// includes: sgcHTML_Component_ColorPicker.hpp

TsgcHTMLComponent_ColorPicker *oColor = new TsgcHTMLComponent_ColorPicker(NULL);
try
{
  oColor->FieldName = "brand_color";
  oColor->LabelText = "Brand color";
  oColor->Value = "#0d6efd";
  oColor->ShowValueInput = true;

  oColor->Swatches->Add("#0d6efd");
  oColor->Swatches->Add("#198754");
  oColor->Swatches->Add("#dc3545");

  String html = oColor->HTML;   // color input + hex field + swatches
}
__finally
{
  delete oColor;
}

// Or the static one-liner:
String html = TsgcHTMLComponent_ColorPicker::Build("brand_color", "#0d6efd", "Brand color");

using esegece.sgcWebSockets;

var color = new TsgcHTMLComponent_ColorPicker();
color.FieldName = "brand_color";
color.LabelText = "Brand color";
color.Value = "#0d6efd";
color.ShowValueInput = true;

color.Swatches.Add("#0d6efd");
color.Swatches.Add("#198754");
color.Swatches.Add("#dc3545");

string html = color.HTML;   // color input + hex field + swatches

// Or the static one-liner:
string html2 = TsgcHTMLComponent_ColorPicker.Build("brand_color", "#0d6efd", "Brand color");

Başvuru

Temel özellikler & yöntemler

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

Değer

Value, seçiciyi önceden doldurur (varsayılan #0d6efd); FieldName, girdinin name'ini ayarlar, böylece formla birlikte gönderilir.

Etiket

LabelText, seçicinin üzerinde for ile bağlanan isteğe bağlı bir form-label işler.

Hex metin alanı

ShowValueInput, seçicinin yanına eşitlenmiş bir metin girdisi ekler, böylece kullanıcılar doğrudan bir #rrggbb değeri yazabilir ya da yapıştırabilir.

Renk örnekleri

Swatches (hex kodlarından oluşan bir TStrings), bir ön ayar düğmeleri satırı işler; birine tıklamak istemci tarafında seçiciyi (ve hex alanını) günceller.

Durum & kimlik

Disabled, her iki girdiyi de devre dışı bırakır; ColorPickerID, öğe kimliğini ayarlar (cp_<FieldName> ya da otomatik oluşturulan bir kimliğe geri döner).

Statik yardımcı

Build(fieldName, value, labelText), bir örnek yönetmeden işaretlemeyi tek satırda döndürür.

Kaynaklar

Keşfetmeye devam edin

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