Constructing A Form Using Adobe Designer: Bonus Chapter

Bonus Chapter 3
Constructing a
Form Using Adobe
Designer
Acrobat 7 Professional offers two methods of forms creation depending
on your operating system. For both Windows and Mac, you can construct
forms using the Forms tools, like the spiffy forms created in Chapters
9 and 10. If you are working with Windows, you have access to the
entire Adobe Live Cycle Designer 7 programalso referred to as Adobe
Designerintegrated as part of Acrobat 7 Professional for Windows.
In the book, you saw how Joe (of Joes Deli fame) converted his menu to
a PDF form and then further developed the form to make the elds ll-
able, allowing the user to click a eld on the form and directly type the
information into the eld. In the Chapter 10 project, in addition to creat-
ing llable elds, he also added calculations to compute order costs, and
buttons to automatically perform some common tasks, such as clearing
or e-mailing the form. In this bonus chapter, Joe designs a survey form to
collect feedback from his customers about his e-mail menu.
If you are working in Windows and using Adobe Designer 7, you have
several options for forms design. Joe creates the form entirely within
Adobe Designer. You can access the Adobe Designer program either from
within Acrobat 7 Professional (Windows) or from the Start menu.
2 BONUS CHAPTER 3 | CONSTRUCTI NG A FORM USI NG ADOBE DESI GNER
Adobe Designer is an incredibly rich program. In this chapters project, youll
only scratch the surface of what the program has to offerto delve into the
mysteries of the program properly would require another book!
Once Joe has built the form, he moves to Acrobat 7 Professional, where he tests
and distributes the form using one of Acrobats workow processes, and then
he collects the data and exports it to a spreadsheet.
If you arent working in Windows, you arent left out of this project! Although
the form itself is designed in Adobe Designer, the distribution of the form, the
data collection, and construction of the spreadsheet containing the forms data
are managed through Acrobat 7 Professional.
How Do You Like It So Far?
Joe features prominently in the book in Chapters 9 and 10. When last we left
Joe in Chapter 10, he had started using an interactive form for customer order-
ing. He decides hed like to create a survey form that he can send to his cus-
tomers to see how they like the order form. Joe knows, as do other successful
business people, that one of the keys to success is customer feedback.
Types of Forms
There are several types of forms you can create through Adobe Designer.
Understanding the terms can be confusing, so here are short denitions of the
different types:
A basic form is a layout, including labels, graphics, and elds, that can be
printed and lled by hand
A static form is a xed layout that includes elds, text, and graphics; its most
commonly lled in online. Its appearance doesnt change to accommodate the
amount of data entered in the forms elds.
An interactive form is llable online. That is, the user can click a eld and
type text, or select options from a variety of types of form elds such as radio
buttons, check boxes, and pull-down lists. The form can also include buttons
the user can click to perform different commands, like the form built in Chapter
10. An interactive form can be either static or dynamic.
A dynamic form can change size (larger or smaller) depending on the amount
of data added to the form. This type of form is often run from Forms Server,
one of Adobes enterprise products.
If you build a PDF form in Acrobat 7 Professional and then open the form in Adobe
Designer, a copy of the le is opened and your original document is preserved.
3 HOW DO YOU LI KE I T SO FAR?
In this project, Joe is going to build another form, but this time, hes working in
Adobe Designer 7. He could build the form in Acrobat 7 again, but hed like to
give Acrobats forms design program a test drive.
NOTE The principles of designing and planning a form in Adobe Designer are the same
as those in Acrobat 7. To refresh your memory, check out the sidebar Form Design Must-
Haves in Chapter 10.
Joe decides hell create the form from a blank page in Adobe Designer, using
the New Form Assistant. His completed form will include several questions his
customers can answer by choosing a radio button response and corresponding
text elds to type additional comments if they wish. Joe will also add an e-mail
submission button to make it simple for his customers to return the survey to
him (Figure B3.1).
Hell collate the data in Acrobat and transfer it to an Excel spreadsheet for
review. Pretty cool, dont you think?
Figure B3.1 You can create a form in Adobe Designerlike this surveyto distribute, have users ll in online,
and then compile the data into a spreadsheet.
Export form data by e-mail
that can be compiled into
a spreadsheet le using
Acrobat 7 Professional.
Place images and other
graphics on the form.
Use custom text to
dress up the form.
Adobe Designer
lets you save
content on the form
as custom objects
you can reuse.
Customize the look
of the form elds.
Connect values to
the buttons users
select on the
form to track their
responses.
Use Adobe
Designers place-
ment aids to
lay out out the
form perfectly.
Steps Involved in This Project
Joes form is used to gather specic information from his customers. To com-
plete this project, Joe needs to
Start and save a new form in Adobe Designer 7.
Place his logo and other graphics on the form.
Create the forms structure and add subforms.
Add the forms headings, images, and text.
Create the form elds and their labels.
Congure the e-mail button.
Test the form.
Send it for distribution using one of Acrobat 7 Professionals built-in
workows.
Gather the data as it is returned to him.
Export the form data from Acrobat to an Excel spreadsheet.
Fortunately, Adobe Designer contains a lot of features that will help Joe make
his way through the program. The rst of these features is the New Form
Assistant, which Joe uses to create the new form.

Download survey.pdf if youd like to see the initial form created by Joe, as described in the
next sections.
Starting a Form in Adobe Designer
Joes customer survey is going to start from a blank form page. Follow these
steps to open the program and work through the New Form Assistant:
1. In Windows, click the Start menu, and then choose All Programs > Adobe
Designer 7.0.
2. Adobe Designer opens displaying the Welcome Screen.
You can choose a new blank form, open an existing form, or work from a
template to start the program. You can also try out some tutorials, look at
samples, or read a Whats New le. If youd like to hide the dialog in the
future, deselect the Always show this dialog check box.
5 STARTI NG A FORM I N ADOBE DESI GNER
3. Click New Form to dismiss the Welcome Screen. The Welcome Screen is
replaced by the New Form Assistant.
There are four steps to starting a new form through the New Form Assistant.
4. The Step 1 pane shows
several ways to start a
new project. Because
you selected New Form
in the Welcome Screen,
the New Blank Form
option is already selected
(Figure B3.2).
5. Click Next to show the
Setup: New Blank Form
pane of the wizard. Choose
the page size, orientation,
and number of pages youd
like in the form.
Joe uses the default
options for his survey form
(Figure B3.3).
6. Click Next to show the
Return Method options. On
this pane of the wizard, you can choose
several ways to return the information
from the form (see the sidebar Send It
Back for more details).
7. Select an option from the Return Method
list. Joe uses the Fill then Submit option,
which means his customers can ll in
the form elds, make selections from the
eld options such as radio buttons, and
then click the Submit button to send the
results back to Joe.
Figure B3.2 Choose a method for starting a new project
from the list.
Figure B3.3 Select page characteristics for
your form.
8. Click Next to display the last pane of the wizard, the Return Information
pane. Type your e-mail address in the Return Email Address eld.
The options available on this pane of the wizard depend on the choices
you made in earlier panes. Since Joe selected the Fill then Submit option,
the nal pane of the wizard
contains a eld for him to
type his e-mail address.
9. Click Finish to close the
wizard and open the new
form in Adobe Designer.
10. Choose File > Save. The
Save As dialog opens. Type
a name for the form Joes
form is named survey.pdf.
11. Choose a form type from
the Save as type pull-down
list. Joe uses the default Static PDF Form File (*.pdf) option (Figure B3.4).
You can also choose to save the form as compatible with Acrobat 6; the
nal form is available from the Web site in both Acrobat 6 and Acrobat
7compatible versions.
12. Choose other save options if you like. The two options selected as shown
in Figure B3.4 are the defaults and are used in Joes project.
The default options automatically add tags to the form and embed the
fonts used in the form. You can also choose to generate a log le, which is
information about the le and its properties, saved in the same folder as
the form le. If you have created a form based on another document and
there have been font substitutions, click Permanently replace unavailable
fonts to prevent having to respond to missing font dialogs each time the
le is opened.
13. Click Save to dismiss the dialog and save the form.
Now that Joe has saved the basic form, he is into the program proper. Hes
raring to goas soon as he gures out what the program does!
NOTE If you close Adobe Designer, dont try to double-click the le to reopen it in
Designer. Its saved with the .pdf le extension and opens automatically in Acrobat.
Reopen the program rst, and then select the form le. If you choose the Adobe XML
Form File format from the Save As dialogs Save as type pull-down list, the le is saved
with the .xdp le extension and will open Adobe Designer if double-clicked.
Figure B3.4 Select how you want to save the form, as well as
other form features in the dialog.
7 GETTI NG AROUND I N ADOBE DESI GNER
Getting Around in Adobe Designer
Joes survey.pdf form is shown in Figure B3.5. Like most programs, Adobe
Designer includes menu items and toolbars. There is also a range of windows
available, which can be docked and grouped at the side of the program window.
The basic elements of the program are the following:
1. The Body Pages view is the default layout window you use to design your
form. It shows gridlines and rulers by default.
2. The menu items are arranged across the top of the program window and
contain many common commands.
For example, you can choose options from the Insert menu to add content
to the form, and show and hide palettes using options from the Window
menu.
3. The program contains four toolbarsStandard, Font, Paragraph, and
Layoutwhich are shown by default.
The toolbars have been arranged in the gure to show them clearly; in the
default view, all toolbars are contained in one row, and the Layout toolbar
is hidden behind the other toolbars.
4. Toggle gridlines on and off by clicking the Show Grid button on the
Standard toolbar.
Send It Back
There are several different ways you can congure a form to return its information
to you. In all cases, if your users are working with Adobe Reader, they cant save
a copy of the form with the data added. The New Form Assistant wizards Return
Method pane lists four different options:
Fill then Submit lets your users ll in the form by typing in the elds or
selecting options and then return the data to you by e-mail.
Fill then Submit/Print lets your users ll in the form by typing in the elds or
selecting eld options and then e-mail it to you; they also have the option to
print the form if they like.
Fill then Print lets your users ll in the form by typing text in the elds or
choosing eld options such as buttons or check marks and then print the form
to return by mail or fax.
Print lets your users print the form and then return it by mail or faxthe old-
fashioned way.
5. Change page view and zoom options using the controls on the Standard
toolbar. The tools look and work the same as those in Acrobat 7.
6. The Script Editor is shown below the toolbars by default. You can drag the
Script Editor to oat in the program window and close it, or click the hori-
zontal hatched area on the border below the Script Editor to collapse it,
giving you more space to work in the program.
Figure B3.5 Adobe Designers interface is made up of numerous components and palettes.
1
3 5
7
9
11
13
2 4 6
8
10
12
14
Standard
toolbar
Paragraph
toolbar
Font
toolbar
Layout toolbar
Click the hatched
line to collapse the
Script Editor palette
Object position
on the page in
inches
Height and
width of
selected object
in inches
Selected
objects
name
Page number
of page shown
in the Body
Pages view
Locked or unlocked
status of objects
text, elds, static
objects (all are
unlocked in the
gure)
Click the hatched
lines to show/hide
palettes (x2)
9 GETTI NG AROUND I N ADOBE DESI GNER
7. The Hierarchy and Data View palettes are tabbed together at the upper left
of the program window.
The Hierarchy palette outlines the content of the form; the Data View pal-
ette is used to show database and schema connections and other details
for the forms elds.
8. The Report palette is tabbed at the lower left of the program window. The
Report palette lists data bindings (information about responses in the form
that are assigned values), as well as warnings that are generated as the
form is developed.
9. The Library palette is tabbed at the upper right of the program window.
Use the selections from the Library palette to add content to the form.
10. The Object palette is tabbed at the mid-right of the program window. A
selected eld on the form is described in the Object palette, as seen in the
gure. You can modify elds characteristics in the Object palette.
11. The How To palette is tabbed at the lower right of the program window.
Click the Choose a topic pull-down arrow and select a topic to see infor-
mation on how to perform different functions.
The How To palette in Adobe Designer works like Acrobats How To win-
dow.
12. All palettes include a More button. Click the button to open a menu.
The menu contents vary according to the palette, but in each case, you can
choose Hide Palette and Help options.
13. A eld on the form shows a border with resize handles when it is selected.
Youll also see the elds name in a tooltip.
14. The Status bar at the bottom of the program window shows details of the
selected object; if no object is selected on the form, the Status bar shows
details of the form page.
Joe concludes his whirlwind tour. It doesnt look too complicated! Hes ready to
start and decides to add his logo to the form rst.
Adding an Image to the Form
First up, Joe plans to add his companys logo to the form,
as well as the checked-edging graphic he uses on the
menu. An image used as a visual element in an Adobe
Designer form is called a static object. That is, it isnt pro-
grammed, nor is it a eld. Its just a picture!

