Visão geral

TsgcHTMLComponent_ButtonGroup

Um componente de grupo de botões que emite um btn-group do Bootstrap 5. Adicione itens de botão, defina o estilo e o estado de cada um e então leia a propriedade HTML.

Classe do componente

TsgcHTMLComponent_ButtonGroup

Renderiza

Markup btn-group do Bootstrap 5

Família

Navegação & Estrutura

Linguagens

Delphi, C++ Builder, .NET

QuickStart

Crie, adicione botões, renderize

Adicione itens de botão, defina o Text, o ButtonStyle e a flag Active de cada um, escolha um Size e então leia HTML (ou insira-o em uma página TsgcHTMLTemplate_Bootstrap).

uses
  sgcHTML_Enums, sgcHTML_Component_ButtonGroup;

var
  oGroup: TsgcHTMLComponent_ButtonGroup;
  oBtn: TsgcHTMLButtonItem;
begin
  oGroup := TsgcHTMLComponent_ButtonGroup.Create(nil);
  try
    oGroup.Size := bgsLarge;
    oGroup.AriaLabel := 'View mode';

    oBtn := oGroup.Items.Add;
    oBtn.Text := 'Day';
    oBtn.ButtonStyle := bsOutlinePrimary;
    oBtn.Active := True;

    oBtn := oGroup.Items.Add;
    oBtn.Text := 'Week';
    oBtn.ButtonStyle := bsOutlinePrimary;

    oBtn := oGroup.Items.Add;
    oBtn.Text := 'Month';
    oBtn.ButtonStyle := bsOutlinePrimary;
    oBtn.Disabled := True;

    WebModule.Response := oGroup.HTML;   // Bootstrap btn-group
  finally
    oGroup.Free;
  end;
end;

// includes: sgcHTML_Enums.hpp, sgcHTML_Component_ButtonGroup.hpp

TsgcHTMLComponent_ButtonGroup *oGroup = new TsgcHTMLComponent_ButtonGroup(NULL);
try
{
  oGroup->Size = bgsLarge;
  oGroup->AriaLabel = "View mode";

  TsgcHTMLButtonItem *oBtn = oGroup->Items->Add();
  oBtn->Text = "Day";
  oBtn->ButtonStyle = bsOutlinePrimary;
  oBtn->Active = true;

  oBtn = oGroup->Items->Add();
  oBtn->Text = "Week";
  oBtn->ButtonStyle = bsOutlinePrimary;

  oBtn = oGroup->Items->Add();
  oBtn->Text = "Month";
  oBtn->ButtonStyle = bsOutlinePrimary;
  oBtn->Disabled = true;

  String html = oGroup->HTML;   // Bootstrap btn-group
}
__finally
{
  delete oGroup;
}

using esegece.sgcWebSockets;

var group = new TsgcHTMLComponent_ButtonGroup();
group.Size = TsgcHTMLButtonGroupSize.bgsLarge;
group.AriaLabel = "View mode";

var btn = group.Items.Add();
btn.Text = "Day";
btn.ButtonStyle = TsgcHTMLButtonStyle.bsOutlinePrimary;
btn.Active = true;

btn = group.Items.Add();
btn.Text = "Week";
btn.ButtonStyle = TsgcHTMLButtonStyle.bsOutlinePrimary;

btn = group.Items.Add();
btn.Text = "Month";
btn.ButtonStyle = TsgcHTMLButtonStyle.bsOutlinePrimary;
btn.Disabled = true;

string html = group.HTML;   // Bootstrap btn-group

Referência

Principais propriedades & métodos

Os membros que você usa com mais frequência.

Items

Items é a coleção TsgcHTMLButtonItems; Items.Add retorna um TsgcHTMLButtonItem com Text, Href, Active, Disabled e ButtonStyle.

Estilo do item

O ButtonStyle de cada item (um TsgcHTMLButtonStyle como bsOutlinePrimary) define sua variante, e BtnClass o substitui por classes brutas; um Href renderiza o item como uma âncora em vez de um botão.

Tamanho & layout

Size escolhe bgsDefault, bgsSmall ou bgsLarge; Vertical empilha os botões em um btn-group-vertical.

Acessibilidade

AriaLabel define o aria-label do grupo para leitores de tela; GroupID atribui o id do seu elemento.

Saída

HTML retorna o wrapper btn-group e seus filhos botão / link — sirva-o ou atribua-o ao BodyContent de um template de página.

Recursos

Continue explorando

	Todos os Componentes sgcHTMLExplore a matriz completa de recursos com mais de 60 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

ButtonGroup