Skip to main content
Previous sectionNext section

Editing the Report Layout

The Line Item Report Builder provides a graphical editor that lets you modify the default report format to improve the report output. The following section provides a brief introductory tutorial. The subsequent section describes the main elements of the Report Builder user interface.

Tutorial

In the following exercise, you create and modify the report layout for the data structure you defined in MyApp.MyReportDC.

  1. Click DeepSee, Visual Reporting, Report Builder and then Line Item Report Builder.

  2. Click New. The system displays a dialog box where you can enter the following values:

    1. Package Name — MyApp

    2. Class Name — MyReport

  3. Click OK.

  4. At the top of the Fields column, click Set source. The system displays a dialog box. Select the Data Collector you created previously, by clicking MyApp, then MyReportDC. At the top of the Fields column, click Auto-fill to create a default report.

  5. Click Preview to view the default report.

  6. In this step, you modify the report by removing the sysID data field.

    1. In the Report Body section, select either the sysID data field, or field label.

    2. Click Edit to open the editing toolbar, and click Cut.

    3. The sysID data field disappears from the report. If you want to add a data field to the report, drag it from the Fields column.

  7. Edit table properties.

    Select a component in the Report Body section. A collection of tools for formatting tables in reports appears in the Properties column.

    1. In the section labeled Borders and Dividers, select Toggle table border. It is the first selection in this section, and draws a border around the table.

    2. In the section labeled Borders and Dividers, select Toggle zebra striping in body. It is the last selection in this section, and applies zebra stripe coloration to rows in the table.

  8. Add an element to the report layout.

    Drag $pageNum from the Fields column and drop it in the Page Footer section. You can position this element by dragging it, or by editing values in the Size and Position section of the Properties column.

  9. Click Save.

  10. Click Preview to see the effect of your modifications.

Line Item Report Builder UI

The Line Item Report Builder provides a single view, which shows the report layout. It provides the following buttons:

  • Open – Open an existing report

  • New – Create a new report

  • Save – Save the current report

  • Setup – Opens the Page Set-up Dialog, which you can use to set characteristics for the printed page.

  • Preview – Creates a preview of PDF output of the current report

The Page Set-up Dialog lets you set the following parameters of the physical page the report is printed on:

  • The Page size – Select a page size from the dropdown list. The list of available paper sizes can be configured for your system. See Customizing Paper Options.

  • The Orientation – Select “Portrait” or “Landscape”

  • The Margins – You can set all four margins with the spinner control or by typing in the text field. Units used for margins reflect the units used to specify the paper size.

  • The Running Headers – You can choose to omit running headers on the first page, last page, or both.

When a report is open in the editor, the page is organized into the following columns:

  • Fields – lets you select a data source, and displays the available data fields. The Auto-fill button creates a default report layout.

  • Layout – the area where you edit the report layout. The column is divided into sections that correspond to the layout sections of the report. Buttons at the top of the column provide access to graphical editing tools.

  • Properties – lets you edit graphical properties of the report component selected in the Layout column.

The next sections discuss the content and function of these columns.

Fields Column

The fields column is empty until you select a data collector for the report with the Set source button. Once you have selected a data source, the Fields column lists the data fields you defined when you created the data collector, along with the additional fields runTime, RunBy, and $pageNum. You can drag and drop fields from the Fields column into the report layout column. When you begin to drag a field, report sections where you cannot drop it turn gray.

The Auto-fill button populates the layout section with a default report layout based on the selected data source.

Layout Column

The layout column is where much of the report layout editing takes place. The Auto-fill button in the Fields column, creates a default report layout in the layout column, which you can use as a starting point. The layout column is divided into a number of sections, and provides a variety of tools and controls.

Toolbar Buttons

Buttons at the top of the column provide access to graphical editing tools. Click on the button to open a toolbar, click again to close it. Once the toolbar is open, you can drag it to another part of the page. The following image shows the edit toolbar open and docked with the Edit button:

images/d2rpt_tools_edit.png

This image shows the edit toolbar after it has been dragged away from the Edit button:

images/d2rpt_tools_edit_floating.png

