Bootstrap テンプレート
TsgcHTMLTemplate_Bootstrap — 任意の HTML ボディコンテンツを、テーマ、言語、テキスト方向を設定可能な完全かつ自己完結型の Bootstrap 5 ドキュメントにラップします。
TsgcHTMLTemplate_Bootstrap — 任意の HTML ボディコンテンツを、テーマ、言語、テキスト方向を設定可能な完全かつ自己完結型の Bootstrap 5 ドキュメントにラップします。
sgcHTML の最も低レベルなドキュメントラッパーです。コンポーネントで構成した HTML を BodyContent に割り当て、ドキュメントレベルの設定を行い、HTML を読み取ることで、アセットが埋め込まれた展開可能な自己完結型の Bootstrap 5 ページを取得できます。
TsgcHTMLTemplate_Bootstrap
完全な Bootstrap 5 ドキュメントラッパー
Delphi, C++ Builder, .NET
BodyContent にレンダリングされたコンポーネント HTML を設定し、必要に応じて Title、HtmlTheme、HtmlLang を設定してから、HTML プロパティを読み取ることで完全な展開可能なページを取得できます。
uses
sgcHTML_Template_Bootstrap;
var
oTemplate: TsgcHTMLTemplate_Bootstrap;
begin
oTemplate := TsgcHTMLTemplate_Bootstrap.Create(nil);
try
oTemplate.Title := 'My App';
oTemplate.HtmlTheme := 'dark';
oTemplate.HtmlLang := 'en';
oTemplate.BodyContent := oNavBar.HTML + oGrid.HTML;
Response.ContentText := oTemplate.HTML;
finally
oTemplate.Free;
end;
end;TsgcHTMLTemplate_Bootstrap *oTemplate = new TsgcHTMLTemplate_Bootstrap(NULL);
try
{
oTemplate->Title = "My App";
oTemplate->HtmlTheme = "dark";
oTemplate->HtmlLang = "en";
oTemplate->BodyContent = oNavBar->HTML + oGrid->HTML;
Response->ContentText = oTemplate->HTML;
}
__finally { delete oTemplate; }var template = new TsgcHTMLTemplate_Bootstrap();
template.Title = "My App";
template.HtmlTheme = "dark";
template.HtmlLang = "en";
template.BodyContent = navbar.HTML + grid.HTML;
response.ContentText = template.HTML;最もよく使うメンバーです。
ドキュメントの <body> 内に配置される HTML フラグメントです。ここに sgcHTML コンポーネントの連結された出力を割り当てます。
ドキュメントヘッド内の <title> 要素のテキストです。
<html> 要素の data-bs-theme に書き込まれる文字列です（例: 'light' または 'dark'）。これにより Bootstrap のカラーシステムが正しく切り替わります。ライト / ダーク / システムの自動切り替えには、TsgcHTMLThemeBuilder（Mode = tmLight、tmDark、または tmSystem）を ThemeBuilder プロパティに接続します。
<html> 要素の lang 属性です。デフォルトは 'en' です。sgcHTML は 17 言語にローカライズされた組み込みの UI テキストも同梱しており、sgcHTMLSetLanguage で選択できます。これにより、コンポーネントは正しいネイティブ文字（CJK、キリル文字、アラビア文字を含む）でレンダリングされます。
右から左への言語サポートのために dir 属性に書き込まれる文字列です（例: 'ltr' または 'rtl'）。
<head> に注入される追加の HTML です。カスタムの <meta> タグや追加の <script> 参照に使用します。インラインの <style> ブロックには CustomCSS と組み合わせて使用します。