Getting Started‎ > ‎

Customize Invoice Format Using Jasper Report

What you need to know

This is the primary program that you will use to create those jasper report printables. Where the old method involved a lot of blind positioning using HTML code and reprints, iReport lets you design printables by showing exactly where the fields will appear on a scaled version of the paper, complete with rulers.

Ideally, the fields should appear on the paper exactly where you placed them in iReport. However, this will not happen due to the fact that there are a majority of printable which will be done using Panasonic KX-P1121 dot matrix printers manned by users who are not familiar with such printers. Users will find that the test printout will go from exact placement to perhaps, 5cm too high or low of the designated target spot. Hence, the need for much tolerance testing and the inclusion of buffer zones to mitigate paper placement drift.

When you open iReport, you will make use of following 3 parts most of the time:
  • Header
  • Detail
  • Footer



1. Get a Reference

Before clicking on the new document button, please be aware that there are many previous designs you can adopt from (optional), as invoice / cashbill formats take roughly the same form regardless of company. Therefore, the first step is to obtain an existing jasper reports xml here. Save it and use that as a base.
  • cashbill_chome_A4.jrxml - Can also be used for an invoice.
  • cashbill_justpc_preprinted_halflette - Cannot be used for an invoice. This is specifically for cashbill only. Difference with the one above is that the format includes additional information such as, cash amount (how much is paid by customer), cheque number, credit card number and date.

2. Open iReports
  • Folder iReport-nb-3.1.4 > bin > iReport.exe
  • Open one of the references saved above:
    • File > Open > Select a file as above
  • You will be able to see the example format in the scale box. If the format does not appear in a grid,
    • File > View > Report Designer > Show Grid
  • Depending on what size of paper you want to print on (eg. letter, A4), change the setup on iReport as well.
    • File > Page Setup > Change the paper size

3. Measurement

As a start, you should have at least a copy of your assigned printable in your hands (hard copy). See example below:

  • Using a ruler, start measuring and marking out the limits of each field on the copy. 
    • Header - Measure from the top of the page.
    • Details - No need to measure as it differs according to the size of the paper and the number of items purchased.
    • Footer - Start from the bottom of the details. Th ruler in iReports also starts from 0cm, making it easier for users to measure.
  • It is recommended to use cm and mm instead of inches because the measurement would be more accurate.
  • To change the ruler scale in iReport, Tools > Option > Default Unit > cm.
  • To change the ruler scale in linux verion of iReport you can find the Default Unit under the General tab in Options>Settings

4. Edit and Customize

Please do not edit anything inside the fields unless you are absolutely sure of it. Otherwise, just follow the templates given.
  • However, you may drag the fields around according to your draft and measurements as above. Refer to the rulers at the top and on the left.
  • The fields are divided into 2 types:
    • Static text - The text sits there and does not move or change.
    • Variable text - Text follows the information in Datasource (see Step 11 for definition of technical terms).
  • Add a text field
    • Static text - From the Palette, click on text field and 'Drag and Drop' to the location. 
    • Variable text - From Report Inspector, choose:
      • Parameters - You can add it yourself. Please refer Step 11.
      • Field - From Report Query.
  • Edit the text -  Select the field. Go to Text Field Properties, then click Text Field Expression and edit.
  • To change the font and size, just a step below, go to Text Properties. You can also tick Bold, Italic or Underline for specific texts. 
  • Also, if you want to change the alignment of the text in the fields, just click the text box. Then, select the appropriate options from the drop-down lists, Vertical Alignment and Horizontal Alignment.
  • Fields can be copied and pasted across different formats. This makes it incredibly convenient for you, if not all the fields are found on the reference xml format.
  • You may also set the space in between 2 fields by clicking on that particular space, then from the Band Properties, adjust the band height and width.

5. Breakdown

a. Page Header
  • Rulers
    • To change the scale, refer measurement above.
    • Click on the rulers and blue dotted lines will appear to assist you to make strict alignment when shifting the fields around.
  • Logo - Logo Path
    • Click and drag the size of logo you want to show.
    • The logo of each Branch can be uploaded in the EMP. Please refer Images Manager and Branch Listing.
  • The Company Name and Address, Billing Name and Address, Recipient Name and Address - Information must be extracted from the user company's database. Please install iReport on the same pc as the server, so as to share the same hard disk.
  1. To add new Datasource in iReport
  2. Tools > Report Datasource 
  3. Click 'New'.
  4. Select 'Database JDBC Connection'.
  5. Name - Database name eg. wsemp (default name)
  6. JDBC Driver - PostgreSQL (org.postgresql.Driver)
  7. JDBC URL - jdbc:postgresql://your server ip:5432/wsemp
  8. Username - jboss
  9. Password - null
  10. Tick 'Save Password'.
  11. Click 'Save'.

  • Top right corner - Extracted from EMP itself.
    • Cashbill - PKID
    • Date
    • Page number - Eg. 1 of 4. If you want to shift this around, please shift both the small boxes and do not attempt to combine both into one box.
    • Cashier name - EMP username login.
    • Salesman name
    • Reference number - Entered by the user in EMP when creating an invoice.
    • Telephone number
    • Fax number
  • Labels - What details to be displayed. You may add any other information as well.
    • No.
    • Description
    • Quantity
    • Unit price
    • RM amount
