Popover
TsgcHTMLComponent_Popover — Delphi、C++ Builder、.NET で、設定可能な配置、トリガー、解除動作を備え、タイトルと本文を持つ Bootstrap 5 ポップオーバーを任意のトリガー要素に付加します。
TsgcHTMLComponent_Popover — Delphi、C++ Builder、.NET で、設定可能な配置、トリガー、解除動作を備え、タイトルと本文を持つ Bootstrap 5 ポップオーバーを任意のトリガー要素に付加します。
トリガー要素を Bootstrap 5 の popover データ属性と自動初期化スクリプトで包むポップオーバーコンポーネントです。コンテンツ、タイトル、本文を設定してから、HTML プロパティを読み取ります — または、静的な Build ヘルパーを呼び出して一行で記述します。
TsgcHTMLComponent_Popover
Bootstrap 5 のポップオーバーマークアップ
Delphi, C++ Builder, .NET
ポップオーバーボタンには BuildButton(text, title, body, style, placement) を呼び出すか、コンポーネントを作成して Placement と Trigger を設定してから、HTML を読み取ります。
uses
sgcHTML_Enums, sgcHTML_Component_Popover;
// One-line static helper (primary form):
var
vHTML: string;
begin
vHTML := TsgcHTMLComponent_Popover.BuildButton('More info',
'Pricing', 'All licenses include full source code.',
bsPrimary, plTop);
WebModule.Response := vHTML;
end;
// Or configure it fully:
var
oPop: TsgcHTMLComponent_Popover;
begin
oPop := TsgcHTMLComponent_Popover.Create(nil);
try
oPop.Content := '<a href="#" class="btn btn-info">Details</a>';
oPop.Title := 'Shipping';
oPop.Body := 'Free delivery on orders over 50.';
oPop.Placement := plRight;
oPop.Trigger := ptHover;
oPop.Dismissible := True;
WebModule.Response := oPop.HTML; // trigger + popover init script
finally
oPop.Free;
end;
end;// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Popover.hpp
// One-line static helper (primary form):
String html = TsgcHTMLComponent_Popover::BuildButton("More info",
"Pricing", "All licenses include full source code.",
bsPrimary, plTop);
// Or configure it fully:
TsgcHTMLComponent_Popover *oPop = new TsgcHTMLComponent_Popover(NULL);
try
{
oPop->Content = "<a href=\"#\" class=\"btn btn-info\">Details</a>";
oPop->Title = "Shipping";
oPop->Body = "Free delivery on orders over 50.";
oPop->Placement = plRight;
oPop->Trigger = ptHover;
oPop->Dismissible = true;
String html = oPop->HTML; // trigger + popover init script
}
__finally
{
delete oPop;
}using esegece.sgcWebSockets;
// One-line static helper (primary form):
string html = TsgcHTMLComponent_Popover.BuildButton("More info",
"Pricing", "All licenses include full source code.",
TsgcHTMLButtonStyle.bsPrimary, TsgcHTMLPlacement.plTop);
// Or configure it fully:
var pop = new TsgcHTMLComponent_Popover();
pop.Content = "<a href=\"#\" class=\"btn btn-info\">Details</a>";
pop.Title = "Shipping";
pop.Body = "Free delivery on orders over 50.";
pop.Placement = TsgcHTMLPlacement.plRight;
pop.Trigger = TsgcHTMLPopoverTrigger.ptHover;
pop.Dismissible = true;
string html = pop.HTML; // trigger + popover init script最もよく使うメンバーです。
Content はトリガー要素の内側の HTML です。空の場合は、Title と ContentStyle から構築されたスタイル付きのボタンが代わりに使われます。
Title はポップオーバーの見出しを、Body はそのテキスト（Bootstrap の data-bs-content）を設定します。
Placement は、TsgcHTMLPlacement を介して plTop、plBottom、plLeft、plRight でポップオーバーを配置します。
Trigger は ptClick、ptHover、ptFocus、ptManual を選択します。Dismissible は、次の外側クリックでそれを閉じます。
AutoInit は、すべてのポップオーバーに対して new bootstrap.Popover を呼び出すスクリプトを追加します。スクリプトは InitScript で上書きできます。
Build(content, title, body, placement, trigger) と BuildButton(text, title, body, style, placement) はすぐに使えるマークアップを返します。HTML は、トリガーとその初期化スクリプトを出力します。