Banana.Report.ReportStyleSheet

Documentation •
In this article

The class Banana.Report.ReportStyleSheet is used to set the styles to format a report.

Page size and orientation

At this moment the report is rendered based on the page size defined in the default printer device.
You can't define a page size, but you can set the orientation with the Style @page.

Page orientation can't be set only once per report, you can't switch from potrait to landscape. 


var stylesheet = Banana.Report.newStyleSheet();
stylesheet.addStyle("@page").setAttribute("size", "landscape");

Methods

addStyle(selector)

Create a new style with the given selector. The return object is of type Banana.Report.ReportStyle.

The syntax of selector follows the CSS specification.

  • Style name without a preceding dot are reserved predefined tags like "td", "p", "table"
  • Style name for new class need a preceding point ".myStyle" in the addStyle method.
    The dot name is not used when adding the class name to the element

report.addParagraph("Text to print 24pt", "myStyle");
var style = stylesheet.addStyle(".myStyle");
myStyle.setAttribute("font-size", "24pt");
myStyle.setAttribute("text-align", "center"); 

report.addCell("Text to print");
var styleTd = stylesheet.addStyle("td");
styleTd.setAttribute("font-weight", "bold");

 

addStyle(selector, attributes)

Create a new style with the given selector and attributes. The return object is of type Banana.Report.ReportStyle.

The syntax of selector and attributes follow the CSS specification.


var style2 = stylesheet.addStyle(".style2", "font.size: 24pt; text-align: center");
 

parse(text)

Load the styles from the given text. The text follow the CSS specification.


stylesheet.parse(
  "p.style1 {font-size:24pt; text-align:center;}" +
  "@page {size:A4 landscape;}"
  );

See the How to use CSS file  tutorial example.

 

The selector

The selector follows the css syntax, following you will find some examples:

SelectorSelected elements
.xyz

Select all elements with class xyz

NB.: When you set the class to a ReportElement you enter the name without '.'

tableSelect all tables
table.xyzSelect all tables with class xyz
table.xyz tdSelect all cells in tables with class xyz
 
Tag selectors
@pagepage
bodycontent of the report
pheadpage header
pfootpage footer
divsection
pparagraph
tabletable
captiontable caption
theadtable header
tbodytable body
tfoottable footer
trtable row
tdtable cell

 

You can get the tag of an element through the method getTag();

 

Tell us how we can help you better
If the information on this page is not what you're looking for, is not clear enough, or is not up-to-date, let us know.

Share this article: Twitter | Facebook | LinkedIn | Email