Home Components HTML CSS Demo Download Help Reports Editor Gallery Order Contacts

HTML Report Library

HRL is a template-based reporting library for Delphi, designed to generate reports using databases and XML.

Templates are simple HTML files containing special tags, and output is pure HTML suitable for displaying in any browser and sending by mail (all of the graphics are directly integrated into the text, so when sending mail you don't have to attach pictures separately).

HRL can be used in client applications to generate and view report inside the program, and in server applications or Web-servers. As a template language HRL uses widely known Mustache with some extensions.

Build-in powerful scripting and expression evaluation engine allow to implement complex data processing algorithms and encapsulate all logic inside report.

Library supports all versions of Delphi from Delphi 5 to Delphi 10.2 Tokyo, and also supports Unicode for old non-unicode versions of Delphi using widestring.
Supported platforms: VCL Win32/54, FMX Win32/64, MacOS (also Android and iOS, but without printing).

HRL fully supports Right-to-Left languages, including order of table columns and location of chart data.

HRL supports major data-access components (FireDac, IBX, UIB, DOA, Unidac). Adapters for other libraries could be implemented very simply and takes not more than 10 minutes.

HRL is totally based on HTML Component Library and includes full version of HCL, so HCL users with active subscription could upgrade to HTML Report Library paying only difference.

HTML Report Library Manual
HTML Report Library Online Manual
HTML Scripter Manual
Compiled demo (Win32) Trial for Delphi 5 - Tokyo

Overview

Report template is a standard HTML file and could contain any of HTML 4.01 tags and most CSS3 properties. To generate content HRL uses special tags such as: DATAPACKET - to generate table data CHART - to generate charts BARCODE - to generate barcodes. It is possible to register additional custom tags. After first processing cycle special tags replaces their content with generated HTML, so the output is always pure HTML and could be displayed in any browser.

Hello World!

Simplest report looks like
Hello world!
Enclosing tags (<html>) are not necessary.

Templates

HRL uses Mustache template syntax. Context variables are set as XML objects, where attributes are treated as variables and nodes as sections For example, passing a object
<animals>
 <animal name="Dog" color="yellow"/>
 <animal name="Bird" color="green"//>
</animals>
To the template
<html/>
 {{#animals}}
 <p style="color: {{color}}">{{name}}</p>
 {{/animals}}
</html>
result:

dog

bird

Document-level templates are processed after special tags, so data generated during tags processing (for example, from the database using DATAPACKET tag) could be used anywhere in the report.

Template processing exclusion

Some parts of the document (for example internal DATAPACKET templates) should not be processed at the document parsing stage. For such cases, there is a special exception of mustache syntax: tags beginning with template- are not processed.

Pseudo-sections and special variables

-first  section is processed only at first iteration of loop
-last section is processed only at last iteration of loop
-index  loop counter starting from 1
. - reference to the current context (used in cycles)
.. reference to the context of the upper level (used in cycles)
@ var - nested variable  - {{ {{var}} }}

Example of logical sections

For example, we have a list of employees, some of whom have e-mails. Those names should be displayed as a link, and the rest - as a plain text. For this, data must contain a flag field with value of true or false. For example:
<list>
 <employee name="Willis" email="bruce@hollywood.com" hasemail="true"/>
 <employee name="Stallone" />
</list>

template:
{{#employee}}

 {{#hasemail}
   <a href="{{email}}">{{name}}</a><br/>
 {{/hasemail}

 {{^hasemail}
  {{name}}<br/>
 {{/hasemail}

{{/employee}}
Result:
Willis
Stallone

Template functions

Sections can be either functions. If a name of the section coincides with the registered function, the function applies to the entire contents of the section. For example: {{#upper}} {{name}} {{/upper}} will output a variable name in uppercase. Functions are registered globally for the entire project: type THtTemplateFunction =function(s: hstring): hstring; procedure RegisterHtTemplateFunction(const Name: string; TF: THtTemplateFunction); Template function example Consider we need to display each letter of some text in a separate box. First we register the function:
function CharstoRects(const s: hstring): hstring;
var i: integer;
begin
 Result:='';
 for i:=1 to length(s) do 
  Result:=Result+'<div class="charrect">'+s[i]+'</div>';
end;
And set styles in report
.charrect {
 display: inline-block; 
 width: 20px; 
 height: 20px; 
 border: solid black 1px; 
 padding: 2px;
 text-align: center;
}

{{#charstorects}}Sample text{{/charstorects}

Pagination

To control pagination use CSS page-break-before, page-break-after and page-break-inside properties. These properties are valid only for block elements. For example, if we want to start new page before each h2 element:
h2 {page-break-before: always}
To insert a page break at a random location there is special element defined in standard report styles: pagebreak. To start a new page just put it anywhere.
<pagebreak/>

Header and Footer

To display headers and footers use CSS property position = running (heading / footer) Standard report style declares two classes: .pageheader and . pagefooter allowing display element in a header or footer. For example
<div class="pageheader">
 Fish world
</div>
To display a page number use CSS property content: counter (page) Standard report style declares .page class for displaying page numbers. For example
<div class="pageheader">
 Fish world. Page: <span class="page"/>
</div>