Carousel Component — sgcHTML

Auf einen Blick

TsgcHTMLComponent_Carousel

Eine Bildershow auf Basis des Bootstrap-carousel. Füge Slides mit Bild, Beschriftung und Beschreibung hinzu, lege Autoplay und Übergang fest und lies dann die Eigenschaft HTML aus.

Komponentenklasse

TsgcHTMLComponent_Carousel

Erzeugt

Bootstrap 5 carousel-Markup

Familie

Inhalt & Layout

Sprachen

Delphi, C++ Builder, .NET

Schnellstart

Erstellen, Slides hinzufügen, rendern

Füge Slides mit AddSlide(image, caption, description) hinzu, lege Autoplay, Interval und Transition fest und lies dann HTML aus.

uses
  sgcHTML_Component_Carousel;

var
  oCar: TsgcHTMLComponent_Carousel;
begin
  oCar := TsgcHTMLComponent_Carousel.Create(nil);
  try
    oCar.ShowIndicators := True;
    oCar.ShowControls := True;
    oCar.Autoplay := True;
    oCar.Interval := 4000;
    oCar.Transition := ctFade;
    oCar.Height := '420px';

    oCar.AddSlide('/img/one.jpg', 'First', 'Welcome aboard');
    oCar.AddSlide('/img/two.jpg', 'Second', 'Discover more');

    WebModule.Response := oCar.HTML;   // Bootstrap carousel
  finally
    oCar.Free;
  end;
end;

// includes: sgcHTML_Component_Carousel.hpp

TsgcHTMLComponent_Carousel *oCar = new TsgcHTMLComponent_Carousel(NULL);
try
{
  oCar->ShowIndicators = true;
  oCar->ShowControls = true;
  oCar->Autoplay = true;
  oCar->Interval = 4000;
  oCar->Transition = ctFade;
  oCar->Height = "420px";

  oCar->AddSlide("/img/one.jpg", "First", "Welcome aboard");
  oCar->AddSlide("/img/two.jpg", "Second", "Discover more");

  String html = oCar->HTML;   // Bootstrap carousel
}
__finally
{
  delete oCar;
}

using esegece.sgcWebSockets;

var car = new TsgcHTMLComponent_Carousel();
car.ShowIndicators = true;
car.ShowControls = true;
car.Autoplay = true;
car.Interval = 4000;
car.Transition = TsgcHTMLCarouselTransition.ctFade;
car.Height = "420px";

car.AddSlide("/img/one.jpg", "First", "Welcome aboard");
car.AddSlide("/img/two.jpg", "Second", "Discover more");

string html = car.HTML;   // Bootstrap carousel

Referenz

Wichtige Eigenschaften & Methoden

Die am häufigsten verwendeten Member.

Slides

AddSlide(aImageSrc, aCaption, aDescription) hängt ein Slide an; Items (TsgcHTMLCarouselItems) stellt pro Slide ImageSrc, Caption, Description und Active bereit.

ShowIndicators zeichnet die Punkt-Indikatoren und ShowControls zeichnet die Vor-/Zurück-Pfeile.

Autoplay

Autoplay wechselt die Slides automatisch und Interval legt die Verzögerung dazwischen in Millisekunden fest.

Übergang

Transition (TsgcHTMLCarouselTransition) wechselt zwischen ctSlide und ctFade; Dark verwendet die dunkle Steuerelement-Variante.

Größe

Height fixiert die Slide-Höhe mit Cover-Fit-Beschnitt; CarouselID legt die Container-ID fest.

Ausgabe

HTML liefert das vollständige carousel-Markup — liefere es aus oder weise es dem Body-Inhalt einer Seitenvorlage zu.

Ressourcen

Weiter entdecken

	Alle sgcHTML-KomponentenDurchsuche 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

Carousel