Download joe_logo.jpg and joe_checks.jpg to add to the survey.
pdf form. If you prefer, you can use images of your own.
Follow these steps to add an image to the form:
1. Click the Standard tab on the Library palette. Scroll
down the list and select Image (Figure B3.6).
2. Move the pointer over the Body Pages view. Youll see
crosshairs and a tooltip showing the pointers location
on the page in inches.
3. Click and drag a marquee for the image, and then
release the mouse (Figure B3.7). A frame displaying
resize handles shows on the page.
You dont have to worry about the exact dimensions
because youll use the images actual size in the form,
set on the Object palette.
4. In the Draw tab of the Object palette, automatically
displayed when you complete the marquee, click the
Browse button to open the Browse for Image dialog.
5. Locate and select the image for the form. Joe uses the
joe_logo.jpg image.
6. Click Open to dismiss the dialog and place the image
in the marquee on the form page.
7. In the Draw tab, the images name is shown in the
URL eld (Figure B3.8).
8. Click the Embed Image Data check box.
If the form is used from a server, the URL on the Draw
tab shows the path to the image and is added when the
form is displayed. Since Joe is e-mailing the form, he
needs to include the image information within the form.
Figure B3.6 Choose the
Image object from the Library
palette.
Figure B3.7 Draw a marquee
on the page where youd like
to place the image.
Figure B3.8 Congure image
settings in the Draw tab of the
Object palette.
11 ADDI NG AN I MAGE TO THE FORM
9. Click the Sizing pull-down arrow and choose Use Image Size; the marquee
on the page is sized according to the images original size.
The other options are Scale Image to Fit and Stretch Image to Fit, used
when you want to change the size of the image used in the form.
10. Leave the default Visible Presence option. There are several other options
for visibility as well, such as hidden, or invisible, as well as printing
options.
If you cant see the Presence setting on the palette, you can drag down-
ward at the bottom of the visible palette to increase the size of the palette
area used by the Object palette. Youll see a pair of arrows at the bottom
or right of the palette when its not showing its full content; click the
arrows to expand the palette automatically.
11. Save the le.
Now that Joes added the logo, he also
plans to add a checked border like that he
used in his PDF order menu. He follows
the same set of steps again. This time he
chooses the le joe_checks.jpg; and selects
the Scale Image to Fit option from the
Sizing pull-down list in the Draw tab of the
Object palette (shown in Figure B3.8).
The two images are placed on the page
along with the e-mail button added by the
New Form Assistant when he started the
project (Figure B3.9). Next, Joe is going to
add some text and headings to the page.
Placing Text on the Form
Joes going to add a title to the form as well as some simple instructions for
the customers to follow to complete the survey.
Adding the Forms Heading
You add text using one of the Library palettes objects. To add the text heading
for the form, follow these steps:
1. Select the Standard tab on the Library palette. Scroll down the list and
select Text.
Figure B3.9 The two images are placed on
the page.
2. Move the pointer over the Body Pages view. You see crosshairs and a
tooltip showing the pointers location on the page in inches.
3. Click and drag a marquee for the text. Release the mouse to draw a bound-
ing box with resize handles on the page.
4. You also see a tip about auto-sizing text. By default, Adobe Designer sizes
text to t within the marquee that you draw in the page. If you drag the
resize handles, this auto-sizing feature is turned off.
Thats ne in this case because Joe is using specic font sizes for the head-
ings. Click OK to close the tip dialog; click the Do not show this tip again
check box to prevent seeing the tip each time you add a text box to a form.
5. Click the text box to select its content.
Youll see a hatched marquee around
the text box, and the pointer changes
to an I-beam cursor (Figure B3.10).
6. Select the default text Designer adds
in the text box, and type the title for
the form. Joes form is titled Online
Ordering Survey.
7. With the text selected in the text box,
choose a font, style, and size in the
Font toolbar (Figure B3.11). In Joes
form, the font used is Gill Sans MT,
16pt, and bold.
The Font toolbar has been dragged from
the toolbar well at the top of the pro-
gram window to show you both the set-
tings and the block of text in the gure.
That wasnt too bad! Joe adds another block
of text to provide instructions for completing the form.
Adding Instructions
Joe follows the same steps to add another text block for the instructions on
the form.

