ButtonGroup

TsgcHTMLComponent_ButtonGroup — 渲染由按钮或链接组成的分段集合,带有激活和禁用状态,适用于 Delphi、C++ Builder 和 .NET。

TsgcHTMLComponent_ButtonGroup

一个按钮组组件,发出 Bootstrap 5 btn-group。添加按钮项目,设置每个项目的样式和状态,然后读取 HTML 属性。

组件类

TsgcHTMLComponent_ButtonGroup

渲染为

Bootstrap 5 btn-group 标记

语言

Delphi, C++ Builder, .NET

创建它、添加按钮、渲染它

添加按钮项目,设置每个 TextButtonStyleActive 标志,选择一个 Size,然后读取 HTML(或将其放入 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

关键属性与方法

您最常使用的成员。

Items

ItemsTsgcHTMLButtonItems 集合;Items.Add 返回一个带有 TextHrefActiveDisabledButtonStyleTsgcHTMLButtonItem

项目样式

每个项目的 ButtonStyle(如 bsOutlinePrimary 之类的 TsgcHTMLButtonStyle)设置其变体,BtnClass 用原始类覆盖它;提供 Href 会将该项目渲染为锚点而非按钮。

尺寸与布局

Size 选择 bgsDefaultbgsSmallbgsLargeVertical 将按钮堆叠成 btn-group-vertical

可访问性

AriaLabel 为屏幕阅读器设置该组的 aria-labelGroupID 分配其元素 id。

输出

HTML 返回 btn-group 包装器及其按钮 / 链接子元素 — 直接提供服务,或将其赋给页面模板的 BodyContent

继续探索

所有 sgcHTML 组件浏览 60 多个组件的完整功能矩阵。
下载免费试用版30 天试用版附带 60.HTML 演示项目。
价格Single、Team 和 Site 授权,均含完整源代码。

准备好开始了吗?

下载免费试用版,开始在 Delphi、C++ Builder 和 .NET 中构建 Web 界面。