Auf einen Blick

TsgcHTMLDashboardLayout

Eine Layout-Komponente, die ein vollständiges Dashboard-Gerüst ausgibt: eine feste Seitenleiste links und einen mit Innenabstand versehenen Hauptbereich aus betitelten Abschnitten. Konfigurieren Sie die Sidebar, fügen Sie Abschnitte hinzu und lesen Sie dann die HTML-Eigenschaft.

Komponentenklasse

TsgcHTMLDashboardLayout

Rendert

Dashboard-Gerüst (feste Seitenleiste + Inhalt)

Familie

Navigation & Struktur

Sprachen

Delphi, C++ Builder, .NET

QuickStart

Erstellen, Gerüst aufbauen, rendern

Konfigurieren Sie die schreibgeschützte Sidebar, rufen Sie AddSection(title, content) für jeden Block auf und lesen Sie dann HTML (oder fügen Sie es in eine TsgcHTMLTemplate_Bootstrap-Seite ein).

uses
  sgcHTML_Enums, sgcHTML_Component_DashboardLayout;

var
  oDash: TsgcHTMLDashboardLayout;
begin
  oDash := TsgcHTMLDashboardLayout.Create(nil);
  try
    oDash.DarkMode := True;
    oDash.FooterText := '© 2026 Acme Inc.';

    oDash.Sidebar.Brand := 'Acme Admin';
    oDash.Sidebar.Items.Add.Text := 'Overview';
    oDash.Sidebar.Items.Add.Text := 'Reports';

    oDash.AddSection('Sales', '<p>Revenue is up 12%</p>');
    oDash.AddSection('Activity', '<p>3 new orders</p>');

    WebModule.Response := oDash.HTML;   // dashboard shell
  finally
    oDash.Free;
  end;
end;

// includes: sgcHTML_Enums.hpp, sgcHTML_Component_DashboardLayout.hpp

TsgcHTMLDashboardLayout *oDash = new TsgcHTMLDashboardLayout(NULL);
try
{
  oDash->DarkMode = true;
  oDash->FooterText = "© 2026 Acme Inc.";

  oDash->Sidebar->Brand = "Acme Admin";
  oDash->Sidebar->Items->Add()->Text = "Overview";
  oDash->Sidebar->Items->Add()->Text = "Reports";

  oDash->AddSection("Sales", "<p>Revenue is up 12%</p>");
  oDash->AddSection("Activity", "<p>3 new orders</p>");

  String html = oDash->HTML;   // dashboard shell
}
__finally
{
  delete oDash;
}

using esegece.sgcWebSockets;

var dash = new TsgcHTMLDashboardLayout();
dash.DarkMode = true;
dash.FooterText = "© 2026 Acme Inc.";

dash.Sidebar.Brand = "Acme Admin";
dash.Sidebar.Items.Add().Text = "Overview";
dash.Sidebar.Items.Add().Text = "Reports";

dash.AddSection("Sales", "<p>Revenue is up 12%</p>");
dash.AddSection("Activity", "<p>3 new orders</p>");

string html = dash.HTML;   // dashboard shell

Referenz

Wichtige Eigenschaften & Methoden

Die Member, die Sie am häufigsten verwenden.

Sidebar ist eine schreibgeschützte TsgcHTMLComponent_Sidebar, die fest links dargestellt wird; konfigurieren Sie ihr Brand, Width und Items direkt vor Ort.

Abschnitte

AddSection(aTitle, aContent, aID) hängt ein betiteltes <section> an; AddRawContent(aContent) fügt Markup unverändert ein; ClearContent leert den Hauptbereich.

Gerüst

Fluid schaltet den vollbreiten Container um, FooterText ergänzt eine zentrierte Fußzeile, und LayoutID setzt die Element-id des Wrappers.

Dunkelmodus

DarkMode fügt ein Dark-Theme-Stylesheet ein, das Karten, Tabellen, Formulare, Navigation und List-Groups innerhalb des Gerüsts neu einfärbt.

Abstände & Akzente

MainPadding, MainMinHeight und SectionMarginBottom bemessen den Hauptbereich; SectionTitleBorderColorStyle (ein TsgcHTMLColor) färbt die Titel-Unterlinie jedes Abschnitts.

Ausgabe

HTML gibt das vollständige Gerüst zurück — feste Seitenleiste, Hauptinhalt und Fußzeile — bereit zum Ausliefern oder zur Zuweisung an den BodyContent einer Seitenvorlage.

Ressourcen

Weiter entdecken

	Alle sgcHTML-KomponentenDurchsuchen Sie die vollständige Funktionsmatrix von über 60 Komponenten.	Öffnen
	Kostenlose Testversion herunterladenDie 30-Tage-Testversion enthält die 60.HTML-Demoprojekte.	Öffnen
	PreiseSingle-, Team- und Site-Lizenzen mit vollständigem Quellcode.	Öffnen

DashboardLayout