Carousel
TsgcHTMLComponent_Carousel — render een Bootstrap-afbeeldingsdiavoorstelling met indicatoren, knoppen, autoplay en slide- of fade-overgangen, in Delphi, C++ Builder en .NET.
TsgcHTMLComponent_Carousel — render een Bootstrap-afbeeldingsdiavoorstelling met indicatoren, knoppen, autoplay en slide- of fade-overgangen, in Delphi, C++ Builder en .NET.
Een afbeeldingsdiavoorstelling gebouwd op de Bootstrap carousel. Voeg slides toe met een afbeelding, bijschrift en beschrijving, stel autoplay en overgang in en lees vervolgens de eigenschap HTML.
TsgcHTMLComponent_Carousel
Bootstrap 5 carousel-markup
Delphi, C++ Builder, .NET
Voeg slides toe met AddSlide(image, caption, description), stel Autoplay, Interval en Transition in en lees vervolgens HTML.
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
De members die je het vaakst gebruikt.
AddSlide(aImageSrc, aCaption, aDescription) voegt een slide toe; Items (TsgcHTMLCarouselItems) stelt ImageSrc, Caption, Description en Active per slide beschikbaar.
ShowIndicators tekent de stipindicatoren en ShowControls tekent de vorige/volgende-pijlen.
Autoplay doorloopt de slides automatisch en Interval stelt de vertraging ertussen in milliseconden in.
Transition (TsgcHTMLCarouselTransition) schakelt tussen ctSlide en ctFade; Dark gebruikt de donkere knopvariant.
Height legt de slidehoogte vast met cover-fit-bijsnijden; CarouselID stelt de id van de container in.
HTML geeft de volledige carousel-markup terug — serveer het of wijs het toe aan de body-content van een paginasjabloon.