Theme Controller

TsgcHTMLThemeController / TsgcHTMLThemeBuilder — gerenciam temas claro, escuro e do sistema em todas as páginas e geram blocos de variáveis CSS Bootstrap para cores de marca personalizadas.

TsgcHTMLThemeController & TsgcHTMLThemeBuilder

TsgcHTMLThemeController lê um cookie ou parâmetro de consulta para determinar qual tema Bootstrap ativar e injeta o script de inicialização necessário. TsgcHTMLThemeBuilder gera um bloco <style> que substitui as variáveis CSS do Bootstrap pelas cores da sua marca.

Classes do componente

TsgcHTMLThemeController, TsgcHTMLThemeBuilder

Função

Tematização light/dark & CSS personalizado

Linguagens

Delphi, C++ Builder, .NET

Alterne temas e injete cores personalizadas

Use TsgcHTMLThemeController para ler um cookie ou parâmetro de consulta e aplicar o atributo de tema Bootstrap correto. Use TsgcHTMLThemeBuilder para emitir um bloco de variáveis CSS personalizado para as cores da sua 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();

Propriedades e métodos principais

Os membros usados com mais frequência.

TsgcHTMLThemeController.CookieName

Nome do cookie que armazena a preferência de tema do usuário (htLight / htDark / htSystem).

TsgcHTMLThemeController.DefaultTheme

Tema padrão quando nenhum cookie ou parâmetro de consulta estiver presente.

GetThemeScript

Lê o tema ativo da requisição (cookie ou parâmetro ?theme=) e retorna o script de inicialização do tema Bootstrap para injetar no <head>.

TsgcHTMLThemeBuilder.PrimaryColor

Substitui a variável CSS --bs-primary do Bootstrap pela cor da sua marca.

TsgcHTMLThemeBuilder.CustomVars

Declarações de propriedades CSS personalizadas brutas adicionadas ao bloco <style> gerado para qualquer variável Bootstrap ou de nível de aplicação.

TsgcHTMLThemeBuilder.Build

Retorna um bloco <style> contendo as substituições de :root; atribua a TsgcHTMLTemplate_Bootstrap.HeadContent.

Continue explorando

Ajuda onlineReferência completa da API e guia de uso para este componente.
Todos os componentes sgcHTMLNavegue pela matriz completa de 60+ componentes.
Baixar versão de avaliação gratuitaA versão de avaliação de 30 dias inclui os projetos de demonstração 60.HTML.
PreçosLicenças Single, Team e Site com código-fonte completo.

Pronto para começar?

Baixe a versão de avaliação gratuita e comece a criar interfaces web em Delphi, C++ Builder e .NET.