Theme Controller

Auf einen Blick

TsgcHTMLThemeController & TsgcHTMLThemeBuilder

TsgcHTMLThemeController liest einen Cookie oder Query-Parameter, um festzustellen, welches Bootstrap-Thema aktiviert werden soll, und fügt das erforderliche Initialisierungsskript ein. TsgcHTMLThemeBuilder generiert einen <style>-Block, der Bootstrap-CSS-Variablen mit Ihren Markenfarben überschreibt.

Komponentenklassen

TsgcHTMLThemeController, TsgcHTMLThemeBuilder

Rolle

Hell/Dunkel-Theming & benutzerdefiniertes CSS

Familie

Infrastruktur & Engine

Sprachen

Delphi, C++ Builder, .NET

Schnellstart

Themen wechseln, benutzerdefinierte Farben einbinden

Verwenden Sie TsgcHTMLThemeController, um einen Cookie oder Query-Parameter zu lesen und das korrekte Bootstrap-Themen-Attribut anzuwenden. Verwenden Sie TsgcHTMLThemeBuilder, um einen benutzerdefinierten CSS-Variablenblock für Ihre Markenfarben auszugeben.

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();

Referenz

Wichtige Eigenschaften & Methoden

Die am häufigsten verwendeten Members.

TsgcHTMLThemeController.CookieName

Name des Cookies, das die Themen-Präferenz des Benutzers speichert (htLight / htDark / htSystem).

TsgcHTMLThemeController.DefaultTheme

Fallback-Thema, wenn kein Cookie oder Query-Parameter vorhanden ist.

GetThemeScript

Liest das aktive Thema aus der Anfrage (Cookie oder ?theme=-Parameter) und gibt das Bootstrap-Themen-Initialisierungsskript zurück, das in <head> eingefügt werden soll.

TsgcHTMLThemeBuilder.PrimaryColor

Überschreibt Bootstraps --bs-primary-CSS-Variable mit Ihrer Markenfarbe.

TsgcHTMLThemeBuilder.CustomVars

Rohe CSS-Custom-Property-Deklarationen, die dem generierten <style>-Block für beliebige Bootstrap- oder App-Variablen angehängt werden.

TsgcHTMLThemeBuilder.Build

Gibt einen <style>-Block mit den :root-Überschreibungen zurück; weisen Sie ihn TsgcHTMLTemplate_Bootstrap.HeadContent zu.

Ressourcen

Weiter erkunden

	Online-HilfeVollständige API-Referenz und Verwendungshandbuch für diese Komponente.	Öffnen
	Alle sgcHTML-KomponentenDurchsuche die vollständige Feature-Matrix mit 60+ Komponenten.	Öffnen
	Kostenlose Testversion herunterladenDie 30-Tage-Testversion enthält die 60.HTML-Demoprojekte.	Öffnen
	PreiseEinzel-, Team- und Site-Lizenzen mit vollständigem Quellcode.	Öffnen