The toolbars invoked by the editing buttons, and the tools they contain, are as follows:

  • Edit – tools for basic editing functions such as cut and paste:

    • images/d2rpt_tools_edit_cut.png cut selection.

    • images/d2rpt_tools_edit_copy.png copy selection.

    • images/d2rpt_tools_edit_paste.png paste selection previously copied or cut.

    • images/d2rpt_tools_edit_duplicate.png duplicate selection.

    • images/d2rpt_tools_edit_delete.png delete selection.

  • Layer – tools to control z-order of objects in the report; for example, to put text in front of a filled rectangle.

    • images/d2rpt_tools_layer_back.png move to the back

    • images/d2rpt_tools_layer_backward.png move backward one level

    • images/d2rpt_tools_layer_forward.png move forward one level

    • images/d2rpt_tools_layer_front.png move to the front

  • Align – tools to align, distribute, and size objects with respect to other objects. The object selected first in the selection group is the standard for alignment, centering, or adjusting height or width. Objects are spaced evenly between the right- and left-most (or top- and bottom-most) objects in the selection group.

    • images/d2rpt_tools_align_left.png align left edges.

    • images/d2rpt_tools_align_top.png align top edges.

    • images/d2rpt_tools_align_right.png align right edges.

    • images/d2rpt_tools_align_bottom.png align bottom edges.

    • images/d2rpt_tools_align_center_horiz.png center horizontally.

    • images/d2rpt_tools_align_center_vert.png center vertically.

    • images/d2rpt_tools_align_space_horiz.png apply equal horizontal spacing.

    • images/d2rpt_tools_align_space_vert.png apply equal vertical spacing.

    • images/d2rpt_tools_align_eq_height.png apply uniform height.

    • images/d2rpt_tools_align_eq_width.png apply uniform width.

  • Tools – tools to perform graphical editing functions like moving report elements and adding text and graphics.

    • images/d2rpt_tools_tool_select.png select an object. shift-click to select multiple objects.

    • images/d2rpt_tools_tool_text.png add text.

    • images/d2rpt_tools_tool_line.png add an orthogonal line.

    • images/d2rpt_tools_tool_rectangle.png add a rectangle.

    • images/d2rpt_tools_tool_chart.png add a chart.

    • images/d2rpt_tools_tool_barcode.png add a barcode.

    • images/d2rpt_tools_tool_image.png add an image.

Configuring Charts, Barcodes and Images

When you add a chart, barcode, or image, the editor puts a placeholder object into the report. Right-click on the placeholder to open a dialog box that enables you to supply additional information about the object. The following sections describe how to configure these objects:

Chart

This image shows the chart configuration dialog.

images/d2rpt_chart_wizard.png

This image shows the dialog with the X-Axis tab active.

images/d2rpt_chart_wizard_axis.png

Barcode

This image shows the barcode configuration dialog.

images/d2rpt_barcode_wizard.png

It is divided into the following sections:

  • Data source – This section lets you specify whether the barcode displays static information, or a value from the database. To display a static value, select the Static radio button, and type the value into the text field. The barcode placeholder displays the value:

    images/d2rpt_barcode_static.png

    To display a value from the database, drag and drop a field name from the fields column. The upper-left corner of the field bounding box must be inside the bounding box of the placeholder. The placeholder then displays the XPATH expression the report uses to get data from that field:

    images/d2rpt_barcode_dynamic.png

    You can also type the XPATH expression directly into the text field next to the Dynamic radio button.

  • Format – Select either Code-39 or Code-128.

  • Options – Specify options for the barcode, including whether it renders the value in human-readable text.

Image

This image shows the image configuration dialog. You can specify an image by typing the URL into the text field, or by browsing for a local file.

images/d2rpt_image_wizard.png

Report Sections

The main area of the Layout column is divided into areas that correspond to the sections that make up a report. These sections are as follows:

  • Report Header

  • Page Header

  • Report Body

  • Report Footer

  • Page Footer

Each report section has a gray bar across the top of the section that contains a variety of controls. Not all sections contain all available controls. The following list describes these controls:

Properties Column

The properties column lets you specify the style attributes of objects in the layout column. The possible options are grouped according to the relevant style properties for various types of objects. The selection you make in the layout column determines what options are available in the properties column. The available options are as follows:

  • Fill Style: Lets you specify fill color and opacity. These options are also available for Line Style and Text Style.

    • images/d2rpt_color.png Opens a color picker from which you can select the fill color. The same icon is used to select color for lines and text.

    • images/d2rpt_opacity.png Move the slider to select the opacity, from 100% (far right) to 0% (far left). The same icon is used to select opacity for lines and text.

  • Line Style: In addition to color and opacity, the Line Style group also lets you set the following properties.

    • images/d2rpt_line_width.png Lets you select the line width.

    • images/d2rpt_line_style.png Lets you select the line style.

  • Text Style: In addition to color and opacity, the Text Style group also lets you set set the following properties.

    • images/d2rpt_text_style.png Lets you select bold, italic, or underlined text. Each button in this control toggles, and you can select more than one.

    • images/d2rpt_text_size.png Lets you select the font size by either typing into the field, or using the spinner control.

    • images/d2rpt_justification.png Lets you select the paragraph justification.

    • images/d2rpt_font_family.png Lets you select the font family by using the spinner control.

  • Borders and Dividers

    • images/d2rpt_border.png Toggles the border surrounding the table.

    • images/d2rpt_header_border.png Toggles the border surrounding the table header.

    • images/d2rpt_header_body_divider.png Toggles the divider between table header and the table body.

    • images/d2rpt_header_column_divider.png Toggles the dividers between header columns.

    • images/d2rpt_body_column_divider.png Toggles the dividers between body columns.

    • images/d2rpt_body_row_divider.png Toggles the dividers between body rows.

    • images/d2rpt_zebra_stripe.png Toggles zebra striping in the table body.

    • images/d2rpt_zebra_color.png Opens a color picker that lets you select the alternate color for zebra striping.

  • Size and Position

    • images/d2rpt_position.png Lets you select the font size by either typing into the field, or using the spinner control.