Componente Slider — sgcHTML

De un vistazo

TsgcHTMLComponent_Slider

Un input form-range de Bootstrap con etiqueta. Define los límites Min/Max/Step y un Value inicial, elige un ColorStyle, y luego lee la propiedad HTML.

Clase del componente

TsgcHTMLComponent_Slider

Genera

form-range de Bootstrap + insignia de valor en vivo

Familia

Formularios y Entradas

Lenguajes

Delphi, C++ Builder, .NET

Inicio rápido

Define los límites, renderízalo

Define Min, Max, Step y un Value inicial, elige un ColorStyle, y luego lee 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

Referencia

Propiedades y métodos clave

Los miembros que usarás con más frecuencia.

Rango

Min (por defecto 0), Max (por defecto 100) y Step (por defecto 1) limitan el <input type="range">.

Valor

Value define la posición inicial; ShowValue (por defecto True) renderiza una insignia en vivo que se actualiza mediante un manejador oninput en línea mientras el usuario arrastra.

Etiquetas

LabelText renderiza una form-label encima del slider; ShowMinMax (por defecto False) imprime los límites Min/Max debajo de la pista.

Color

Color acepta una cadena hexadecimal directa; cuando está vacía, ColorStyle (TsgcHTMLColor, por defecto hcPrimary) proporciona el color de acento tanto para la pista como para la insignia de valor.

Envío

FieldName define el atributo name para que el valor se envíe con el formulario; Disabled lo excluye del conjunto de envío.

Identidad

SliderID define el id del elemento (recurre a sld_<FieldName> o a un id generado automáticamente).

Recursos

Sigue explorando

	Ayuda en líneaReferencia completa de la API y guía de uso para este componente.	Abrir
	Todos los componentes de sgcHTMLExplora la matriz completa de más de 80 componentes.	Abrir
	Descargar prueba gratuitaLa prueba de 30 días incluye los proyectos de demostración 60.HTML.	Abrir
	PreciosLicencias Single, Team y Site con código fuente completo.	Abrir

Slider