Home > Design Pane Download RBT v1.3.1

Logical Page Layout

The Design pane view represents a logical page of an output document page and is comprised of several sections representing document layout. The rulers on the left and top, as well as the margins, can be scaled in inches or centimeters - see Add New Document pane.

document page layout

Content Sections

Document content is broken into 4 sections - header, body, summary and footer. The header, body and footer section height can be adjusted by moving the section separator.

setting document content section size

setting document content section size

The section height - as set in the designer - will display in the HTML output as follows:

  • Header and footer height will be the height set in the designer
  • Body section height is considered as the height of a single row of data and will repeat to fill the document content area not used by the header and footer.
  • The summary section will display after the final body section on the last page of the document

A few example are shown below - in each case the document contains 3 labels in the header, 3 columns in the body followed by a line and a page number in the footer.

adjusting document content section design display

adjusting content section size output display

adjusting document content section design display

adjusting document content section output display

Content Section Properties

To configure the display properties on a content section click the section name label. Display properties set on a content section will become the default display properties for all child display components contained in that section. Select the desired font, font size, color and background color. If a border style is selected the entire section will be surrounded by the border.

selection content section properties display

content section properties display pane

content section property settings design display

content section properties output display example

Background Image

You can specify a background image for a content section. If the background image is chosen for the body section it will display across the entire body of the document, not just a single data row. To select an image, click the select image icon and choose the desired image from the Image Select pane. Set the desired image parameters. XPos and YPos specify the relative position of the image in the section. The repeat dropdown choices how the image will be displayed - as a single image, multiple images vertically, multiple images horizontally or fill the entire section.

setting document section background image

selecting document section background image

selecting document section background image

selecting document section background image

Body Colors

The body section can be configured to display alternate row colors. To setup alternate row colors, click on the body section label to display the Display Object Properties pane. Select the desired Background and Alternate Background colors.

setting body section alterate background row colors display

The design screen will appear similar to what is shown below.

altername background row color design display

When run, the output will appear similar to what is shown below.

alternate background row colors output display