Komponent Slider — sgcHTML | eSeGeCe

Slider

TsgcHTMLComponent_Slider — renderuje suwak zakresu Bootstrap z plakietką wartości na żywo, opcjonalnymi etykietami min/maks i kolorystyką, w Delphi, C++ Builder i .NET.

W skrócie

TsgcHTMLComponent_Slider

Opisane etykietą pole form-range Bootstrap. Ustaw granice Min/Max/Step i wartość początkową Value, wybierz ColorStyle, a następnie odczytaj właściwość HTML.

Klasa komponentu

TsgcHTMLComponent_Slider

Renderuje

Bootstrap form-range + plakietka wartości na żywo

Rodzina

Formularze i pola

Języki

Delphi, C++ Builder, .NET

Szybki start

Ustaw granice, wyrenderuj

Ustaw Min, Max, Step i wartość początkową Value, wybierz ColorStyle, a następnie odczytaj HTML.

uses
  sgcHTML_Enums, sgcHTML_Component_Slider;

var
  oSlider: TsgcHTMLComponent_Slider;
begin
  oSlider := TsgcHTMLComponent_Slider.Create(nil);
  try
    oSlider.FieldName := 'volume';
    oSlider.LabelText := 'Volume';
    oSlider.Min := 0;
    oSlider.Max := 100;
    oSlider.Step := 5;
    oSlider.Value := 50;
    oSlider.ShowMinMax := True;
    oSlider.ColorStyle := hcSuccess;

    WebModule.Response := oSlider.HTML;   // form-range + live value badge
  finally
    oSlider.Free;
  end;
end;

// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Slider.hpp

TsgcHTMLComponent_Slider *oSlider = new TsgcHTMLComponent_Slider(NULL);
try
{
  oSlider->FieldName = "volume";
  oSlider->LabelText = "Volume";
  oSlider->Min = 0;
  oSlider->Max = 100;
  oSlider->Step = 5;
  oSlider->Value = 50;
  oSlider->ShowMinMax = true;
  oSlider->ColorStyle = hcSuccess;

  String html = oSlider->HTML;   // form-range + live value badge
}
__finally
{
  delete oSlider;
}

using esegece.sgcWebSockets;

var slider = new TsgcHTMLComponent_Slider();
slider.FieldName = "volume";
slider.LabelText = "Volume";
slider.Min = 0;
slider.Max = 100;
slider.Step = 5;
slider.Value = 50;
slider.ShowMinMax = true;
slider.ColorStyle = TsgcHTMLColor.hcSuccess;

string html = slider.HTML;   // form-range + live value badge

Dokumentacja

Kluczowe właściwości i metody

Składniki, po które sięgasz najczęściej.

Zakres

Min (domyślnie 0), Max (domyślnie 100) i Step (domyślnie 1) ograniczają pole <input type="range">.

Wartość

Value ustawia pozycję początkową; ShowValue (domyślnie True) renderuje plakietkę na żywo, która aktualizuje się za pomocą wbudowanej obsługi zdarzenia oninput podczas przeciągania.

Etykiety

LabelText renderuje etykietę form-label nad suwakiem; ShowMinMax (domyślnie False) wypisuje granice Min/Max pod suwakiem.

Kolor

Color przyjmuje surowy ciąg hex; gdy jest pusty, ColorStyle (TsgcHTMLColor, domyślnie hcPrimary) dostarcza kolor akcentu zarówno dla suwaka, jak i plakietki wartości.

Wysyłanie

FieldName ustawia atrybut name, dzięki czemu wartość jest wysyłana wraz z formularzem; Disabled usuwa ją ze zbioru wysyłanych danych.

Identyfikator

SliderID ustawia identyfikator elementu (domyślnie sld_<FieldName> lub identyfikator generowany automatycznie).

Zasoby

Poznawaj dalej

	Pomoc onlinePełna dokumentacja API i przewodnik użytkowania tego komponentu.	Otwórz
	Wszystkie komponenty sgcHTMLPrzejrzyj pełną matrycę funkcji 80+ komponentów.	Otwórz
	Pobierz bezpłatną wersję próbną30-dniowa wersja próbna zawiera projekty demonstracyjne 60.HTML.	Otwórz
	CennikLicencje Single, Team i Site z pełnym kodem źródłowym.	Otwórz