Auf einen Blick

TsgcHTMLComponent_Panel

Ein eingerahmtes Inhaltspanel, aufgebaut auf der Bootstrap-card. Setzen Sie Titel und Inhalt, wählen Sie eine Farbe, schalten Sie einklappbar oder scrollbar um und lesen Sie dann die HTML-Eigenschaft.

Komponentenklasse

TsgcHTMLComponent_Panel

Rendert

Bootstrap-5-card-Markup

Familie

Inhalt & Layout

Sprachen

Delphi, C++ Builder, .NET

QuickStart

Erstellen, Inhalt setzen, rendern

Weisen Sie Title, Body und Footer zu, wählen Sie eine Color und lesen Sie dann HTML — oder verwenden Sie den statischen einzeiligen Build-Helfer.

uses
  sgcHTML_Enums, sgcHTML_Component_Panel;

var
  oPanel: TsgcHTMLComponent_Panel;
begin
  oPanel := TsgcHTMLComponent_Panel.Create(nil);
  try
    oPanel.Title := 'Account Summary';
    oPanel.Body := '<p>Your plan renews on the 1st.</p>';
    oPanel.Footer := 'Last updated today';
    oPanel.Color := hcLight;
    oPanel.Collapsible := True;
    oPanel.Expanded := True;

    WebModule.Response := oPanel.HTML;   // Bootstrap card
  finally
    oPanel.Free;
  end;
end;

// Or in a single line with the static helper:
Result := TsgcHTMLComponent_Panel.Build('Account Summary',
  '<p>Your plan renews on the 1st.</p>', hcLight, 'Last updated today');

// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Panel.hpp

TsgcHTMLComponent_Panel *oPanel = new TsgcHTMLComponent_Panel(NULL);
try
{
  oPanel->Title = "Account Summary";
  oPanel->Body = "<p>Your plan renews on the 1st.</p>";
  oPanel->Footer = "Last updated today";
  oPanel->Color = hcLight;
  oPanel->Collapsible = true;
  oPanel->Expanded = true;

  String html = oPanel->HTML;   // Bootstrap card
}
__finally
{
  delete oPanel;
}

// Or in a single line with the static helper:
String html = TsgcHTMLComponent_Panel::Build("Account Summary",
  "<p>Your plan renews on the 1st.</p>", hcLight, "Last updated today");

using esegece.sgcWebSockets;

var panel = new TsgcHTMLComponent_Panel();
panel.Title = "Account Summary";
panel.Body = "<p>Your plan renews on the 1st.</p>";
panel.Footer = "Last updated today";
panel.Color = TsgcHTMLColor.hcLight;
panel.Collapsible = true;
panel.Expanded = true;

string html = panel.HTML;   // Bootstrap card

// Or in a single line with the static helper:
string oneLine = TsgcHTMLComponent_Panel.Build("Account Summary",
    "<p>Your plan renews on the 1st.</p>", TsgcHTMLColor.hcLight, "Last updated today");

Referenz

Wichtige Eigenschaften & Methoden

Die Member, die Sie am häufigsten verwenden.

Inhalt

Title setzt die Kartenkopfzeile, Body den HTML-Hauptinhalt und Footer eine optionale Fußzeile.

Erscheinungsbild

Color (TsgcHTMLColor) wählt die Themenfarbe; Outline rendert eine umrandete Variante statt eines gefüllten Hintergrunds.

Einklappen

Collapsible macht aus der Kopfzeile einen Umschalter, und Expanded legt fest, ob der Inhalt geöffnet startet.

Scrollen

Scrollable mit MaxHeight begrenzt die Inhaltshöhe und fügt für lange Inhalte vertikales Scrollen hinzu.

Identität

PanelID weist der Karte eine explizite DOM-id zu, die als Anker für das Collapse-Ziel dient.

Einzeiliger Build

Build(aTitle, aBody, aColor, aFooter) gibt das Panel-HTML in einem einzigen statischen Aufruf zurück; HTML rendert eine konfigurierte Instanz.

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

Panel