En bref

TsgcHTMLComponent_ButtonGroup

Un composant de groupe de boutons qui émet un btn-group Bootstrap 5. Ajoutez des éléments-boutons, définissez le style et l'état de chacun, puis lisez la propriété HTML.

Classe du composant

TsgcHTMLComponent_ButtonGroup

Produit

Du balisage btn-group Bootstrap 5

Famille

Navigation & Structure

Langages

Delphi, C++ Builder, .NET

QuickStart

Créez-le, ajoutez des boutons, affichez-le

Ajoutez des éléments-boutons, définissez le Text, le ButtonStyle et l'indicateur Active de chacun, choisissez une Size, puis lisez HTML (ou intégrez-le dans une page 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

Référence

Propriétés & méthodes clés

Les membres que vous utilisez le plus souvent.

Items

Items est la collection TsgcHTMLButtonItems ; Items.Add renvoie un TsgcHTMLButtonItem avec Text, Href, Active, Disabled et ButtonStyle.

Style d'élément

Le ButtonStyle de chaque élément (un TsgcHTMLButtonStyle tel que bsOutlinePrimary) définit sa variante, et BtnClass le remplace par des classes brutes ; un Href rend l'élément comme une ancre au lieu d'un bouton.

Taille & mise en page

Size choisit bgsDefault, bgsSmall ou bgsLarge ; Vertical empile les boutons en un btn-group-vertical.

Accessibilité

AriaLabel définit l'aria-label du groupe pour les lecteurs d'écran ; GroupID attribue l'identifiant de son élément.

Sortie

HTML renvoie le conteneur btn-group et ses boutons / liens enfants — servez-le, ou affectez-le au BodyContent d'un modèle de page.

Ressources

Continuez l'exploration

	Tous les composants sgcHTMLParcourez la matrice complète des fonctionnalités de plus de 60 composants.	Ouvrir
	Télécharger la version d'essai gratuiteLa version d'essai de 30 jours fournit les projets de démonstration 60.HTML.	Ouvrir
	TarifsLicences Single, Team et Site avec code source complet.	Ouvrir

ButtonGroup