Controlling Form Layout

You have probably noticed that the InfoPath Designer behaves a lot like a web development tool. Objects are placed on the page and flow down the page as if your form were a web page that the user could scroll through. While InfoPath makes it easy to quickly create new forms, you are going to need to use a couple of tricks from some old web developers to make your form look like you want it to.

When the Internet first became popular, users weren’t too worried about how the individual pages looked—most pages were just simple text and didn’t have any formatting applied, other than a few changes to the font and size for emphasis. As the Internet has grown, web developers have pushed the boundary of web page design and can now create complex, highly formatted pages in just about any configuration you want.

One of the tricks they use to create these pages is a layout table. A layout table is an invisible table of rows and columns that provides the structure for the page. Using layout tables, web developers can create any number of different layouts and designs, ensuring that each component will be placed correctly on the page.

InfoPath also features its own layout tables, which you can use to help add some structure and spacing to your form. Most of the sample forms you have looked at so far have used layout tables to control the spacing and placement of objects within the form. In the Time Card form shown in Figure 8-1, a layout table has been used to hold the Employee information and separates the fields into two columns with a “spacer” column in between.

Figure 8-1: A typical form with a layout table

The following sections look at how to insert and format this type of table.

Note

Don’t confuse layout tables with repeating tables—repeating tables are used to hold fields that are part of a group and can be a variable number of rows depending on how many items the user enters. Layout tables are of a fixed size and are used to hold individual fields that do not repeat.

How to...—Insert Layout Tables

To insert a layout table into your form, select Insert | Layout Table to open the small dialog box shown here.

You need to enter the number of rows and columns for your table. After you enter the required information, click OK and your new table will be displayed on your form. By default, a layout table is displayed with a single dotted-line border. This border only appears when you are designing your form. When you are previewing or filling out your form, the table or its boundaries do not appear (unless you specifically added a border or shading to the table or cells).

To add objects to a layout table, you can either drag and drop them directly into the cells within the table or click within the cell and then use any of the insert methods described in the preceding chapter. For example, if you want to insert a hyperlink into your table, click within the cell where you want to place it and then select Insert | Hyperlink.

Inserting Formatted Layout Tables

You can also insert preformatted layout tables into your form by selecting View | Task Pane and then using the drop-down list at the top of the Task Pane to select Layout. This opens the dialog box shown in Figure 8-2, with all the preformatted layout tables that are available.

Figure 8-2: Layout options

Selecting the Table with Title option inserts a one-column, two-row layout table with a border between the two rows, as shown in Figure 8-3.

Figure 8-3: Layout table created by selecting Table with Title

There are placeholders within the table for the form title and content, and you can change the color, width, and style of the border that appears between the two rows by using the Borders and Shading options, which are described later in this chapter in the section “Working with Borders and Shading.”

The rest of the preformatted layout tables are pretty simple, with options for inserting a one-, two-, or three-column table. Most times you will want to create your own tables either by using Insert | Layout Table or by selecting the Custom Table option from the Layout view of the task pane.

Again, regardless of how the layout table has been created, the process for adding objects to the table is the same. In the case of some of the preformatted tables, there may be some placeholder text that appears in the table or cell (for example, “Click to add form content”), but once you click in the cell where this text appears, it quickly disappears.

Formatting Layout Tables

If you are an experienced Office user (current or previous versions), most of the formatting techniques that you are going to look at in this section will seem familiar to you. One of the design goals of the developers of InfoPath was to share a common user interface with other Office applications, and you can see the results of that focus at work when you are formatting tables.

Once you have inserted tables in your form, you can control the majority of formatting options through the right-click menu, shown here.

To insert a new row or column into your table, right-click within a cell at the point where you want to insert the row or column. Then, select Insert from the right-click menu, and choose one of the following options from the Insert menu:

• Columns to the left

• Columns to the right

• Rows above

• Rows below

  Tip

  Alternately, you could also select an entire row or column by using your mouse pointer and then right-clicking to select an option from the Insert menu.

Similarly, if you want to delete rows or columns (or even the entire table itself!), right-click anywhere within the table (or highlight a row or column and then select the Delete menu) and select one of the options from this list:

• Table Deletes the entire table

• Rows Deletes the currently selected row(s)

• Columns Deletes the currently selected column(s)

In addition to inserting and deleting rows and columns, you can also perform other table operations, like merging and splitting cells. To merge two cells together, highlight two or more contiguous cells within your layout table and then right-click the highlighted selection and select Merge Cells.

Tip

You could also select a number of merge and split operations from the options found at the bottom of the Layout task pane.

To split a cell, right-click within the cell that you want to divide, and select Split Cells to open the dialog box shown here.

You can specify the number of resulting rows and columns you want to create and click OK to return to your form design. Another option for splitting cells is to merge them first before you actually split them. In this scenario, you may have two columns that you actually want to split into three columns and two rows. Instead of merging the cells first and then splitting them, you could simply highlight both columns and then select Merge Cells from the right-click menu. The Merge Cells Before Split option will be enabled, which allows you to merge the cells before they are split apart into the new configuration.

Working with Table Properties

In addition to all the options found on the right-click menu, there is also a set of property pages associated with each layout table. You can access these property pages by right-clicking anywhere within the table and selecting Table Properties to open the dialog box shown here.

You can select how your table will be aligned on the page from the default property page—there are also property pages for the rows and columns that appear in your table, and you can use the options on these pages to control the height and width of the same. The Cell tab, for instance, is used to set the vertical alignment for the text and other objects within a cell. You can specify the padding you would like to use for the inside of the cell as well.