Spinner

TsgcHTMLComponent_Spinner — 以边框或增长样式渲染一个 Bootstrap 5 加载旋转器,带有尺寸、颜色和无障碍文本,适用于 Delphi、C++ Builder 和 .NET。

TsgcHTMLComponent_Spinner

一个加载旋转器组件,发出 Bootstrap 5 spinner 标记。选择旋转器类型、尺寸和颜色,然后读取 HTML 属性 — 或调用静态 Build 辅助方法实现一行代码。

组件类

TsgcHTMLComponent_Spinner

渲染为

Bootstrap 5 旋转器标记

语言

Delphi, C++ Builder, .NET

一行代码构建,或完整配置它

调用 Build(spinnerType, color, size) 可快速创建旋转器,或创建组件、设置 SpinnerTypeSizeColorStyle,然后读取 HTML

uses
  sgcHTML_Enums, sgcHTML_Component_Spinner;

// One-line static helper (primary form):
var
  vHTML: string;
begin
  vHTML := TsgcHTMLComponent_Spinner.Build(spBorder, hcPrimary, ssNormal);
  WebModule.Response := vHTML;
end;

// Or configure it fully:
var
  oSpin: TsgcHTMLComponent_Spinner;
begin
  oSpin := TsgcHTMLComponent_Spinner.Create(nil);
  try
    oSpin.SpinnerType := spGrow;
    oSpin.Size := ssSmall;
    oSpin.ColorStyle := hcSuccess;
    oSpin.Text := 'Loading...';
    oSpin.SpinnerID := 'loader';

    WebModule.Response := oSpin.HTML;   // Bootstrap spinner markup
  finally
    oSpin.Free;
  end;
end;
// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Spinner.hpp

// One-line static helper (primary form):
String html = TsgcHTMLComponent_Spinner::Build(spBorder, hcPrimary, ssNormal);

// Or configure it fully:
TsgcHTMLComponent_Spinner *oSpin = new TsgcHTMLComponent_Spinner(NULL);
try
{
  oSpin->SpinnerType = spGrow;
  oSpin->Size = ssSmall;
  oSpin->ColorStyle = hcSuccess;
  oSpin->Text = "Loading...";
  oSpin->SpinnerID = "loader";

  String body = oSpin->HTML;   // Bootstrap spinner markup
}
__finally
{
  delete oSpin;
}
using esegece.sgcWebSockets;

// One-line static helper (primary form):
string html = TsgcHTMLComponent_Spinner.Build(TsgcHTMLSpinnerType.spBorder,
    TsgcHTMLColor.hcPrimary, TsgcHTMLSpinnerSize.ssNormal);

// Or configure it fully:
var spin = new TsgcHTMLComponent_Spinner();
spin.SpinnerType = TsgcHTMLSpinnerType.spGrow;
spin.Size = TsgcHTMLSpinnerSize.ssSmall;
spin.ColorStyle = TsgcHTMLColor.hcSuccess;
spin.Text = "Loading...";
spin.SpinnerID = "loader";

string body = spin.HTML;   // Bootstrap spinner markup

关键属性与方法

您最常使用的成员。

类型

SpinnerType 通过 TsgcHTMLSpinnerType 选择 spBorder(旋转圆环)或 spGrow(脉动圆点)。

尺寸

Size 通过 TsgcHTMLSpinnerSize 选择 ssNormalssSmall

颜色

ColorStyle 接受一个 TsgcHTMLColor(如 hcPrimaryhcSuccess);Color 接受原始的 Bootstrap 颜色名称字符串。

可访问性

Text 设置由屏幕阅读器读出的视觉隐藏状态标签(默认为当前区域的 "Loading..." 文本)。

标识

SpinnerID 分配元素 id,以便您可以从 JavaScript 显示或移除旋转器。

静态辅助方法与输出

Build(spinnerType, color, size) 返回一个现成的旋转器;HTML 发出带有其角色和隐藏文本的 Bootstrap 旋转器标记。

继续探索

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

准备好开始了吗?

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