可視化報(bào)告生成器FastReport VCL功能指南：從Delphi / C ++ Builder / Lazarus創(chuàng)建HTML / HTML5分層文件

---

報(bào)表生成器FastReport VCL是用于在軟件中集成商務(wù)智能的現(xiàn)代解決方案。它提供了可視化模板設(shè)計(jì)器，可以訪問(wèn)最受歡迎的數(shù)據(jù)源，報(bào)告引擎，預(yù)覽，將過(guò)濾器導(dǎo)出為30多種格式，并可以部署到云，Web，電子郵件和打印中。

近日，F(xiàn)astReport VCL更新至v6.7，在新版本中，添加了對(duì)最新版本IDE的支持，簡(jiǎn)化了用于付款標(biāo)準(zhǔn)的條形碼的創(chuàng)建，新增從預(yù)覽窗口直接編輯RichView的功能，同時(shí)修復(fù)了多個(gè)Bug問(wèn)題。歡迎下載體驗(yàn)。（點(diǎn)擊下方按鈕下載）

點(diǎn)擊下載最新版FastReport VCL

"如何從Delphi中以HTML文件格式保存？"、"如何從Delphi中創(chuàng)建HTML 5文件？"、"如何從Lazarus中創(chuàng)建HTML 5文件？" - 這些問(wèn)題經(jīng)常在開(kāi)發(fā)人員中出現(xiàn)。

HTML文件是用超文本標(biāo)記語(yǔ)言（HTML）編寫(xiě)的。它的作用是創(chuàng)建相對(duì)簡(jiǎn)單但設(shè)計(jì)精美的文檔。從一開(kāi)始就談?wù)揌TML是沒(méi)有意義的。但值得糾結(jié)的是一些功能--HTML可以是不同的--有表格和分層布局，HTML 4和HTML 5標(biāo)準(zhǔn)。

由于HTML5，網(wǎng)頁(yè)已經(jīng)學(xué)會(huì)了在用戶(hù)的瀏覽器中本地存儲(chǔ)數(shù)據(jù)，這允許你拒絕HTTP cookie。內(nèi)容的傳遞更快、更安全。HTML5還簡(jiǎn)化了跨瀏覽器的過(guò)程，增加了對(duì)矢量圖形的支持，無(wú)需Silverlight或Flash等第三方程序。

從Delphi或Lazarus生成HTML的選項(xiàng)有哪些？

①如果你只需要顯示一個(gè)頁(yè)面一次，而且格式不是很重要，那么最好的選擇是使用標(biāo)簽--前提是至少在你的腦海中已經(jīng)建立了整個(gè)生成的HTML文件的模型。,
- 太簡(jiǎn)單了! 甚至可以使用 writeln(...)! 這種方法的優(yōu)點(diǎn)是，你可以立即將文件上傳到FTP，它將出現(xiàn)在網(wǎng)站上，任何瀏覽器都能打開(kāi)它。但也有缺點(diǎn)--這個(gè)文件不是用來(lái)打印的(!)，而且每個(gè)瀏覽器的顯示方式都不一樣，甚至同一個(gè)瀏覽器的屏幕分辨率也不一樣。

②專(zhuān)門(mén)的庫(kù)。delphihtmlcomponents有一個(gè)可視化編輯器，并宣稱(chēng)完全支持HTML 4.1和CSS 3.但目前來(lái)看在HiDPI上并不好看。

③使用FastReport VCL將Delphi中的內(nèi)容立即保存為HTML。我們創(chuàng)建任何種類(lèi)和大小的文檔，多頁(yè)，多尺寸，我們可以立即看到并評(píng)估文檔，然后再以HTML格式保存。還有大量的附加對(duì)象--條形碼、地圖、圖片、圖形基元。現(xiàn)在你可以把它發(fā)送到HTML/HTML5 Layered！

保存時(shí)HTML和HTML5的區(qū)別

我們到底應(yīng)該用Delphi創(chuàng)建哪種HTML？表格式還是分層式？HTML還是HTML5？讓我們仔細(xì)看看它們的設(shè)置。

