Image

TsgcHTMLComponent_Image — renderizza un’immagine Bootstrap con forma, dimensionamento responsive, lazy loading e un lightbox e una didascalia opzionali, in Delphi, C++ Builder e .NET.

TsgcHTMLComponent_Image

Un elemento immagine con stile Bootstrap. Imposta la sorgente e il testo alternativo, scegli una forma, attiva il responsive e il lazy loading, quindi leggi la proprietà HTML.

Classe del componente

TsgcHTMLComponent_Image

Renderizza

Bootstrap 5 image markup

Linguaggi

Delphi, C++ Builder, .NET

Crealo, imposta la sorgente, renderizzalo

Assegna Src e Alt, scegli una Shape, attiva Responsive, LazyLoad e Lightbox, quindi leggi HTML — oppure usa l’helper statico Build a riga singola.

uses
  sgcHTML_Enums, sgcHTML_Component_Image;

var
  oImg: TsgcHTMLComponent_Image;
begin
  oImg := TsgcHTMLComponent_Image.Create(nil);
  try
    oImg.Src := '/img/team.jpg';
    oImg.Alt := 'Our team';
    oImg.Shape := isRounded;
    oImg.Responsive := True;
    oImg.Lightbox := True;
    oImg.Caption := 'The team at work';

    WebModule.Response := oImg.HTML;   // <img> markup
  finally
    oImg.Free;
  end;
end;

// Or in a single line with the static helper:
Result := TsgcHTMLComponent_Image.Build('/img/team.jpg', 'Our team',
  isRounded, True);
// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Image.hpp

TsgcHTMLComponent_Image *oImg = new TsgcHTMLComponent_Image(NULL);
try
{
  oImg->Src = "/img/team.jpg";
  oImg->Alt = "Our team";
  oImg->Shape = isRounded;
  oImg->Responsive = true;
  oImg->Lightbox = true;
  oImg->Caption = "The team at work";

  String html = oImg->HTML;   // <img> markup
}
__finally
{
  delete oImg;
}

// Or in a single line with the static helper:
String html = TsgcHTMLComponent_Image::Build("/img/team.jpg", "Our team",
  isRounded, true);
using esegece.sgcWebSockets;

var img = new TsgcHTMLComponent_Image();
img.Src = "/img/team.jpg";
img.Alt = "Our team";
img.Shape = TsgcHTMLImageShape.isRounded;
img.Responsive = true;
img.Lightbox = true;
img.Caption = "The team at work";

string html = img.HTML;   // <img> markup

// Or in a single line with the static helper:
string oneLine = TsgcHTMLComponent_Image.Build("/img/team.jpg", "Our team",
    TsgcHTMLImageShape.isRounded, true);

Proprietà e metodi principali

I membri che utilizzerai più spesso.

Sorgente

Src imposta l’URL dell’immagine e Alt il testo alternativo accessibile.

Forma

Shape (TsgcHTMLImageShape: isRounded, isCircle, isThumbnail) definisce lo stile di angoli e bordo.

Dimensionamento

Responsive applica img-fluid così l’immagine si adatta al suo contenitore; Width e Height impostano dimensioni esplicite.

Caricamento

LazyLoad aggiunge loading="lazy" così le immagini fuori schermo vengono caricate solo quando necessario.

Extra

Lightbox racchiude l’immagine in un link alla sorgente a dimensione intera; Caption la racchiude in una figure con una didascalia; ImageID imposta l’id DOM.

Build a riga singola

Build(aSrc, aAlt, aShape, aResponsive) restituisce l’HTML dell’immagine con una singola chiamata statica.

Continua a esplorare

Tutti i componenti sgcHTMLEsplora la matrice completa delle funzionalità di oltre 60 componenti.
Scarica la Prova GratuitaLa prova di 30 giorni include i progetti demo 60.HTML.
PrezziLicenze Single, Team e Site con codice sorgente completo.

Pronto a Iniziare?

Scarica la versione di prova gratuita e inizia a creare interfacce web in Delphi, C++ Builder e .NET.