You can download the instructions.txt le from the Web site to use in the survey.pdf
instruction text block.
Figure B3.10 The bounding box shows a
hatched outline when the text is active.
Figure B3.11 Choose a font and other settings
for the surveys heading.
13 MODI FYI NG THE FORM S HI ERARCHY
For the instructions, he again uses the Gill Sans MT font but this time at
11pt size, and types some general instructions for the user to follow to ll
out the form.
If you add a text box and then type more text than the box can hold, youll see
a red icon at the lower-right edge of the text box ; the icon also appears if
you decrease the size of the text box smaller than the text youve added. Drag
a resize handle on the edge of the text box to increase the width or height of
the text box so all the text ts. The red icon then disappears.
Adjusting the Checkerboard Image
When the text is added, Joe repositions the checked border, as seen in
Figure B3.12. The graphics and text for the form extend to about 2 inches
down the page.
Now that Joes added the accessory information and content, and saved the
le, hes going to organize the forms hierarchy before adding the form elds.
Modifying the Forms Hierarchy
Adobe Designer automatically creates the structure of a form when you start a
new project. Before Joe goes any further, its a good idea to see how the form is
organized and add some names for the elds in the form. Theres a lot more to
a form than meets the eye!
Spending a few minutes at this point will save time trying to gure out what
the results mean down the road when Joe gets his survey information back
from his customers.
Figure B3.12 Reposition the images and text on the form page.
Just as it was important for him to organize the names of the elds in the
other forms he created (refer to his forms in Chapters 9 and 10), its also
important to organize the eld names and other structures in the Adobe
Designer form.
Understanding the Hierarchy
The Hierarchy palette lists all the content and structures in the document.
Selecting an item on the Hierarchy palette shows a bounding box surrounding
the item on the Body Pages view.
There are several objects added to
the hierarchy that Designer uses to
organize the content of the form. Like
other hierarchies you will encounter
in Acrobat and Adobe Designer (such
as bookmarks, discussed in Chapter 2
and Bonus Chapter 1 on the Web site,
and tags and content, described in
Chapter 8), each level of the hierarchy
contains child elements. Deleting an
object deletes all its dependent child
objects.
Viewing Master Pages
and Content Areas
There are other elements in the
Adobe Designer form that you wont
see in a form constructed using
Acrobat 7, including master pages
and content areas.
Youll see what these elements are as
you follow these steps to examine and rename one of the forms structures:
1. Click form1 on the Hierarchy palette, and you see the entire form is
selected. The name is assigned to the form you construct when you start
the project. You can leave the default name.
2. Click Master Pages on the Hierarchy palette. You see the Master Pages lay-
out, which is tabbed with the Body Pages tab, displays in the work area of
the program (Figure B3.13).
TIP If you cant see the bounding boxes when
you select an object, choose View > Object
Boundaries to turn on the visual aid.
Whats Hidden Inside the Form?
Adobe Designer builds forms using an XML
schema, which characterizes objects and their
relationships to other objects. An XML schema
represents the interrelationship between the
attributes and elements of an XML objectfor
example, a document or a portion of a docu-
ment, such as a subform.
You dont have to build the schema manually.
Thank goodness! Adobe Designer automatically
analyzes the structure of the form document
and denes structural elements as you add or
modify them. Just as in XHTML and HTML,
elements are dened within a set of tags.
Every form has at least one
master page assigned that
contains page size and ori-
entation settings. A master
page can contain headers
and footers, logos, and other
repeating elements that are
placed on each page of a
multipage form. When the
form is constructed, Adobe
Designer adds a master
page based on the selec-
tions you choose in the New
Form Assistants Setup: New
Blank Form pane, shown in
Figure B3.3.
3. The master page serves as
a container for two more
objects. On the Hierarchy palette, clicking the listing for
Page1 identies the rst body page of the form built on
the master pages specications. On the master page,
you wont see any bounding box identifying a selection;
instead, the object refers to the entire page of the form.
4. Click the (untitled Content Area) listing on the Hierarchy
palette. You see on the master page that a bounding box
covers most of the page, except for the margins, as seen in Figure B3.13.
This area is also added by default and denes where you can place objects
on the page, which must be within the content area.
5. With (untitled Content Area) still selected on the Hierarchy palette, press
F2 on the keyboard to activate the labels text. Type a new name for the
content areaJoes is named survey_form (Figure B3.14). Click anywhere
on the program window or press Enter to deselect the label and change
the name.
So far, so good. Youve seen how the basic structure of the form is built and
the relationships Adobe Designer adds automatically to dene how the forms
pages are structured.
Figure B3.13 A master page is automatically associated with
every new form.
Figure B3.14 Activate the
eld and type a new name
for the content area.
Modifying the Subform Layout
One other object that Adobe Designer creates by default is a subform cover-
ing the whole page. Each body page in a form is assigned one default subform.
Joes form will include two subformsone for the e-mail submit button and
the text and graphics hes added so far, and one for the actual form elds for
the survey.
Joe will rename the existing subform, assign the elements already added to the
form to the subform, and nally add another subform to hold the survey ques-
tions.
Revising the Default Subform
It is really much simpler to do than to read about; follow these steps to resize
and rename the default subform:
1. Click the (untitled Subform) (page 1) listing on the Hierarchy palette. The
Body Pages view is active in the work area of the program, and the sub-
forms bounding box is shown on the page.
2. Click Zoom Out on the Standard toolbar until you can see the entire
Body Page View, or click the Zoom pull-down arrow and choose 50%.
You need to see the whole page to adjust the subforms size.
3. Click the lower margin of the subforms bounding box, and drag it upward
to the lower edge of the checked graphic (Figure B3.15).
Youll see a tooltip showing the dimensions; Joes subform is sized at
8.0" 2.0".
4. Press F2 on the keyboard to activate the listings text. Type header and
press Enter or click anywhere on the program to deselect the text.
Figure B3.15 You can resize the dimensions of a subform on the page.
5. You experience something spooky when you rename the subformthe
images disappear from the Body Pages view! Dont panic. Save and close
the form and then reopen it. Adobe Designer reconstructs the path for the
images locations and all is right again in Joes world of forms.
Now that the subform is renamed and resized, Joe decides to give the objects
he added to the form simple names.
Renaming Objects
Adobe Designer assigned default names to objects Joe added to the form. He
leaves the EmailSubmitButton1 default name, but hes going to change the
other objects names.
Follow these steps to rename the existing objects:
1. Click the StaticImage1 listing on the Hierarchy palette to select it.
2. Press F2 on the keyboard to activate the text.
3. Rename the image logo and click off the eld to deselect it.
4. Repeat with the remaining objects.
Rename StaticImage2 as checks; rename StaticText1 as heading; and
rename StaticText2 as instructions.
Joes subform named header now contains ve objects with easy-to-under-
stand names (Figure B3.16). Now that the upper portion of the form is com-
plete, Joe will add an additional subform to hold the survey questions.
NOTE The Hierarchy palette also has a default listing
for Referenced Objects. Scripted objects, such as the
e-mail submit button and the survey form elds, use
the Scripting Object Model (SOM) to reference objects
in the form. If you select a form eld on the Hierarchy
palette, look at the Script Editor at the top of the
program window (below the toolbars). The referenced
objects SOM expression is included in the script; you
can see an example in Figure B3.5. Read more about
working with referenced objects in Adobe Designers
Help les. Figure B3.16 The revised subform
now contains understandable
object names.
Adding a New Subform
It isnt necessary for Joes form to contain more than one subform, but includ-
ing the survey form elds in their own subform makes it simpler to organize
the layout of the elds. First you add the new subform, and then you resize it
in the Body Pages view.
Inserting the Subform
Follow these steps to add a new subform to the project:
1. Click the form1 listing on the Hierarchy palette. You add the subform as a
child object of the form itself.
2. Click More on the Hierarchy palette to open the menu, and choose Insert
Subform to insert a new item to the listing named (untitledSubform)
(page 2) below the existing header subform.
The default name doesnt mean there is now a page 2 added to the form
thats simply Designers way of designating subforms, because generally
they are placed on separate pages when used to control dynamic content.
3. Click the default subforms name, and press F2 to activate the eld.
4. Rename the eld survey_items, and click off the listing to deselect it.
Now Joes form has a second subform into which hell add the survey items
(Figure B3.17).
Managing Palettes
You can open and close palettes at will and automatically reset them to their default
locations. At the top right of each palette, you can click the Expand or Hide icons
to either expand the palette to the full height of the palette area or hide it from view.
Rather than choosing an individual palette from the Window menu, choose Window >
Manage Palettes, and then toggle the top, left, and right palette areas visible or hidden by
choosing the appropriate commands. To reset the palettes to their default conguration,
choose Window > Manage Palettes > Reset Palette Locations.
If youd rather collapse palettes from the program interface, click the hatched area along
the edges of the palettes to collapse or show the palettes (the hatched areas are identied
in Figure B3.5).
19 ADDI NG A NEW SUBFORM
Resizing the Subform
When the subform is added to the hierarchy, a bounding box is added to the
Body Pages view. Joe cant t all the survey elds into the default bounding
box.
Follow these steps to resize the subform:
1. Click the survey_items listing on the Hierarchy palette to select the sub-
form. In the Body Pages view, the bounding box is selected.
2. Drag the lower-right edge of the bounding box downward and to the right.
3. Release the mouse when the bounding box has covered the content area;
youll see a tooltip showing 8.0" 8.5" when the bounding box is the
full size.
4. Save the form. Joes form is now saved as surveyB.pdf.
If youd like to see Joes form after the structure is revised and complete to this point,
download surveyB.pdf. You can start from this version of the form to add the forms
survey elds.
At last, everything is tidy and organized. Now its time for Joe to get to the
heart of the formthe survey elds.
Figure B3.17 The new subform will hold the survey questions.
Placing a Survey Field on the Subform
In Chapter 10, Joe added radio buttons to his form and then manually assigned
values to the buttons in the Radio Button Properties dialog. It was a rather
complex process.
In Adobe Designer, rather than having to build the form eld from the ground
up, Joe can work with a precongured eld and then customize the name of
the elds contents, its text, and its appearance in Designers palettes. Not only
that, but when hes nished perfecting his rst survey question, he can save it
as a new object in the program and quickly create the rest of the questions for
the form. Talk about a timesaver!
Adding the Field to the Subform
Follow these steps to add the rst survey eld to the subform:
1. Click the survey_items subform listing on the Hierarchy palette to select it.
2. Select the Custom tab on the Library palette at the upper right of the pro-
gram window.
The Custom tab contains a number of specialized elds, such as signature
elds and phone numbers.
3. Scroll down the list and select Survey Question.
Types of Subforms
Subforms are most commonly used in a dynamic
formthat is, one that changes its size and
congurations depending on the information added
to the elds. A subform is also useful for managing
the layout of objects, which is why they are used
in Joes project. When the subform is added and
resized as described in this section, Adobe Designer
automatically assigns the type of subform.
See for yourself: In the Subform tab of the Object
palette, located at the right of the program window,
the Position Content option is selected automatically
from the Type pull-down list (Figure B3.18).
Figure B3.18 Adobe
Designer automatically
denes the subform type.
21 PLACI NG A SURVEY FI ELD ON THE SUBFORM
4. Drag from the palette to the Body Pages view. You see a bounding box out-
lined on the page, which represents the questions components. Drag the
frame to the upper left of the subform; the tooltip shows the location as
0.25in, 2.25in.
If you look carefully at the upper-left corner of the frame, you see a trian-
gle that indicates that the bounding box is at the corner of the subforms
content area.
5. Release the mouse to place the eld on the page.
In the Body Pages view, you see the question added to the page in a text box,
as well as a set of ve radio buttons, all containing default text (Figure B3.19).
On the Hierarchy palette, below the survey_items listing for the subform, you
now see a text item called Question, as well as a set of ve radio buttons,
which are child objects of the Answer object.
Maintaining understandable names is a big deal when building forms. Joes
going to use most of the default names, although the (untitled Radio Button)
objects will need renaming later. As youll see in the section Resetting the
Order of the Button Selections, Joe has to adjust the names and their order to
correlate the values, order, and bindings rst before the elds are renamed.
When Joe adds the other two questions to the form, Adobe Designer will auto-
matically rename all the form elements, including those of the rst question
hes already added.
Next, Joe is going to modify the questions layout.
Figure B3.19 The components of the survey question are added to the subform.
Modifying Fonts in the Survey Question
Adobe Designer uses the Myriad font as its default font. Joe decides hed like to
change the font for the survey to a more common font. Hes going to use dif-
ferent font characteristics for the question and the answer options.
Changing the Questions Font
Follow these steps to change the text in the question:
1. Choose Window > Font to open the Font palette if its not shown in the
program window.
2. Click the Question listing on the Hierarchy palette; youll see the bounding
box around the object on the Body Pages view.
3. On the Font palette, click the Font pull-down arrow and choose a font from
the list. Joe uses Arial.
4. Click the Size pull-down arrow and choose a size from the list. Joe uses
10pt text for the question.
5. Click the Style pull-down arrow and choose Bold. Joe decides to set off the
text questions a bit by using bold text.
Hell use slightly different settings for the radio buttons text.
Changing the Answer Options Font
Joe repeats the steps with the Answer
object, the parent object of the set
of radio buttons. You dont have to
change each radio button option
individually. Rather than selecting
the individual objects on the form,
simply click the Answer listing on the
Hierarchy palette to also select the
child objects (Figure B3.20).
The font changes are applied to the
Answer object, and since the ve radio
buttons are its child objects, they are
assigned the selected font and its
characteristics. In Joes form, he uses
Arial font again, but this time in plain
text, using 9pt size.
Figure B3.20 Selecting a parent object automatically
applies text changes to its child objects.
23 MODI FYI NG THE ANSWERS APPEARANCE
Next Joe decides hed like to jazz up the answers appearance. Hes going to
add borders and a background and change the style of the check box.
Modifying the Answers Appearance
To change the appearance of the block of radio buttons, you can again work
with the selected Answer object. First, Joe will change the border and back-
ground settings for the radio button response block, and then hell change the
type of radio button used on the survey question.
Changing the Borders
Joe decides hed like to add a border to the radio buttons to set them off. Follow
these steps to modify the radio buttons appearance:
1. Choose View > Object Boundaries to toggle the boundaries off.
The default view in Adobe Designer shows blue boundaries around all
the objects. Its easier to visualize the appearance of the form without the
boundaries.
2. Click the Answer objects listing on the Hierarchy
palette.
3. Choose Window > Border to open the Border palette,
which tabs with the Object palette at the right of the
program window by default (Figure B3.21).
4. Click the Edges pull-down arrow and choose an option
from the list. Joes form uses the Edit Together option.
You can also modify the borders individually by
selecting Edit Individually. In that case, choose set-
tings for each side of the radio button response block
separately.
5. Click the pull-down list next to the square icon, below
the Edges setting, and choose an edging option. Joe
uses the Embossed 3D edge style for his form.
You can select from a variety of line types and 3D
options. If you select a line option, the Line Size, Color,
Corner, and Radius options are activated.
Figure B3.21 Select options
for the border and background
of the radio button response
block on the Borders palette.
6. Click the Style pull-down arrow and choose a Background Fill option from
the pull-down list. You can choose a variety of gradient and pattern lls, as
well as solid colors or no ll.
Joe chooses the Linear-to top option, which activates the Fill Color (Start)
and Fill Color (End) buttons. The default ll is from white to black, which
is too dark for the projects question.
7. Click the Fill Color (End) button to open a color palette, and choose a
lighter color to use for the end color of the gradient.
Joe chooses Gray-25%. You can also click More Colors in the color palette
to open a color picker and choose a custom color. You may want to use
custom colors if you are matching the colors in the form to corporate
colors, for example.
Joes got somewhat of a square theme going with his checkerboard graphic.
Now that the survey answers background coordinates with the checkerboard
graphic, he decides to change the default circular radio buttons.
Using a Different Radio Button
To modify the radio buttons, Joe has to select each response individually.
Unlike changing the text and background for the entire block of responses,
the parent Answer object cant be used to select the buttons.
Follow these steps to change the radio buttons in the responses:
1. Press the Shift key and select the set
of ve (untitled Radio Button) objects.
You can select them from either the
Hierarchy palette or the Body Pages
view.
2. Click the Object palette located at
the right of the program window, and
select the Field tab to display the Radio
Button options.
3. Click the Appearance pull-down arrow
and choose a different option. Joe
chooses the Sunken Square button,
which matches his checkerboard
graphic (Figure B3.22).
The text in the question is ne for some
surveys, but Joe thinks it is a little stiff and
Figure B3.22 Choose an appearance
for the buttons in the palette.
25 CUSTOMI ZI NG THE RESPONSE SETTI NGS
formal (Figure B3.23). Next hell
change the items in the responses.
NOTE Joe is familiar with the concept
and processes involved in building a
form eld having a set of alternative
responses. He used the same method
in Chapter 10 for building various elds,
like radio buttons and combo boxes.
In Adobe Designer, the term bindings
is used instead of export value used in
Acrobat 7. You can learn more about
export values in Chapter 10 in the sec-
tions Adding Radio Buttons, Working in the Fields Pane, Building a Combo Box, and
Adding and Conguring Check Boxes for the Specials. More about bindings is coming up
in this chapter in the Looking at Data Bindings section.
Customizing the Response Settings
Joe has changed the appearance of the answers on the form. Now its time for
him to change what the responses say. His business is more laid-back than
an option reading somewhat dissatised would suggest, and he plans to
inject some of his coolness into the responses. He thinks (and it works for
him) that a little humor brightens up peoples days, especially when so many
of his customers work in very formal environments like legal rms and con-
sulting companies.
Joes captions are longer than the defaults, and to change the text with a mini-
mum of fuss, he has to make changes on the Paragraph and Layout palettes as
well. First, Joe changes the paragraph settings.
Changing Margins for the Text
The survey question and answers are placed on the forms page using a default
layout. Joes text uses a slightly different layout to accommodate the extra
width of the text Joe will use.
Follow these steps to recongure the paragraph layout:
1. Choose View > Object Boundaries to display the boundaries on the elds
again. The boundaries also include the elds mark, which is useful for lay-
ing out the text labels.
Figure B3.23 The nished survey question looks good,
but it doesnt read much like Joe wrote it.
2. Select the Answer object on the Hierarchy palette or
click the border of the radio button response block in
the Body Pages view.
3. Choose Window > Paragraph to open the Paragraph
palette (Figure B3.24). You can leave the palette oat-
ing because you only use it briey.
4. Check that the Align Left button and the Align Middle
button are both selected.
These are the default settings, which align the text to
the left of the text area and vertically at the middle of
the paragraph. With these settings, the nished text
appears even with the radio buttons.
5. Click the Left Indent eld and type 0.1. The left mar-
gin of the text responses will be indented from the
radio buttons. In the Body Pages view, you can see the
boundary line marker between the check box and the
elds caption, which is adjusted when you reset the
Paragraph (Figure B3.25).
Dont worry about the text that overows in some
optionsyoull x that in the next set of steps.
6. Close the Paragraph palette.
Next, Joe adjusts the response blocks settings usingyou
guessed itanother program palette.
Adjusting the Layout
To accommodate the text, Joe next adjusts the layout of the set of radio button
responses, working in the Layout palette.
Follow these steps to make adjustments to the layout:
1. Choose Window > Layout to open the Layout palette. The palette is tabbed
automatically in the same area as the Object palette at the middle-right of
the program window.
2. Shift-click to select the set of ve (untitled Radio Button) objects either in
the Body Pages view or on the Hierarchy palette.
If you dont select the individual responses, on the Layout palette youll
see the anchor positions and margin settings instead, which apply to the
Answer object.
Figure B3.24 Reset the
indent for the text used in
the radio buttons responses.
Figure B3.25 The text is
indented to the correct
location.
Boundary line between
the check box eld and
its caption
27 CUSTOMI ZI NG THE BUTTON CAPTI ONS
3. Click the X eld and type 3.875in, the distance the text
starts from the left margin (Figure B3.26).
Leave the Y elds value as mixed. The Y eld repre-
sents the distance from the top edge of the page; each
of the selected responses is placed at a different loca-
tion on the page.
4. Click the Width eld and type 2.5in. This sets a text
width that is consistent and wide enough for all
Joes text.
Leave the remaining size and position options at their
defaults.
5. Click the Reserve eld in the Caption area of the palette
and type 0in. You set the paragraph indent in the previ-
ous set of steps, which serves the same purpose.
The Reserve eld denes how much space is reserved in the response
block for the actual check box eld.
Finally, now that the dimensions of the response captions are adjusted, Joe can
change the text of the captions.
Customizing the Button Captions
You can change the content of the captions in either the Body Pages view or on
the Object palettemaking a change in one location automatically changes it
in the other location.
Follow these steps to change the
response captions through the
Object palette:
1. Click the Object palette
located at the right of the
program window, and select
the Field tab to display the
radio button options.
2. Click the rst default text
caption very satised in
the Body Pages view, and
type replacement text. Joe
types Joes Deli rocks!
(Figure B3.27).
Figure B3.26 Set the layout
property to align the start of
each text item the same dis-
tance from the left margin.
Figure B3.27 Joe decides to use button captions that are
a bit more in keeping with his style and sense of humor.
3. Replace the text for the remaining options by select-
ing each item and then typing the replacement text
on the Body Pages view or the Object palette.
The replacement text Joe types is:
Its ne with me to replace somewhat satised
I dont care one way or another to replace
neutral
Could be better to replace somewhat
dissatised
What were you thinking? to replace very dissatised (Figure B3.28).
The captions are nishedvisually at least. In the next section, Joe changes
the order of the radio buttons and renames them.
Resetting the Order of the
Button Selections
The survey question you added from the Library displays a curious charac-
teristic. If you click through the set of buttons on the Hierarchy palette, you
see that their order doesnt correspond to their order in the forms list. In
Figure B3.29, for example, clicking the rst option, Joes Deli rocks!, selects
the fourth button object in the list in the Hierarchy palette. Although it is cer-
tainly possible to keep track of content regardless of the order, why have to
remember an order change when it serves no useful purpose?
Joe is changing the names of the (untitled Radio Button) objects according to
their correct order, and then hell reorder the objects on the Hierarchy palette.
Figure B3.28 The nished set
of radio button options give
the customers ve interesting
choices.
Figure B3.29 The radio buttons arent listed on the Hierarchy
palette in the same order as in the form.
29 RESETTI NG THE ORDER OF THE BUTTON SELECTI ONS
Revising the Names
The set of buttons uses the same name for each option. Joes going to rename
the individual objects.
To change the names of the radio button objects, follow these steps:
1. Click one of the (untitled Radio Button) listings to select it.
2. Click the F2 key to activate the eld.
3. Type the new text and click off the eld to deselect it.
The radio button objects are named RB (for Radio Button) and numbered
according to their position in the response as shown in Figure B3.30. The radio
button objects are named RB4, RB3, RB2, RB1, and RB5at least the last object is
correctly ordered!
The last bit of business is to tidy up
the Hierarchy palettes listing.
Reordering the Listings
You can change the order in which
objects are listed on the Hierarchy
palette. To move a listing, select it
from the Hierarchy palette, and then
drag it up or down. Youll see a hori-
zontal line and the objects name and
icon indicating where the selected
object is moved when you release the
mouse (Figure B3.31).
Reorder the set of ve radio button
options on the Hierarchy palette so
they read in the correct numerical
orderthat is, from RB1 through RB5.
The answers are nally named and ordered. The last thing to check for this
question (can you believe Joes still working on the rst question?) are the
data bindings.
Figure B3.30 The radio button objects are named
according to their positions in the response list.
Figure B3.31 Reorder content
on the Hierarchy palette by
dragging and dropping.
Looking at Data Bindings
A form eld that contains several options for the user to select has to have
a way to distinguish one option from another. Otherwise, whats the point of
asking the question?
In Joes survey, customers will click one radio button. Each answer is a separate
object with a unique value. In Adobe Designer, as well as other database and
forms design programs, these assigned values may be called export values or
data bindings. In Joes question, the default data bindings are listed in the same
unsequenced order as the radio button objects were listed on the Hierarchy
palette, although the values are logical.
In the default values, for example, if a customer chooses very satised, the
response is ranked 1; if the customer chooses What were you thinking? the
response is ranked 5.
Revising Item Values
Depending on how you have been manipulating the values in the survey ques-
tion, you may have to renumber the radio buttons date bindings. However, if
youve been following along with the project, when you reordered the listing
on the Hierarchy palette, the items in the Binding tab were reordered as well.
If you need to change a value, follow these steps:
1. Select the Answer object in the Body Pages
view or on the Hierarchy palette.
2. Choose the Binding tab on the Object
palette.
3. Double-click the Value shown for an Item
to activate the eld (Figure B3.32).
4. Type the correct ranking number.
5. Click off the eld to deselect it.
All is in order. The rst survey question is
done at last! Joe plans to offer his customers
the option of adding a text comment, which
he does in the next section.
Figure B3.32 Change the value
of any of the items in the
Binding tab.
31 USI NG A TEXT FI ELD
Using a Text Field
Each survey question will also have a corresponding text eld in which cus-
tomers can add comments if they like. Joe adds a text eld from the Library
palette; and then he changes the text and font, changes the size of the eld,
adds a border to outline the eld, and nally renames the eld.
Adding and Conguring the Text Field
Follow these steps to add the eld and then congure it on the Layout palette:
1. Select the Standard tab on the Library
palette to display the list of object types.
2. Click the Text Field object, and drag it
to the Body Pages view to add the eld
to the form (Figure B3.33). You see the
default name for the eld, TextField1,
in a tooltip and added to the Hierarchy
palette.
3. Select the Object palette, and then
select the Layout palette (shown in Figure B3.26).
4. In the Size & Position area of the palette, click the Width eld and type
3.25in to increase the width of the eld.
5. Click the Height eld and type 0.75in to increase the height of the eld.
6. In the Caption section of the Layout palette, click the Reserve eld and
type 1.0in.
The reserve is the amount of space within the eld that is reserved for
a caption. Leave the default caption position set at Left.
7. Click the default text on the eld and type a different caption. In Joes
form, the comment eld is labeled Any other comments? and wraps over
two lines.
8. On the Font toolbar, click the Font pull-down arrow and make a choice; Joe
uses Arial 10pt bold text.
9. To allow the user to type multiple lines of text in the eld, select the
Object tab, and then select the Field tab. Click Allow Multiple Lines.
On the Field tab, youll also see options for the text entry boxs outline.
Joe leaves the default Sunken Box appearance to match the radio buttons
check box style.
Figure B3.33 Add a text eld to the form from
the Library palette.
The eld is looking better, but its a bit hard to differentiate from the rest of
the form, so Joe decides to add a border.
Applying a Border
Joe adds a border using the same method he used to apply the border to the
radio button response block.
Follow these steps to add the border:
1. Choose Window > Border to open the Border palette.
If youve kept the palette open since the last time you used it, it is tabbed
with the Layout and Object palettes. Choose the Border tab to display that
palette, shown in Figure B3.21.
2. Click the Edges pull-down arrow and choose Edit Together. Joe wants to
apply one uniform border around the eld.
3. Click the pull-down arrow next to the square icon and choose Embossed-
3D, which is the same border style that Joe applied to the response block.
The last thing Joe has to do to the text eld is change its name.
Changing the Name in the Binding Tab
As with other object names, Joe can change the name of the text eld on the
Hierarchy palette, but since hes already working in the palettes at the right of
the program window, he can change the name of the comment text eld in the
Object palette instead.
Follow these steps to change the elds name:
1. Select the Object palettes tab, and then select the
Binding tab.
2. Click the default name in the Name eld to activate
the text, and type the new name. Joes eld is renamed
Comment. (Figure B3.34). When he adds the other ques-
tions, Adobe Designer will number the questions ele-
ments automatically, so he doesnt have to do it himself.
3. You see that the text eld also has binding options. You
can leave the defaults, which use the Normal data bind-
ing format, and Plain Text data format.
Figure B3.34 You can
rename a eld in the
Binding tab of the Object
palette.
33 ADJUSTI NG THE FI ELDS LOCATI ONS
Once Joe arranges the questions components, hes going to create a custom
object of his own to store the Library that hell use to easily add the remaining
questions.
In case you were wondering if this is the project that wouldnt endJoes only
using three questions in total!
Adjusting the Fields Locations
If youve been following along with the project, youll have noticed that there
havent been precise instructions for placing the elements in relation to one
another. In this section, you use more of Adobe Designers features to nalize
the layout of the questions components.
Activating Placement Tools
Follow these steps to use Adobe Designers placement fea-
tures to organize content in the question:
1. Choose Window > Drawing Aids to open the Drawing
Aids palette (Figure B3.35).
2. Drag the palette to dock it with the other palettes at
either side of the program window.
3. Click the check boxes for Show Grid, Snap to Grid, Show
Guidelines, and Show Object Boundaries.
You could, of course, choose the options from the pro-
gram menus, but opening one palette and clicking check
boxes saves some time.
Now that the tools are activated, Joe will align the questions
elements and then group them.
Aligning Objects
Its a lot simpler for Joe to have the original layout correct rather than having
to reorganize the objects in each new copy of the question he adds to the form.
Joe wants the different parts of the question to align evenly.
Aligning an Object Pair
Follow these steps to adjust the alignment of the questions text elements:
Figure B3.35 Select place-
ment tools and drawing
aids from the palette.
1. Click the Question object on the page
to select it.
2. Shift-click to select the Comment
text eld.
You see both elds surrounded by one
bounding box (Figure B3.36).
3. Choose Layout > Align > Horizontal
Center. The two objects are now
aligned horizontally.
Next, Joe aligns the bottom of the objects.
Aligning the Bottom of the Question
Follow these steps to align the bottom edges of the text eld and the radio
button response block:
1. Click anywhere on the page to deselect the previously selected objects.
2. Click the Comment object to select it, and then shift-click to select the
Answer object containing the radio button responses.
3. Choose Layout > Align > Bottom. You see the text eld shifts lower to
match the Y-axis value (the distance from the top of the page) of the
response block.
NOTE Its important that you select the objects in the order specied in the steps. When
you select objects and then apply an alignment command, Designer uses the last object
selected as the one the other selected objects are adjusted in relation to. If instead you
see the response block shift upward, undo the command, deselect the objects, and then
select them in the order specied in the steps.
Grouping the Objects
The nal step is to combine the objects into a single group. Although it isnt a
strict requirement to do so, its simpler to create the custom object from the
questions elements when they are grouped.
Follow these steps to group the objects:
1. Shift-click to select the Comment, Answer, and Question objects in the
Body Pages view or on the Hierarchy palette.
The order in which you select the objects doesnt matter.
Figure B3.36 Select the objects you want to
align on the page.
35 ADDI NG CONTENT TO THE LI BRARY
2. Choose Layout > Group.
4. On the Hierarchy palette, you see that the objects are com-
bined into another object called (Group) (Figure B3.37).
Imagine that!
Its been a lot of work, but its done and ready to go. Be sure to
save the form periodically. Joes form is saved complete to this
point as surveyC.pdf.
Next, Joe will create a custom object for the library.
Adding Content to the Library
Youve seen how much work it is to add objects and elds
to a form and then modify their contents, appearance,
and values. Fortunately, you can add an object to the
Library that you can reuse at any time.
Follow these steps to create the new Library item:
1. Select the Group object from the Hierarchy palette.
2. Right-click over the group of objects in the Body
Pages view to open the shortcut menu and choose
Add to Library to open the Add Library Object dialog
(Figure B3.38).
3. Type a name for the object in the Name eld. Joes
object is named joe_survey.
4. You can also add a description in the appropriate
area if youd like. Joe adds a description that reads,
Survey questiontext question, set of ve radio buttons,
comment text eld.
5. Click the Tab Group pull-down arrow, and choose Custom
from the list.
6. Click OK to dismiss the dialog.
To check the object, select the Custom tab from the Library
palette. You see Joes custom object is added to the list. Moving
the pointer over the object displays the information added in
the Description area of the dialog in a tooltip (Figure B3.39).
Figure B3.37 The set
of objects are com-
bined into a single
group.
Figure B3.38 Add a name
and description for the object
and assign the Tab Group in
the dialog.
Figure B3.39 Joes
custom object is safely
added to the Designer
Library.
When a new object is added to the Library, its placed at the bottom of the list
on the palette; to reorder the list, click and drag an item up or down. Joe drags
his custom object to the top of the list, as seen in Figure B3.39. If you are plan-
ning a big forms design project, drag your custom objects to the top or bottom
of the Library palettes listing for ease of use as you create them.
The question object is ready for use, as youll see in the next section.
Adding Questions
This is where the process really speeds up! Its a simple matter for Joe to add
the remaining questions and then modify their layouts and the text of the
questions on the form.

