Theme Controller

TsgcHTMLThemeController / TsgcHTMLThemeBuilder — gestiona los temas claro, oscuro y del sistema en todas las páginas y genera bloques de variables CSS de Bootstrap para los colores de marca personalizados.

TsgcHTMLThemeController & TsgcHTMLThemeBuilder

TsgcHTMLThemeController lee una cookie o parámetro de consulta para determinar qué tema Bootstrap activar e inyecta el script de inicialización necesario. TsgcHTMLThemeBuilder genera un bloque <style> que anula las variables CSS de Bootstrap con los colores de tu marca.

Clases del componente

TsgcHTMLThemeController, TsgcHTMLThemeBuilder

Rol

Temas claro/oscuro y CSS personalizado

Lenguajes

Delphi, C++ Builder, .NET

Cambiar temas, inyectar colores personalizados

Usa TsgcHTMLThemeController para leer una cookie o parámetro de consulta y aplicar el atributo de tema Bootstrap correcto. Usa TsgcHTMLThemeBuilder para emitir un bloque de variables CSS personalizado para los colores de tu marca.

uses
  sgcHTML_ThemeController;

// Detect theme from request cookie:
var
  oTheme: TsgcHTMLThemeController;
begin
  oTheme := TsgcHTMLThemeController.Create(nil);
  try
    oTheme.CookieName    := 'app_theme';
    oTheme.DefaultTheme  := htSystem;
    // Inject into the Bootstrap template:
    oTemplate.HeadContent :=
      oTemplate.HeadContent + oTheme.GetThemeScript(ARequest);
  finally
    oTheme.Free;
  end;
end;

// Generate brand CSS variables:
var
  oBuilder: TsgcHTMLThemeBuilder;
begin
  oBuilder := TsgcHTMLThemeBuilder.Create(nil);
  try
    oBuilder.PrimaryColor   := '#7C3AED';
    oBuilder.SecondaryColor := '#1E293B';
    oTemplate.HeadContent :=
      oTemplate.HeadContent + oBuilder.Build;
  finally
    oBuilder.Free;
  end;
end;
TsgcHTMLThemeController *oTheme = new TsgcHTMLThemeController(NULL);
try
{
  oTheme->CookieName   = "app_theme";
  oTheme->DefaultTheme = htSystem;
  oTemplate->HeadContent += oTheme->GetThemeScript(ARequest);
}
__finally { delete oTheme; }

TsgcHTMLThemeBuilder *oBuilder = new TsgcHTMLThemeBuilder(NULL);
try
{
  oBuilder->PrimaryColor = "#7C3AED";
  oTemplate->HeadContent += oBuilder->Build();
}
__finally { delete oBuilder; }
var themeCtrl = new TsgcHTMLThemeController();
themeCtrl.CookieName   = "app_theme";
themeCtrl.DefaultTheme = TsgcHTMLTheme.htSystem;
template.HeadContent += themeCtrl.GetThemeScript(request);

var themeBuilder = new TsgcHTMLThemeBuilder();
themeBuilder.PrimaryColor = "#7C3AED";
template.HeadContent += themeBuilder.Build();

Propiedades y métodos clave

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

TsgcHTMLThemeController.CookieName

Nombre de la cookie que almacena la preferencia de tema del usuario (htLight / htDark / htSystem).

TsgcHTMLThemeController.DefaultTheme

Tema de reserva cuando no hay ninguna cookie ni parámetro de consulta presente.

GetThemeScript

Lee el tema activo de la petición (cookie o parámetro ?theme=) y devuelve el script de inicialización del tema Bootstrap para inyectar en <head>.

TsgcHTMLThemeBuilder.PrimaryColor

Anula la variable CSS --bs-primary de Bootstrap con el color de tu marca.

TsgcHTMLThemeBuilder.CustomVars

Declaraciones de propiedades CSS personalizadas sin procesar, añadidas al bloque <style> generado para cualquier variable de Bootstrap o de la aplicación.

TsgcHTMLThemeBuilder.Build

Devuelve un bloque <style> con las anulaciones de :root; asígnalo a TsgcHTMLTemplate_Bootstrap.HeadContent.

Sigue explorando

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

¿Listo para empezar?

Descarga la prueba gratuita y empieza a crear interfaces web en Delphi, C++ Builder y .NET.