Velocity is not a classic reporting generator like jasper or crystal reports. It's primarily function is to fill data into a template and use that to generate PDF.
But the parser supports @page extensions that allow you to define header and footer - search for CSS @page for more info.
It also supports a special property "-fs-table-paginate: paginate;" that allows you to repeat a table header on multiple pages as well.
See the attached PDF (with header and footer repeated on each pages, as well as table header) and here's the significant part of the template that generated it:
Note in particular the @page definition and div.header/div.footer and how they are placed:
- Code: Select all
<!DOCTYPE html>
<!-- HTML5 -->
<html lang="$!lang">
<head>
<title>$!title</title>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
<meta content="utf-8" http-equiv="encoding"/>
<style>
html, body, * {
font-family: 'Libre Franklin', Helvetica, Arial, sans-serif;
font-size: 10pt;
}
.container {
margin: auto;
}
.break {
page-break-after: always;
}
table {
-fs-table-paginate: paginate;
}
tr, td {
page-break-inside: avoid;
vertical-align: top;
}
.header {
width: 100%;
margin: 0px;
padding: 0px;
}
.footer {
width: 100%;
text-align: center;
margin: 0px;
padding: 0px;
font-size: 7pt;
}
div.header { display: none; }
div.header { display: block; position: running(header); }
div.footer { display: none; }
div.footer { display: block; position: running(footer); }
@page {
size: letter landscape;
counter-increment: page;
margin: 1.4in .4in .6in .4in;
@top-center {
content: element(header);
}
@bottom-center {
content: element(footer);
}
@bottom-right {
content: "Page " counter(page) " / " counter(pages);
font-family: 'Libre Franklin', Helvetica, Arial, sans-serif;
font-size: 7pt;
}
}
</style>
</head>
<body>
<div class="container">
<div class="header">
<table border="0" width="90%">
<tr>
<td width="15%"><img src="${serverURL}/assets/images/logo.png" class="logo"/></td>
<td><h2 style="text-align:center;font-weight:bold">#h($!header)</h2></td>
</tr>
</table>
</div>
<div class="footer">#h($!footer)</div>
<div class="row">
<div class="col-md-5">
#h($!demandeur)<br/><br/>
</div>
</div>
<div> etc... </div>
</div>
</body>
</html>
Posted: Tue Nov 16, 2021 2:25 am