Download JoesDeliSurvey.pdf if youd like to see the nished form with the additional
questions and their customizations. You can also nd another copy of the form saved in
Acrobat 6-compatible format named JoesDeliSurvey6.pdf. If youve been working along
with the project, continue with your own le.
Inserting the Questions
First Joe adds the other questions, which are automatically inserted on the
form as groups, because the content was grouped when he created the custom
object. Follow these steps:
1. Click the joe_survey object in the Custom tab of the Library palette and
drag it to the Body Pages view. Drop the object below the existing question
on the page.
2. Add one more copy to the page.
Thats all it takes to add more elds to the form! Adobe Designer, like Acrobat,
uses an automatic naming system when duplicates of the same eld or elds
are used in a form. Joe looks over the new elds next.
Reviewing the Field Names
In Joes form, adding copies of the question object creates duplicates that
Adobe Designer automatically renames (Figure B3.40).
37 TWEAKI NG THE LAYOUT
Note in the gure that the set of
ve radio button responses arent
renamedthey are child objects of the
radio button object, which does have
a unique name in each case. Designer
doesnt name the (Group) objects
either, but you dont have to change
the nameswhen the form is nished,
youll ungroup them again.
NOTE If you leave objects grouped, Adobe
Designer will dene them in the forms
schema, or structure, as an area.
The form is nearly nished. Joe makes
some nal adjustments, and then mod-
ies the e-mail button before ending
this part of his adventure in Joes world
of forms.
Tweaking the Layout
Now youll see why its simpler for Joe
to work with grouped questions to
arrange them on the page. The steps
listed are the method Joe uses; you can
make further adjustments if you like.
Follow these steps to nish the layout:
1. On the Hierarchy palette, collapse the (Group) listings by clicking the ()
to the left of the listings, which toggle to the (+) indicator.
Joe selects the groups from the palette instead of in the Body Pages view
because its quicker to click one listing than select multiple objects.
2. Select the third (Group) listing on the Hierarchy palette, and move the
question down to about 7 inches from the top in the Body Pages view.
You can drag the group downward; or select the Layout palette, click the
Y eld, and type 7in.
Figure B3.40 Adobe Designer uses an automatic
naming system for duplicate objects.
Additional groups are
not named separately
The second ques-
tions eld names
have a [1] sufx
The third questions
eld names have a
[2] sufx
The original ques-
tions eld names
now have a [0] sufx
3. Shift-click the icon for each of the
three (Group) listings on the Hierarchy
palette to select the three survey ques-
tions. Joe clicks survey_items, which
highlights Q1, Q2, and Q3.
Dont click the listing text because that
merely opens the groups listing again.
4. In the Body Pages view, drag the
grouped objects downward slightly.
Theres a lot of room on the page, and
Joe wants to separate the questions
from the heading subforms content.
You can use the arrow keys on the key-
board to nudge the selected content. In
the form, Joe moves the groups down-
ward by clicking the down arrow
key twice.
5. Choose Layout > Align > Horizontal
Center to center the questions.
6. Choose Layout > Distribute > Down to space the three questions evenly on
the page
7. Choose Layout > Center in Page Horizontally. The set of questions are now
centered across the page (Figure B3.41).
Everything looks pretty good. The only problem is that all three questions ask
the same thing. Time to x that.
Modifying the Questions Text
Visually, the last thing Joe has to do with the questions is rewrite the text of
the actual questions. His custom Library object uses the same text as that pro-
vided by the default custom object he started with. Its time to change that.
To change the wording of the survey
questions, select the text in each
object and type the new question.
Joes three questions are:
1. Is our e-mail menu a convenient
way to order?
TIP If you nd the text jumping and the text
box resizing when you try to replace the text,
check the Layout palette. If the Auto-t check
boxes are selected, deselect them. That way, the
replacement text is typed in the same size of text
box with which you started.
Figure B3.41 The nished layout of the form
spaces the questions evenly on the page.
39 TWEAKI NG THE LAYOUT
2. What do you think of the quality and portion sizes?
3. Is our delivery service friendly and convenient?
He could, of course, add far more questions and customize the radio button
responses further. But you get the idea.
The questions look the same when they are added to the form, but Joe wants
to review their contents just to be sure. He checks on the Object palette.
Checking Data Bindings
When Joe added the rst question to the form, he had to modify the values
assigned to the items in the Object palettes Binding tab. All was in order
before he saved the custom object to the Library,
so presumably all should be in order in the new
objects. But Joe wants to check to be sure.
To check the elds values, follow these steps:
1. Click the Answer[1] listing on the Hierarchy pal-
ette to select it.
2. Select the Object palette in the palette area at
the right of the program window, and select the
Binding tab.
3. Review the item values listed on the Binding
tab; you see that they are in fact just as Joe
designed them (Figure B3.42).
You see that the number Designer assigns to the
eld is placed on the tab itself, not in the active
eldits circled in Figure B3.42.
4. Repeat the steps using the Answer[2] object.
The questions are nished. Joe needs to ungroup the
questions, but before he does, hell give the form a
last once-over and make any nal adjustments.
TIP Its best to leave a layout operation such as ungrouping until you are done with a
form. That way, if you want to make any other changes, you dont have to move objects
manually or waste time selecting numbers of objects.
Figure B3.42 The duplicated objects
contain the correct values bound to
the items.
Taking a Final Tour of the Form
Nothing is quite so annoying as thinking you have nished a piece of work
especially one as mentally vigorous as building a formonly to nd that you
have sent it out with a typo, or something out of alignment, or.... Well, you get
the idea.
Joe has a sense of humor, yes, but he is also a very astute businessman and
knows that his customers are very aware of how documents should be pre-
sented.
To save possible irritation later, take one last look at the form:
Check the eld names on the Hierarchy palette to be sure they are unique,
understandable, and named as youd like.
Click through the elds on the form, and check their values in the Binding
tab of the Object palette. Make sure the values assigned to the form elds
are as they should be.
Check spelling! Adobe Designer doesnt have a spell-checker, so you have
to read through the content manually.
Check the instructions at the top of the form to see that the nal instruc-
tions in fact match the nal form design.
Check the e-mail button, added by Adobe Designer when you started
the project.
Hmm. Joe doesnt like the buttons label and its color. One last tweak before
leaving Designer.
Modifying the E-mail Button
The e-mail submission button is the default that Adobe Designer added to the
form. In Joes text instructions, he called the button Send by Email,while the
default buttons label is Submit by Email. Joes going to change the text, as
well as the buttons appearance.
Changing the Text
To modify the buttons text, follow these steps:
1. Click the EmailSubmitButton1 eld to select it from either the Hierarchy
palette or the Body Pages view.
41 MODI FYI NG THE E- MAI L BUTTON
2. Change the text; Joes label is renamed Send by Email.
3. Change the font in the Font toolbar to coordinate with the rest of the form.
Joe used Gills Sans MT font for the header section of the form and selects
the same font from the Font toolbar, as well as making the text bold and
11pt size.
Thats better. But hes not happy with the appearance of the button either. Its
a slightly different color than the rest of the form. Another easy x!
Changing the Buttons Appearance
The e-mail button is a default eld type added by Adobe Designer and is included
on the Library palette. Joe doesnt need to change the actual Library object;
hell just adjust the appearance of the button on the form to match the rest of
the elds.
Follow these steps to modify the button in the Object palette:
1. Click the EmailSubmitButton1 eld to select it.
2. Choose the Object palette at the right side of the program window. You see
that the Field tab is displayed.
3. Read through the content on the tab.
You may recall that Joe added his e-mail address when working through
the New Form Assistant to start the form. The
address is shown in the Email Address eld on
the Object palette.
4. Click the Email Subject eld, and type a subject
for the e-mail that is sent in response to the user
clicking the button (Figure B3.43). When the form
was designed, there was no option to add a subject.
5. Click the Appearance pull-down arrow on the
Field tab, and choose Custom. The Custom
Appearance dialog opens and includes the same
options as those in the Border palette, shown in
Figure B3.21.
6. Click the Edges pull-down arrow and choose
Edit Together.
7. Click the pull-down arrow next to the square
icon and choose Embossed 3D; this is the style
used for edges throughout the form.
Figure B3.43 Check and change the
buttons settings in the Field tab of
the Object palette.
8. In the Background Fill area of the dialog, click the Style pull-down arrow
and choose Linear - to top. Leave the default Fill Color (Start) as white;
click the Fill Color (End) button, and choose Gray-25% from the color palette.
9. Click OK to dismiss the dialog and modify the button. Thats better!
NOTE If you happen to reopen the Custom Appearance dialog, youll see the Edges
option converted back to Edit Individually, with each edge given the Embossed 3D setting.
Unless you use the steps as listed, you cant choose the Embossed 3D setting for each
edge. Go gure!
Ungrouping the Questions
Before leaving Designer, Joe ungroups the questions. Hell save one level of
objects in the hierarchy, which youll see later are given very long names
in Acrobat.
To ungroup the questions, select
a (Group) listing, and then choose
Layout > Ungroup from the program
menu. Repeat with the other two
group listings.
Save the le one last time.
At long last its time for Joe to get into
the meat of the projectform test-
ing, and then distribution and data
collection. Since hes going to switch
programs from Adobe Designer to
Acrobat 7 Professional, its also time
for him to stretch and get a cup of
coffee. How about you?
Testing the Form
Coffee break is over. Joes going to test the form in Acrobat 7 Professional and
then send it out to his mailing list.
To test the form, follow these steps:
1. In Acrobat 7 Professional, open the nal version of the form you are using.
You can use your own form if you have been working along with the proj-
ect, or either version of the form from the Web site ( JoesDeliSurvey.pdf or
JoesDeliSurvey6.pdf, which is saved in Acrobat 6-compatible format).
One Final Step in
Adobe Designer
Heres an important last step to take
to preserve your sanity. If you have
followed along with the project, or
are using any of the downloaded
les from the Web site, you will have
Joes ctional e-mail address bound
to the e-mail button. Change this
e-mail address in Adobe Designer if
you plan to try the distribution and
data collection processes. That way,
you can send and receive e-mails,
and they wont end up in some
unknown e-mail in-box.
43 TESTI NG THE FORM
2. On the Document Message Bar, click the
Highlight Fields check box. The elds on
the form are indicated by a mauve overlay.
In Figure B3.45, youll see pale gray lling
the radio buttons check boxes and the
text comment elds..
The Document Message Bar is shown by
default in both Acrobat and Adobe Reader
when a document containing interactive
elements, such as elds, is opened.
3. Deselect the check box. Right-click/
Control-click the Document Message Bar,
and click Hide Document Message Bar.
4. Click each radio button on the form. Youll
see that as you select one button in a
question, the others are deselected.
Form Features and Program Versions
Consider your users software when deciding how to save the forms. Interactive forms
those using llable elds and containing buttonscan be used in different versions of
Acrobat and Adobe Reader. Not all features are supported in all versions.
Users can ll in PDF forms online with either Acrobat or Adobe Reader. If your users are
working with Acrobat or Adobe Reader 6.0, they must install the Acrobat/Reader 6.0.2 updates.
A form saved for Acrobat 7 can only be opened with Acrobat 7 or Adobe Reader 7. A form
saved for Acrobat 6 can be opened by version 6 or 7 of the programs.
There are two versions of the nal form
available from the book's Web site named
JoesDeliSurvey.pdf and JoesDeliSurvey6.pdf;
the latter is saved as Acrobat 6 compatible. If
you open the JoesDeliSurvey6.pdf form in
Adobe Designer, youll see cautions on the form
identifying structures or features that arent
Acrobat 6 compatible (Figure B3.44).
You can read a complete listing of features and
program versions that support those features in
Adobe Designers Help les.
Figure B3.44 Saving an Adobe Designer
form as an Acrobat 6-compatible form
indicates items that may create problems
for users.
Figure B3.45 The Document Message Bar
is shown automatically when the form is
opened.
5. Click to type text in the comment elds (Figure B3.46).
6. Click the Send by Email button on the form to open the Send Data File
dialog. Click Send Data File to dismiss the dialog.
Depending on your system
conguration, you may rst
see a dialog asking you to pick
an e-mail client. If the dialog
appears, select how you usu-
ally send e-mail (a desktop
application, Internet mail, or
other method), and click OK.
7. Your e-mail program opens,
displaying a message using
Joes address and subject, with
the data le from the form
included as an XML attach-
ment (Figure B3.47).
8. Close the e-mail window with-
out sending the le, especially
if it is addressed to Joe!
9. Click Close to dismiss the
Email Conrmation dialog,
which tells you your data le
has been sent.
Figure B3.46 Test the elds on the form.
Figure B3.47 When you click the e-mail button, an e-mail
message with the address and subject already added and
the data le attached.
45 TESTI NG THE FORM
If you need to make any changes to the form, nows the time to do it. A form
built in Adobe Designer cant be modied in Acrobatyou must reopen the
form in Adobe Designer to make any changes.
Joe is happy with his testing and is going to use one of Acrobats built-in fea-
tures to distribute the form for data collection purposes, after he takes a peek
at the elds in Acrobat.
Opening Adobe Designer from Within
Acrobat 7 Professional
In the project, Joe works from Adobe Designer exclusively, but there are
several ways you can open the Adobe Designer program from within Acrobat 7
Professional in Windows:
For a blank form, click the Forms task button to display its pull-down menu,
and choose Create New Form.
To make an interactive form from a static form, rst open the form in Acrobat.
Click the Forms task button to display its pull-down menu, and choose Make
Form Fillable in Adobe Designer.
If you have an interactive form open in Acrobat, click the Forms task button to
display its pull-down menu, and choose Edit Fillable Form.
If you want to edit an existing form, open the form in Acrobat, and then choose
Advanced > Forms > Open Form in Adobe Designer.
Checking the Fields
Before distributing the form, have a look at what it contains from Acrobats
perspective. Choose View > Navigation Tabs > Fields to check out the elds in
the Form pane. It looks pretty complex, doesnt it?
Heres a rundown of the form contents (the numbered items are shown in
Figure B3.48):
1. The original form you created in Designer is renamed form1[0] using
Designers auto-numbering scheme.
2. The two subforms you built, the header and survey_items subforms, are
shown in dot notation format, as are the other elements of the form. The
survey_items subform, for example, is renamed form1[0].survey_items[0].
Dot notation denes the relationships among the elements and shows the
dependencies built into the forms hierarchy. Each level of the hierarchy is
placed after subsequent periods (.) in the objects name.
Figure B3.48 Acrobat shows the struc-
ture of the form in the Fields pane.
1 The original
form is renamed.
2 Each subform is
redened.
3 The header sub-
form contains one
eld.
4 All elds in
the survey are
reordered.
5 Each radio
button option
is assigned a
number.
6 The comment
text elds are
included, but not
the questions
text.
47 DI STRI BUTI NG THE FORM
3. The only eld listed in the header subform is the e-mail button; all other
components of the header subform are either text or images.
4. The elds in the survey_items subform are arranged both numerically and
by type.
5. Similarly, the radio button options are relabeled to show their relationship.
For example, in the rst survey question, named Question[0] in the form,
the radio button for the Joes Deli Rocks! option, originally called RB5 in
Designer, is revised to form1[0].survey_items[0].Answer[0] #0. This name
means: the form/the subform/the Answer radio button group/the option.
The set of options are numbered from 0 to 4, not from 1 to 5.
6. The text elds added to the form so users can type additional comments
are included in the Fields pane.
If you look through the list, you wont see the text elds used to hold the
actual questions for each survey item. The questions arent contained in
active elds, and only active elds are listed in the Fields pane.
Thats enough analysis! Now that Joe has completed his form and tested it, its
time to send it to his customers.
In the next section, Joe is going to distribute the form to his customer mailing list. If youd
rather not send several copies of the form to yourself, ll out the form multiple times,
and then send the copies back to yourself, you can use the set of three data les from
the Web site. The les are named JoesDeliSurvey_data1.xml, JoesDeliSurvey_data2.xml,
and JoesDeliSurvey_data3.xml.
Distributing the Form
Joe can attach the form to an e-mail the way he distributes his menu (the proj-
ect built in Chapter 10). He can then collect and compile the results manually, or
he can use one of Acrobats workows. Joe decides to take the workow route,
which combines several processes into wizards. The nal outcome is the same,
but the workow is a cool feature, and Joe is a cool kind of guy.
The Initiate Form Data Collection Workow method distributes the form via
e-mail and then guides the users on how to return the form data. The only
requirements to use the workow method are that the form must have form
elds to process and there must be an e-mail submit button. Both of these cri-
teria certainly apply in Joes project.
Follow these steps to send the form by e-mail:
1. Open the JoesDeliSurvey.pdf form in Acrobat 7 Professional (not in Adobe
Designer). This is the nal version of the form.
2. Choose File > Form Data > Initiate Form Data Collection Workow to open
the Initiate Form Data Collection Workow dialog.
You can also open the dialog by choosing Advanced > Forms > Initiate
Form Data Collection Workow, or by selecting Initiate Form Data
Collection Workow from the Forms task buttons pull-down menu.
3. The rst pane of the dialog explains the steps involved. You see that there
are three partse-mailing the form, collecting the data, and building a
spreadsheet. Click Next to start the wizard.
4. In the Invite Recipients pane, click the Address book to open your e-mail
programs address book to select the names to use.
Or you can type e-mail addresses for the recipients in the Invite Recipients
window; include a comma between the e-mail addresses (Figure B3.49).
Figure B3.49 The selected recipients names are listed on the dialog.
49 SAVI NG THE DATA FI LES
5. Click Next to display the default e-mail message that Acrobat will use in
the Preview Invitation window (Figure B3.50).
You can edit the subject line and text if you like. Joe changes one phrase
in Step 3 of the e-mail that says the form may contain an email submit
button to the form contains an email submit button.
6. Click Send Invitation to dismiss the dialog and open an e-mail window
containing the contents from the Preview Invitation window of the wizard.
7. Click Send. The survey is on its way!
Joes got some other correspondence to do, and by the time hes nished,
the replies have started returning, which of course only happens in a perfect
world. Lets assume Joes world is near-perfect and move on.
Saving the Data Files
The les are returned to Joe via e-mail. Each e-mail contains an XML
(Extensible Markup Language) attachment using the same name; based
on his forms design, the les are all named JoesDeliSurvey_data.xml.
Figure B3.50 Read and revise the default e-mail message before sending the form.
The best thing for Joe to do (or anyone else for that matter) is to build a sepa-
rate folder on his hard drive to use for storing the returned data les. That way,
he can both nd them easily and prevent renaming responses using the same
name.
Each le is returned using the same name. Before saving the les, give each
a unique name. Joes les have a number appended to the end and are saved
as JoesDeliSurvey_data1.xml, JoesDeliSurvey_data2.xml, and JoesDeliSurvey_
data3.xml.
Its time for him to take a look at the feedback from his survey. Hell do that by
building a spreadsheet from his data.

