Stefan Cameron on Forms
Building intelligent forms using Adobe LiveCycle Designer

Little Things Matter

In case you haven’t discovered this yet, Acrobat 8.0 was released a couple of weeks ago and along with it came a new version of Designer. While the "what’s new" page does a great job at giving an overview of the major new features available in the product (as it’s supposed to do), it doesn’t mention some of the smaller things that can sometimes be just as beneficial — if not more, in certain circumstances — than the larger features.

As a developer, I can say that we certainly wish we would’ve had more time to spend on improving the usability, look and feel and "fun factor" of Designer but some of us did manage to find some time to implement a few changes that we hope you’ll find useful.

Field Editor Overlay

This feature is actually mentioned in the "what’s new" documentation but I thought I would highlight it here again since it was designed to help you accomplish some of the most basic tasks surrounding form design:

This feature isn’t activated by default. You can activate it by selecting the Field Editor command from the View menu and selecting a single object on the canvas.

There are 3 major parts to the Field Editor:

  1. The Name edit box at the top in the tab. It serves two purposes, the first being to display the field’s name and the second being a way for you to edit the field’s name without having to use the Object palette or the Hierarchy palette. To edit the name, just click on the tab to make the in-place edit box appear:

  2. It also provides a Field Type drop down list that let’s you change the field’s type on a whim from, say, a date/time field to a numeric field — in case you initially picked the wrong type of field. To do this, just click on the box in the lower left hand side of the Field Editor:

  3. Last but not least is the fly-out menu button located on the lower right hand side of the Field Editor. This simply gives you quick access to the context menu which would otherwise be displayed if you right-clicked on the field using your mouse either on the canvas or from the Hierarchy palette.

Resizing Check Boxes and Radio Buttons

When I attended the BFMA Symposium last May, a few customers came to me and explained how awkward it was to work with check boxes and radio buttons when resizing them on the canvas. The problem was that resizing these object types would result in a larger content area.

For example, you would start with a check box you just dropped from the Library palette

and you would then use the selection handles to make it wider

The problem with this was that making the check box wider would increase the size of the content area as opposed to the caption area. This is generally a good thing when you’re working with field types such as text fields or numeric fields because making the field wider is usually related to wanting more "space" for the value to fit in the content area. Check boxes and radio buttons, however, are different. Since their content areas are restricted to a box or circle when the check mark or dot appears, their values never take-up more room than that which you see at design-time on the canvas. Therefore, making a check box or radio button wider is usually related to wanting more room in the caption area rather than the content area.

In Designer 8.0, we fixed that so that when you increase or decrease the width of a check box or radio button, you get the following result instead of the old Designer 7.x result (more caption space without increasing the content area space):

From there, you can quickly click into the caption area in order to make the required changes to the caption without having to first resize the caption area after resizing the check box itself.

Library Palette Accordion View

If you installed Designer 8.0 already, you may have noticed something different in the Library palette: We’ve done away with the old row of tabs at the top and have introduced a new layout which I like to call the "Accordion View".

This is how it used to look like in Designer 6.0 – 7.x. This is how it looks now in Designer 8.0 with the new Accordion View.

The biggest difference between the two styles is that the Accordion View now lets you see (or open) more than one tab at the same time. For instance, in the sample above, you can see content from the Standard, Custom and Barcodes tabs concurrently while in the sample from Designer 7.x and earlier, you could only see the Standard tab.

While this may not seem immediately useful for the Library palette, we wanted to try it out to see how our customers would like it. At the very least, I think it gives the Library more of a catalogue feel, which is what we were aiming for in the first place. If the feedback is positive, we may consider applying the concept to other palettes as well. Imagine being able to see the Field, Value and Binding tabs all at once in the Object palette and not having to keep going back and forth between them to remember what you set in a particular property!

Enhanced Selection Borders

Another pain point when working objects on the canvas was the difficulty in selecting various objects depending on how they stacked-up against each other. For example, it was nearly impossible to select a subform that contained a bunch of objects that each touched the borders of the subform.

In order to address this problem, we decided to make the selection borders for container objects (such as subforms, tables, table rows, radio button lists, etc.) a little more sensitive to mouse movement by padding them to make them easier to grab.

For example, consider the address block you can get from the Library’s Custom tab: It comes pre-wrapped in a subform. Have you ever tried to select just the subform in Designer 6 or 7.x without lasso-ing all the fields (which can be difficult if you have a lot of other fields on the canvas) or using the Hierarchy palette to select the subform? I don’t think you could actually do it. This is how the selection border on the subform looks like in Designer 8.0:

Notice the semi-transparent fill between the anchor points (it looks like a purple-ish color in the image above). That’s the padding area that activates the selection of the subform whether it’s selected or not (note that this fill doesn’t appear when the object isn’t selected). Try it yourself and see how it works!

Here it is again, this time on a radio button list that contains three radio buttons:

Eye Candy

Of course, we managed to add a few treats in the package as well since all these usability enhancements are nice but they can be a little dry too and who says a form design application can’t be nice to look at or fun to play with?

Library Accordion View Animation

When you click on a tab in the Library’s new Accordion View, you might notice that it rolls-downs and rolls-up when you open it and close it, respectively. Both actions are actually slowing down as they approach their final dimensions.

Canvas Fading

Try adding or deleting objects on the canvas. You can also see it when you move an object from one location to another or when you undo an action you just did.

What’s changed from Designer 7.1 is that these actions on the canvas all result in fade-ins for objects coming on to the canvas and fade-outs for objects going off the canvas. It’s very subtle but it just makes it a little less jarring (i.e. the actions aren’t so sudden anymore) to manipulate the objects on the canvas.

Shaded Page Backgrounds

Designer 8.0 also added two small modifications to the page (canvas) background. If you create a new form with a single page and set the zoom factor to 25%, you’ll get a nice feel for what I’m describing here:

This is what the page background used to look like in Designer 7.1. In Designer 8.0, you can see that the page gets a nice shadow on its right and bottom borders and the background is now a subtle gradient going from dark to light.

These minor changes may seem insignificant but when you add them all together, they can make a significant impact. Hopefully you enjoy these enhancements as much as we enjoyed putting them into our product and please feel free to test-drive them yourself.

Posted by Stefan Cameron on November 23rd, 2006
Filed under Designer
Both comments and pings are currently closed.

Comments are closed.