此時(shí)，我們應(yīng)該已經(jīng)組裝好了一個(gè)帶有導(dǎo)出組件的項(xiàng)目。啟動(dòng)、查看并從預(yù)覽中保存它。現(xiàn)在是時(shí)候從預(yù)覽中調(diào)用導(dǎo)出并選擇所需的格式了。

導(dǎo)出參數(shù)足夠豐富。我們可以保存整個(gè)文檔，而不是只保存一個(gè)HTML頁(yè)面。它將包括樣式、同一文件夾中的附加文件、導(dǎo)航器等很多很多。

這里的特殊之處在于，導(dǎo)出本身可以由多個(gè)文件組成，它支持圖片，并將其保存為不同的文件，但外觀和文件大小非常依賴(lài)于報(bào)表模板。

下面是每種格式的設(shè)置，可以進(jìn)行比較。

FastReport工具可以幫助我們選擇要導(dǎo)出文檔的哪些頁(yè)面、特定頁(yè)面或范圍。導(dǎo)出設(shè)置包括：

• 樣式--導(dǎo)出樣式。當(dāng)然，禁用此選項(xiàng)會(huì)加快導(dǎo)出過(guò)程，但會(huì)使文件的外觀惡化。
• All in one folder - 將所有附加文件與主文件 "index.html "保存在同一個(gè)文件夾中。
• 頁(yè)面導(dǎo)航--將創(chuàng)建一個(gè)特殊的導(dǎo)航器，以加快頁(yè)面導(dǎo)航速度。
• 固定寬度--當(dāng)調(diào)整視圖窗口大小時(shí)，阻止自動(dòng)改變表格寬度。
• 多頁(yè)當(dāng)選擇該選項(xiàng)時(shí)，每個(gè)頁(yè)面將被寫(xiě)入一個(gè)單獨(dú)的文件。
• 背景導(dǎo)出分配給報(bào)表頁(yè)面的背景圖形對(duì)象。

我們還可以指定文件的發(fā)送位置--保存在本地存儲(chǔ)或上傳到云端或FTP，或者以電子郵件的形式發(fā)送。

最后，導(dǎo)出后打開(kāi)--導(dǎo)出后生成的文件將立即被默認(rèn)的HTML瀏覽器打開(kāi)。設(shè)置完畢后，我們終于可以按 "確定 "按鈕了。準(zhǔn)備好了！

好了，這里我們已經(jīng)介紹了如何從Delphi中保存一個(gè)HTML / HTML5分層文件。

如何使用Delphi代碼保存HTML？

Export to HTML

procedure TForm1.Button1Click(Sender: TObject);
begin
 {Generate a report. The report must be generated before exporting}
 frxReport1.PrepareReport();
 {Set the range of pages to export. By default, all pages of the generated report are exported}
 frxHTMLExport1.PageNumbers := '2-3';
 {Set whether to export styles}
 frxHTMLExport1.ExportStyles := True;
 { Set whether to export images to the same directory with the resulting html file, or place the images in a separate directory}
 frxHTMLExport1.PicsInSameFolder := False;
 {Set whether to add navigation buttons to the resulting html file}
 frxHTMLExport1.Navigator := False;
 {Set whether to export with a fixed column width or whether the report will be displayed according to the browser window width}
 frxHTMLExport1.FixedWidth := True;
 {Set whether to export each page to a separate html file}
 frxHTMLExport1.Multipage := False;
 {Set whether to export the background of the generated report}
 frxHTMLExport1.Background := False;
 {Set whether to export pictures}
 frxHTMLExport1.ExportPictures := True;
 {Set in which format to export pictures}
 //uses frxImageConverter;
 // TfrxPictureType = (gpPNG, gpBMP, gpJPG {$IFNDEF FPC}, gpGIF, gpEMF, gpWMF{$ENDIF})
 frxHTMLExport1.PictureType := gpPNG;
 {Set whether to open the resulting file after export}
 frxHTMLExport1.OpenAfterExport := False;
 {Set whether to display export progress
  (show which page is currently being exported)}
 frxHTMLExport1.ShowProgress := False;
 {Set whether to display the export filter settings dialog box}
 frxHTMLExport1.ShowDialog := False;
 {Set the name of the resulting file.}
 {Please note that if you do not set the file name and disable the export filter dialog box,}
 {the file name selection dialog will still be displayed}
 frxHTMLExport1.FileName := 'C:\Output\test.html';
 {Export the report}
 frxReport1.Export(frxHTMLExport1);