Download JoesDeliSurvey.csv if youd like to view the nished le based on the data les
from the Web site.
Creating a Spreadsheet
Once youve collected PDF form data in XML or FDF (File Data Format) format
from multiple users you can organize the form data into a comma-delimited
spreadsheet le in the CSV (Comma Separated Values) format. After exporting
the form data to a CSV le, you can view the data in a spreadsheet application,
such as Microsoft Excel.
Follow these steps to organize the data from Joes form as part of the Form
Data Collection Workow:
1. In Acrobat 7 Professional, choose File > Form Data > Create Spreadsheet
From Data Files to open the Export Data From Multiple Forms dialog.
2. Click Add Files, and then select the les to include in the Select File
Containing Form Data dialog.
In the project, the les use the .xml extension. You can also use .fdf, .pdf,
or .xfdf le extensions for data collection.
3. Click Select to dismiss the dialog and add the les into the Export Data
From Multiple Forms dialogs list (Figure B3.51).
If you want to include forms and form data that you have added to the
Data Files list, click the Include most recent list of les to export data
from check box. In Joes project, he hasnt used any form data yet, so it
isnt necessary to select the option. If he adds subsequent data to the le,
he can select the option at that time.
51 CREATI NG A SPREADSHEET
4. Click Export to open a Select Folder To Save Comma Separated File dialog.
The le is named report.csv, and the folder that contained the data les is
selected as defaults.
5. Select a different storage location and/or rename the le if you like, and
then click Save.
Joes le is saved as JoesDeliSurvey.csv.
6. The les are processed; an Export Progress information dialog displays
Done when the spreadsheet is complete.
7. To view the spreadsheet, click View File Now to dismiss the dialog, and
open your spreadsheet program, or Click Close the Dialog if you dont want
to check out the spreadsheet.
Joe decides to take a look.
Figure B3.51 Select the data les you want to combine in a
spreadsheet le.
Viewing the Final Results
When Joe clicks the View File Now button at the end of the data collection
process, his spreadsheet program opens and the compiled results are shown.
The data collected from the three XML les described in the last sections are
shown in the spreadsheet in Figure B3.52. The columns of the spreadsheet
have been adjusted to show you the content more clearly; in some cases, the
full name of the eld isnt shown. If you check the gure, youll see where the
data originated.

