Microsoft InfoPath 2010
The official blog of the Microsoft InfoPath team

Tip to improve an InfoPath form's appearance

Tip to improve an InfoPath form's appearance

  • Comments 0

Improved InfoPath Form Look and Feel

Apples to: Microsoft Office InfoPath 2003 and Microsoft Office InfoPath 2003 SP1

Looking for simple ways to jazz up your form layout?

Summary

Using tables, inline images, background colors, and conditional visibility, I created a pretty simple look and feel that groups parts of the UI together that goes a little beyond just borders.

Example

Picture of an improved look for an InfoPath form 

Implementation

I started by drawing a rounded rectangle in mspaint, then I cut it into smaller images and added it to a table.  For the vertical part which grows, I didn’t use an image, I instead colored the background the same as the image.  Otherwise I couldn’t get it to grow when nested repeating elements would resize.  I removed all borders, padding, and other spacing to get everything to fit together.

For the repeating section, I used conditional visibility on section with two separate images.  I had to use the following expression to get count and position for repeating sections:

// count                                    //position

count(../../my:SummaryItem) != count(../preceding-sibling::node()[local-name() = "SummaryItem"]) + 1

 

Leave a Comment
  • Please add 4 and 8 and type the answer here:
  • Post