Badge
TsgcHTMLComponent_Badge — renderize um único badge Bootstrap 5 com cor, formato pill, um ícone inline e um modo posicionado de ponto de notificação, em Delphi, C++ Builder e .NET.
TsgcHTMLComponent_Badge — renderize um único badge Bootstrap 5 com cor, formato pill, um ícone inline e um modo posicionado de ponto de notificação, em Delphi, C++ Builder e .NET.
Defina o texto e a cor, e então leia a propriedade HTML — ou pule totalmente o create/free com o helper estático Build.
TsgcHTMLComponent_Badge
Um único <span class="badge"> do Bootstrap 5
Delphi, C++ Builder, .NET
Chame o helper estático Build(text, color, pill) para um badge inline rápido, ou crie o componente para também definir Icon e Positioned, e então leia HTML.
uses
sgcHTML_Enums, sgcHTML_Component_Badge;
var
oBadge: TsgcHTMLComponent_Badge;
begin
oBadge := TsgcHTMLComponent_Badge.Create(nil);
try
oBadge.Text := '3';
oBadge.Color := bgDanger;
oBadge.Pill := True;
oBadge.Positioned := True;
WebModule.Response := oBadge.HTML; // <span class="badge bg-danger rounded-pill ...">
finally
oBadge.Free;
end;
end;
// Or the one-line static helper for a simple inline badge:
WebModule.Response := TsgcHTMLComponent_Badge.Build('New', bgSuccess, True);// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Badge.hpp
TsgcHTMLComponent_Badge *oBadge = new TsgcHTMLComponent_Badge(NULL);
try
{
oBadge->Text = "3";
oBadge->Color = bgDanger;
oBadge->Pill = true;
oBadge->Positioned = true;
String html = oBadge->HTML; // <span class="badge bg-danger rounded-pill ...">
}
__finally
{
delete oBadge;
}
// Or the one-line static helper:
String html2 = TsgcHTMLComponent_Badge::Build("New", bgSuccess, true);using esegece.sgcWebSockets;
var badge = new TsgcHTMLComponent_Badge();
badge.Text = "3";
badge.Color = TsgcHTMLBadgeStyle.bgDanger;
badge.Pill = true;
badge.Positioned = true;
string html = badge.HTML; // <span class="badge bg-danger rounded-pill ...">
// Or the one-line static helper:
string html2 = TsgcHTMLComponent_Badge.Build("New", TsgcHTMLBadgeStyle.bgSuccess, true);Os membros que você usa com mais frequência.
Text é o rótulo; Color (TsgcHTMLBadgeStyle: bgPrimary, bgSecondary, bgSuccess, bgDanger, bgWarning, bgInfo, bgLight, bgDark) define a variante do Bootstrap.
Pill muda o badge para o formato totalmente arredondado rounded-pill.
Icon renderiza um elemento <i> (por exemplo, uma classe do Bootstrap Icons) antes do texto.
Positioned adiciona position-absolute top-0 start-100 translate-middle, transformando o badge em um ponto de notificação ancorado a um elemento pai position-relative.
Build(aText, aColor, aPill) retorna o HTML do badge diretamente, sem instância para criar ou liberar.
HTML retorna um único elemento <span class="badge bg-...">, pronto para embutir inline.
| Ajuda onlineReferência completa da API e guia de uso para este componente. | Abrir | |
| Todos os Componentes sgcHTMLExplore a matriz completa de recursos com mais de 80 componentes. | Abrir | |
| Baixar Versão de Avaliação GratuitaA avaliação de 30 dias inclui os projetos de demonstração 60.HTML. | Abrir | |
| PreçosLicenças Single, Team e Site com código-fonte completo. | Abrir |