b. Details
  • Details of items purchased by customers as of the labels above.
  • The details text field need not be re-sized. If there more than one items to appear here, iReport will automatically fit all the items in the details area.
c. Page Footer
  • This part only appears on the last page of the invoice. Eg. If the invoice runs over to 3 pages, this page footer will appear on the third page.
  • Normally, users would want to include the following here:
    • Total amount to be paid
    • Terms and Conditions
    • Remarks - From EMP invoice created.
    • Details of Payments - From EMP.
    • Customer's signature - Customer signs on the printed copy.

6. Problems
Sometimes when iReport does not respond to any changes made or the xml format is messed up, means a problem has occurred. To open 'Report Problems Window', click Window > Report Problems. Double click the problem and users will be able to identify the problems and rectify it.
  • Common problems:
    • Text field lines overlap from eg. details to page header.
    • Expression class - For a text, if it was set to Java Language Integer instead of String (when you copy and paste at a wrong place)
    • If a text field is placed on a between 2 bands.

7. Preview
  • Click Preview from the menu. Select what format you want to preview eg. PDF, HTML, XLS, CSV.
  • Click Preview from the toolbar. Enter the invoice PKID to generate the file.
  • Open your iReport folder (from where you have downloaded to, find the preview PDF saved there).
  • You may skip this step and go straight to Uploading, then test and preview at the same time when printing the invoice.

8. Uploading
Once you are satisfied with the invoice, save the mxl format file and upload it into EMP. Please refer File Manager for step-by-step instructions.

9. Testing
  • You may print an existing invoice. 
  • Please see Invoice. After uploading the xml file, you can select the format from the drop-down list and click 'Set format'.
  • Enter an existing PKID Invoice and click 'Reprint Invoice'.
  • Make sure your testing involves continuous printing of at least 5 unbroken segments of fanfold letters. This is done to check if the alignment will run after a few prints. Also check if the words appear in its specific boxes and nothing is omitted in the printed invoice.

10. Troubleshoot

 Problem Solution
 Wrong alignment
 1. User has inaccurately measured the spaces / boxes / fields in
     the hard copy.
 2. Sometimes the paper size in iReport and printer settings are
 1. Re-measure the hard copy. Then click on the fields and move
     them around according to the measurements.
 2. As seen in Step 2 above, paper size in iReport was set.
     Before printing the invoice (Step 9), press-
     Ctrl P
> Properties > Paper Sizes
     Match both paper sizes (the size of paper printing invoice)
 Font inconsistencies
 1. Font type different.
 2. Font size too small or big.
 Click the text field and edit-
 1. Properties > Text Properties > Font Name
 2. Properties > Text Properties > Font Size
 Omission of certain words.
 - Check if the word size is too big for the field text.
 - Re-size the box by pulling it bigger.
 Two text fields, next to each other, contains words. Sometimes the
 words are not in a straight line. Please see an example here.
 - Click on the text field, in Properties, change the height of both
   fields (eg, text fields in red) to the same height.
 - Make sure both fields have the same Vertical and Horizontal
 Eg. Invoice PKID missing.
 - There could be some error with the coding. Eg. Error when
   loading the Report Query, entering wrong expressions in text
   fields or inaccurate name in Parameters.
 Logo does not appear on the printed invoice.
 - Please check if the Logo URL in Branch Listing is correct.
 - If the Branch does not have a logo, remember to delete the
   logo path in iReport.

11. Technical Area - For ambitious users only. Otherwise, please use the templates attached below.
  • Datasource - Datasource is a reference to where the data is located. It describes where and how to access the data using parameters.
  • Parameters - Used by the Datasource. Defines things like location, username, password, etc.
  • PostgreSQL - The particular database server software used by EMP. It stores data, and allows you to query it based on conditions. to add the parameters in iReport, right click the 'Parameters' in Report Inspector > Add Parameter. After the Parameter appears at the bottom, right click and select 'Rename'. Then, enter the exact name. However, please obtain the names from us at Wavelet.
  • Report Query - Used to tell the database server what dataset is required. Please download the report query for Cashbill Report Query and Invoice Report Query first, then load it in iReport. Click this button to load the Query Report.

Unknown user,
Mar 18, 2009, 3:46 AM
Unknown user,
Mar 18, 2009, 3:46 AM
Unknown user,
Mar 17, 2009, 2:37 AM
Unknown user,
Mar 17, 2009, 2:38 AM
Unknown user,
Mar 18, 2009, 2:46 AM