sgcHTML 将您现有的 Delphi、C++ Builder 或 .NET 后端变成一个 Web 应用服务器。每个组件都是一个发出 Bootstrap 5 HTML 的原生类;htmx 让页面保持交互和实时,无需手写一行 JavaScript。
每个控件都是一个类 — TsgcHTMLComponent_Chart、TsgcHTMLComponent_Grid、TsgcHTMLComponent_Form 等 60 多个。设置其属性,然后读取其 HTML 属性,即可获得干净、可直接服务的 Bootstrap 5 标记。
放置一个 TsgcHTMLEngine_Server(或将 HTML 接入现有的 TsgcWebSocketHTTPServer)。请求到达您的 OnCommandGet 处理器;您用由组件构建的页面进行响应。无需外部 Web 技术栈。
添加一个 TsgcHTMX_Engine_Server,点击、表单提交和实时更新便会往返于您的 Pascal/C# 事件处理器。服务器就地替换 HTML 片段 — 拥有 SPA 般的体验,却没有任何 JavaScript 构建链。
由于 htmx 运行在 sgcWebSockets 服务器之上,您可以向每个已连接的浏览器推送实时 HTML。仪表板、监控器和聊天窗口会在您的数据变化的瞬间更新 — 由服务器驱动,无需轮询。
TsgcHTMLTemplate_Bootstrap 将您的内容包装成一个完整的响应式文档;TsgcHTMLThemeController 和 TsgcHTMLThemeBuilder 提供明亮/暗黑主题和共享样式表。Bootstrap 5.3 和 htmx 已内嵌发布 — 运行时无需 CDN。
Grid、DataTable、Chart、Select、TreeView、Scheduler、Timeline 和 Form 通过 LoadFromDataSet / DataSource 直接绑定到 TDataSet。将组件指向一个查询,它便会渲染出这些行。
从导航框架到数据网格、图表、表单、覆盖层和 AI 聊天 — 完整的 Bootstrap 5 词汇表,皆为原生组件。每一个都链接到自己的页面,附有 Delphi、C++ Builder 和 .NET 示例。
启动一个 HTTP 服务器,附加 htmx 引擎,然后用由组件构建的页面响应请求。Delphi、C++ Builder 和 .NET 中是相同的 API。
uses
sgcWebSocket_Server, sgcHTMX_Engine_Server,
sgcHTML_Template_Bootstrap, sgcHTML_Component_Chart;
// 1. Start a server and attach the htmx engine
FServer := TsgcWSHTTPServer.Create(nil);
FServer.Port := 8080;
FServer.OnCommandGet := HandleGet;
FHTMX := TsgcHTMX_Engine_Server.Create(nil);
FHTMX.Server := FServer; // realtime htmx over WebSocket
FServer.Active := True;
// 2. Build the page from components
function TForm1.BuildDashboard: string;
var
oChart: TsgcHTMLComponent_Chart;
oPage: TsgcHTMLTemplate_Bootstrap;
begin
oChart := TsgcHTMLComponent_Chart.Create(nil);
oPage := TsgcHTMLTemplate_Bootstrap.Create(nil);
try
oChart.ChartType := ctBar;
oChart.AddLabel('Q1'); oChart.AddLabel('Q2'); oChart.AddLabel('Q3');
oChart.AddDataset('Revenue', [1200, 1900, 1500],
'#7C3AED', 'rgba(124,58,237,.25)', True);
oPage.Title := 'Dashboard';
oPage.BodyContent := oChart.HTML; // component -> HTML
Result := oPage.GetHTML; // full Bootstrap document
finally
oPage.Free;
oChart.Free;
end;
end;
// includes: sgcWebSocket_Server.hpp, sgcHTMX_Engine_Server.hpp,
// sgcHTML_Template_Bootstrap.hpp, sgcHTML_Component_Chart.hpp
// 1. Start a server and attach the htmx engine
FServer = new TsgcWSHTTPServer(this);
FServer->Port = 8080;
FServer->OnCommandGet = HandleGet;
FHTMX = new TsgcHTMX_Engine_Server(this);
FHTMX->Server = FServer; // realtime htmx over WebSocket
FServer->Active = true;
// 2. Build the page from components
String __fastcall TForm1::BuildDashboard()
{
TsgcHTMLComponent_Chart *oChart = new TsgcHTMLComponent_Chart(NULL);
TsgcHTMLTemplate_Bootstrap *oPage = new TsgcHTMLTemplate_Bootstrap(NULL);
try
{
oChart->ChartType = ctBar;
oChart->AddLabel("Q1"); oChart->AddLabel("Q2"); oChart->AddLabel("Q3");
oChart->AddDataset("Revenue", OPENARRAY(double, (1200, 1900, 1500)),
"#7C3AED", "rgba(124,58,237,.25)", true);
oPage->Title = "Dashboard";
oPage->BodyContent = oChart->HTML; // component -> HTML
return oPage->GetHTML(); // full Bootstrap document
}
__finally
{
delete oPage;
delete oChart;
}
}
using esegece.sgcWebSockets;
// 1. Start a server and attach the htmx engine
var server = new TsgcWebSocketHTTPServer();
server.Port = 8080;
server.OnCommandGet += HandleGet;
var htmx = new TsgcHTMX_Engine_Server();
htmx.Server = server; // realtime htmx over WebSocket
server.Active = true;
// 2. Build the page from components
string BuildDashboard()
{
var chart = new TsgcHTMLComponent_Chart();
chart.ChartType = TsgcHTMLChartType.ctBar;
chart.AddLabel("Q1"); chart.AddLabel("Q2"); chart.AddLabel("Q3");
chart.AddDataset("Revenue", new double[] { 1200, 1900, 1500 },
"#7C3AED", "rgba(124,58,237,.25)", true);
var page = new TsgcHTMLTemplate_Bootstrap();
page.Title = "Dashboard";
page.BodyContent = chart.HTML; // component -> HTML
return page.GetHTML(); // full Bootstrap document
}
当您想用一行代码实现一个控件时,使用现成的组件;当您需要完全控制标记时,则深入到节点层。
60 多个 TsgcHTMLComponent_* 控件。配置属性,可选地绑定数据集,读取 HTML。许多组件还提供一个静态 Build(...) 辅助方法,用于一行内联使用。
TsgcHTMLContainer、TsgcHTMLCard、TsgcHTMLForm、TsgcHTMLField、TsgcHTMLButton、TsgcHTMLTable 等基本元素可组合成任意布局,然后用 TsgcHTMLTemplate_Bootstrap 渲染。
TsgcHTMLPageBuilder 及其设计时编辑器让您在 IDE 中组装页面,而 TsgcHTMLThemeController 在整个应用范围内管理明亮/暗黑主题。
将 sgcHTML 与我们的其他 Delphi、C++ Builder 和 .NET 组件库搭配使用。
企业级 WebSocket、HTTP/2/3、MQTT、AMQP、WebRTC 和 AI/LLM 组件。sgcHTML 通过同样的高性能 HTTP 和 WebSocket 服务器提供服务。
了解更多 →