Joe can save the data spreadsheet le in a native Excel format or even create a PDF of
the results. If youd like to see these additional les, download JoesDeliSurvey.xls in Excel
format, or see the PDF version of the data les in JoesDeliSurvey_data.pdf.
Figure B3.52 The exported data is shown in a spreadsheet layout for ease of reading.
Each row is a separate
survey response data le
Values of the radio
buttons selected for
each question
Comments from
question 1 about
convenience
Comments from
question 2 about
quality and portion size
Comments from
question 3 about
delivery service
53 CREATI NG A SPREADSHEET
Where the Data Comes From
Adobe Designer saves the data les in XML format. You can see the actual data
les by double-clicking one of the JoesDeliSurvey_data.xml les. The le is
opened in whatever program your system species for opening XML les; usually
its a Web browser or a text editor. In Figure B3.53, one of the sample XML les is
shown in Dreamweaver so you can see the line numbering.
Notice in the gure that
Commented information is included at the start of the le explaining what the
contents are. The text states that the le contains data from a form, not the
form itself.
The labeled objects you added to the form are listed as tags in the XML
document. For example, the <Answer> </Answer> tag pair includes a number,
which is the response the user chose from a set of radio buttons.
The comments typed into the form are also shown, between a pair of
<Comment> </Comment> tags.
The XML model includes only the forms content; you dont see any of the form
layout information.
Figure B3.53 The
data exported from
the form is stored in
an XML le.
What Else Can He Do?
This project has been a whirlwind tour through Adobe Designer. If you have
worked through the project, youll have seen there are myriad possibilities
almost endless possibilities for the technically inclined among us.
With that said, there are almost endless possibilities for Joes survey as well.
If Joe intends to conduct surveys on a regular basis, or create other types of
forms that he uses both for external and internal business use, he might want
to customize his master page by adding elements such as his logo, address,
contact information, and so on. That way, when he constructs a new form, he
has the objects added automatically.
Joe can qualify the responses for the survey questions. He might add the
question, Do you order the specials regularly? If a customer responds Yes,
then Joe could show a tooltip that instructs the customer to answer a couple
of other questions about the specials. If the customer responds No, Joe can
specify in the elds settings that unless the yes/no question is answered, and
answered Yes, the extra questions about the elds are disabled.
Joe could specify whether the elds are required in the Binding tab of the
Object palette. That is, he could specify that before submitting the responses
by e-mail, a customer has to answer all the questions on the form. Otherwise
a message displays asking the customer to complete the form before trying to
submit the responses.
Joe hasnt considered any accessibility options for his form either. He can work
with Adobe Designers Accessibility palette to add tooltips, reading orders, and
other accessibility features to the form. You can read more about working with
accessibility issues in Chapter 8.
He might like to add buttons for the users to clear responses on the form if
they want to start over. You can see how he did that in the Chapter 10 project,
built in Acrobatconsult Adobe Designers Help les for instructions on how to
build the form eld in Designer.
If Joe really gets into the groove, he might want to look at using a database to
hold content from his forms. He can specify data bindings from a form eld to
a eld in a database and use a server system to feed the content to his data-
base. Hes not quite reached that level yet!
Sadly, as this concludes our adventures in Joes world of forms in this book,
you will never know the answer to the burning question Whats next for Joe?

Constructing A Form Using Adobe Designer: Bonus Chapter

Încărcat de

Informații document

Descriere originală:

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Constructing A Form Using Adobe Designer: Bonus Chapter

Încărcat de

Drepturi de autor:

Formate disponibile

Bonus Chapter 3

S-ar putea să vă placă și