ProgressBar Component — sgcHTML | eSeGeCe

ProgressBar

TsgcHTMLComponent_ProgressBar — una barra di avanzamento Bootstrap, a righe e animata, con etichetta opzionale, oppure una barra impilata multi-segmento, in Delphi, C++ Builder e .NET.

In sintesi

TsgcHTMLComponent_ProgressBar

Imposta Value e Max per una singola barra, oppure aggiungi voci a Bars per una barra impilata multi-segmento, quindi leggi la proprietà HTML.

Classe del componente

TsgcHTMLComponent_ProgressBar

Renderizza

Bootstrap 5 .progress bar (single or stacked)

Famiglia

Overlay e Feedback

Linguaggi

Delphi, C++ Builder, .NET

QuickStart

Imposta il valore, stilizzala, renderizzala

Imposta Value, Max e ColorStyle, attiva Striped / Animated / ShowLabel secondo necessità, quindi leggi HTML.

uses
  sgcHTML_Enums, sgcHTML_Component_ProgressBar;

var
  oBar: TsgcHTMLComponent_ProgressBar;
begin
  oBar := TsgcHTMLComponent_ProgressBar.Create(nil);
  try
    oBar.ProgressBarID := 'upload';
    oBar.Value := 72;
    oBar.Max := 100;
    oBar.ColorStyle := hcSuccess;
    oBar.Striped := True;
    oBar.Animated := True;
    oBar.ShowLabel := True;
    oBar.LabelFormat := '%d%% complete';

    WebModule.Response := oBar.HTML;   // Bootstrap progress bar
  finally
    oBar.Free;
  end;
end;

// Or a stacked, multi-segment bar:
with oBar.Bars.Add do
begin
  Value := 40;
  ColorStyle := hcPrimary;
  Label_ := 'Done';
end;
with oBar.Bars.Add do
begin
  Value := 20;
  ColorStyle := hcWarning;
  Label_ := 'In progress';
end;

// includes: sgcHTML_Enums.hpp, sgcHTML_Component_ProgressBar.hpp

TsgcHTMLComponent_ProgressBar *oBar = new TsgcHTMLComponent_ProgressBar(NULL);
try
{
  oBar->ProgressBarID = "upload";
  oBar->Value = 72;
  oBar->Max = 100;
  oBar->ColorStyle = hcSuccess;
  oBar->Striped = true;
  oBar->Animated = true;
  oBar->ShowLabel = true;
  oBar->LabelFormat = "%d%% complete";

  String html = oBar->HTML;   // Bootstrap progress bar

  // Or a stacked, multi-segment bar:
  TsgcHTMLProgressBarItem *oSeg1 = oBar->Bars->Add();
  oSeg1->Value = 40;
  oSeg1->ColorStyle = hcPrimary;
  oSeg1->Label_ = "Done";

  TsgcHTMLProgressBarItem *oSeg2 = oBar->Bars->Add();
  oSeg2->Value = 20;
  oSeg2->ColorStyle = hcWarning;
  oSeg2->Label_ = "In progress";
}
__finally
{
  delete oBar;
}

using esegece.sgcWebSockets;

var bar = new TsgcHTMLComponent_ProgressBar();
bar.ProgressBarID = "upload";
bar.Value = 72;
bar.Max = 100;
bar.ColorStyle = TsgcHTMLColor.hcSuccess;
bar.Striped = true;
bar.Animated = true;
bar.ShowLabel = true;
bar.LabelFormat = "%d%% complete";

string html = bar.HTML;   // Bootstrap progress bar

// Or a stacked, multi-segment bar:
var seg1 = bar.Bars.Add();
seg1.Value = 40;
seg1.ColorStyle = TsgcHTMLColor.hcPrimary;
seg1.Label_ = "Done";

var seg2 = bar.Bars.Add();
seg2.Value = 20;
seg2.ColorStyle = TsgcHTMLColor.hcWarning;
seg2.Label_ = "In progress";

Riferimento

Proprietà e metodi principali

I membri che utilizzerai più spesso.

Barra singola

Value e Max (predefinito 100) impostano la larghezza di riempimento come percentuale; ColorStyle sceglie il colore Bootstrap, oppure imposta un colore CSS personalizzato con Color.

Etichetta

ShowLabel renderizza il testo della percentuale all’interno della barra; LabelFormat (predefinito %d%%) controlla come viene formattato.

A righe e animata

Striped aggiunge righe diagonali; Animated implica automaticamente le righe e le anima lungo la barra.

Segmenti impilati

Bars.Add aggiunge un TsgcHTMLProgressBarItem (Value, ColorStyle / Color, Label_); non appena Bars contiene voci, queste sostituiscono la barra singola Value.

Dimensioni e identità

Height imposta un’altezza CSS personalizzata per la barra; ProgressBarID (o ElementID) assegna un nome al <div class="progress"> esterno per l’invio dei frammenti.

Output

HTML restituisce il contenitore della barra di avanzamento insieme ai suoi segmenti, pronto per essere incorporato o inviato via WebSocket man mano che il valore cambia.

Risorse

Continua a esplorare

	Guida in lineaRiferimento API completo e guida all’uso per questo componente.	Apri
	Tutti i componenti sgcHTMLEsplora la matrice completa delle funzionalità di oltre 80 componenti.	Apri
	Scarica la Prova GratuitaLa prova di 30 giorni include i progetti demo 60.HTML.	Apri
	PrezziLicenze Single, Team e Site con codice sorgente completo.	Apri