end;

Export to HTML (Layered)

procedure TForm1.Button2Click(Sender: TObject);
begin
 {Generate a report. The report must be generated before exporting}
 frxReport1.PrepareReport();
 {Set the range of pages to export. By default, all pages of the generated report are exported}
 frxHTML5DivExport1.PageNumbers := '2-3';
 {Set whether to export styles}
 frxHTML5DivExport1.EmbeddedCSS := True;
 {Set whether to convert all images in accordance with PictureFormat:}
 {if the image in the report is in BMP format and the PictureFormat is PNG, then BMP will be saved in PNG format}
 frxHTML5DivExport1.UnifiedPictures := True;
 {Set whether to format the HTML source text (increases the size of the resulting file)}
 frxHTML5DivExport1.Formatted := False;
 {Set whether to export pictures}
 frxHTML5DivExport1.EmbeddedPictures := True;
 {Set whether to export each page to a separate HTML5Div file}
 frxHTML5DivExport1.Multipage := False;
 {Set whether to add navigation buttons to the resulting HTML5Div file}
 frxHTML5DivExport1.Navigation := False;
 {Set in which format to export pictures}
 //uses frxExportHelpers;
 // TfrxPictureFormat = (pfPNG, {$IFNDEF FPC}pfEMF,{$ENDIF} pfBMP, pfJPG);)
 frxHTML5DivExport1.PictureFormat := pfPNG;
 {Set whether to open the resulting file after export}
 frxHTML5DivExport1.OpenAfterExport := False;
 {Set whether to display export progress
  (show which page is currently being exported)}
 frxHTML5DivExport1.ShowProgress := False;
 {Set whether to display the export filter settings dialog box}
 frxHTML5DivExport1.ShowDialog := False;
 {Set the name of the resulting file.}
 {Please note that if you do not set the file name and disable the export filter dialog box,}
 {the file name selection dialog will still be displayed}
 frxHTML5DivExport1.FileName := 'C:\Output\test.html';
 {Export the report}
 frxReport1.Export(frxHTML5DivExport1);
end;

讓我們看一下結(jié)果HTML文件之間的區(qū)別。

這些是已保存的HTML和HTML5文件的屬性。這些文件的大小是顯而易見(jiàn)的。導(dǎo)出為HTML格式的文檔基本上比HTML5小2倍。現(xiàn)在讓我們比較瀏覽器中保存的文檔的外觀：

普通的HTML文件不會(huì)顯示諸如框架及其陰影框陰影之類(lèi)的元素。

如果使文檔更復(fù)雜，則這種區(qū)別將更加明顯。讓我提醒您，此導(dǎo)出不只支持不同的標(biāo)準(zhǔn)-我們正在處理創(chuàng)建HTML的不同方法。在第一種情況下，使用的是固定表-當(dāng)然，這個(gè)示例更面向表。例如，如果我們需要帶有插圖的報(bào)告，則結(jié)果將大不相同。

讓我們看一下在FastReport報(bào)表中使用地圖的示例。區(qū)別很明顯！

讓我們看看HTML頁(yè)面的另一面，并出于說(shuō)明目的查看其代碼。

還想要更多嗎？您可以點(diǎn)擊閱讀【FastReport 報(bào)表2020最新資源盤(pán)點(diǎn)】，查找需要的教程資源。如果您有任何疑問(wèn)或需求，請(qǐng)隨時(shí)加入FastReport技術(shù)交流群（783996712），我們很高興為您提供查詢(xún)和咨詢(xún)。