• No results found

Creating Dynamic Forms

It's funny that with all the advanced technology running on the desktop today, the methods of recording information haven't really changed. Most online forms are just electronic versions of printed forms. This is really a shame because we now have the ability to create forms that adapt to the information you are entering.

For example, suppose you are creating a personal information form containing all the typical pieces of information associated with a person. If you look at a typical form of this type, you'll see many sections with instructions such as "Fill in this section only if married." No computerized form should have instructions such as that-not when there are so many ways to avoid it.

If you really must have your form look exactly the same, no matter what information is being entered, consider selectively enabling and disabling components if they apply. Listing 7.5 shows a very brief example of this technique.

Listing 7.5 Source Code for DynamicDisable.java

import java.awt.*; import java.applet.*;

// This applet demonstrates the technique of enabling and

// disabling components based on the values of other components. // Specifically, it has a choice for sex of "Male" or "Female". // It also has a maiden name field that is enabled only if sex is // "Female".

public class DynamicDisable extends Applet {

TextField maidenName; Choice sex;

public void init() {

// Create the sex choice

sex = new Choice(); sex.addItem("Male"); sex.addItem("Female"); // Default to male

sex.select(0); add(sex);

// Create maiden name and disable it because sex defaults to male maidenName = new TextField(20);

Chapter 7 -- Creating Smarter Forms

maidenName.disable(); add(maidenName);

}

public boolean action(Event evt, Object whichAction) {

// If you get an action event on sex, look at the current // value and enable or disable maiden name accordingly if (evt.target == sex)

{

// If the index is 0, "male" has been selected, so disable maiden name if (sex.getSelectedIndex() == 0) {

maidenName.disable(); // otherwise, enable maiden name

} else { maidenName.enable(); } return true; } return false; } }

This technique doesn't provide much of an improvement over paper forms, however. You could still be looking at a huge document full of components, some of which are enabled and some which are disabled. It would be a lot kinder to the user to show him only the items he actually needs to fill in. In other words, rather than just disabling a component, hide it-make it invisible. Hiding has its drawbacks, however. When you hide a component, the layout manager will change the layout of the components. If you aren't using a layout manager, this won't be a problem. If you are using a layout manager, pay special attention to how the form changes when you show and hide various components. You may want to perform a mixture of disabling and hiding. Listing 7.6 shows a very brief example of how to hide and show components dynamically, using the same components as the example in Listing 7.5. Notice that you must call the validate method after hiding or showing a component. This causes the layout manager to recompute the component positions.

Listing 7.6 Source Code for DynamicHide.java

import java.awt.*; import java.applet.*;

// This applet demonstrates the technique of hiding and

// showing components based on the values of other components. // Specifically, it has a choice for sex of "Male" or "Female". // It also has a maiden name field that is visible only if sex is // "Female".

Chapter 7 -- Creating Smarter Forms

public class DynamicHide extends Applet {

TextField maidenName; Choice sex;

public void init() {

// Create the sex choice

sex = new Choice(); sex.addItem("Male"); sex.addItem("Female"); // Default to male

sex.select(0); add(sex);

// Create maiden name and hide it because sex defaults to male maidenName = new TextField(20);

maidenName.hide(); add(maidenName); }

public boolean action(Event evt, Object whichAction) {

// If you get an action event on sex, look at the current // value and show or hide maiden name accordingly

if (evt.target == sex) {

// If the index is 0, "male" has been selected, so hide maiden name if (sex.getSelectedIndex() == 0) {

maidenName.hide(); validate();

// otherwise, show maiden name } else { maidenName.show(); validate(); } return true; } return false; } } file:///E|/Java%20Professor/Hacking%20Java%20Professional%20Resource%20Kit/ch7.htm (15 of 27) [8/14/02 10:52:50 PM]

Chapter 7 -- Creating Smarter Forms

The CardLayout layout manager is another good tool for dynamic form construction. It lets you create a stack of

different containers (usually panels), only one of which is displayed at any time. By using a card layout, you can create all your panels ahead of time and add them to the card layout. Then, whenever you want to display a specific panel, you tell the card which panel to display. For example, you may have panels that display information on Moe, Larry, and Curly. Listing 7.7 shows a simple example program that uses a card layout and some buttons to select the specific card.

Listing 7.7 Source Code for CardExample.java

import java.applet.*; import java.awt.*;

// This applet demonstrates how a card layout can be used to // display different panels. The panels are given names when // added to the card layout. There are buttons at the bottom of // the screen with names corresponding to the panel names. When // you press a button, it tells the card layout to display the // card with the same name as the button.

public class CardExample extends Applet {

CardLayout cards; Panel stoogePanel; public void init() {

// Need a border layout to have the stooge panel in the center and // the buttons at the bottom.

setLayout(new BorderLayout()); // Create the main display panel

stoogePanel = new Panel(); // Give the main display panel a card layout cards = new CardLayout(); stoogePanel.setLayout(cards);

// Create the panels for the different cards. For demo purposes, each // panel just has a label on it.

Panel moePanel = new Panel(); moePanel.add(new Label("Moe")); Panel larryPanel = new Panel(); larryPanel.add(new Label("Larry")); Panel curlyPanel = new Panel(); curlyPanel.add(new Label("Curly"));

Chapter 7 -- Creating Smarter Forms

// Add the separate panels to the stoogePanel giving them their // own card names.

stoogePanel.add("Moe", moePanel); stoogePanel.add("Larry", larryPanel); stoogePanel.add("Curly", curlyPanel);

// Put the stoogePanel in the middle of the applet's border layout add("Center", stoogePanel);

// Now create a row of buttons for selecting the different cards. The // button names must match the names used above.

Panel selectorPanel = new Panel(); selectorPanel.add(new Button("Moe")); selectorPanel.add(new Button("Larry")); selectorPanel.add(new Button("Curly"));

// Put the row of buttons at the bottom part of the border layout add("South", selectorPanel);

}

public boolean action(Event evt, Object whichAction) {

// If the action event is for a button, whichAction is the button's // label, which is also the name of a card in this program. We just // tell the card layout to show the appropriate card.

if (evt.target instanceof Button) {

cards.show(stoogePanel, (String) whichAction); return true;

}

return false; }

}

Figure 7.4 shows the CardExample applet in action. The buttons along the bottom select the different card, which simply contain a single label.

Figure 7.4 : A card layout enables you to display one of several panels.

When you are creating dynamic forms, you can group sections of your forms onto different cards. You can create different methods for going from one card to the next, like having a master index of the different cards, or putting Next and Prev buttons on each card. If you want to disable a section of the form, don't make that section's card available.

For example, suppose you have a part of the form for entering marriage information-date, place, witnesses, and so on. If a person is single, you don't want to present that part. You can remove it from the set of cards in your card layout.

Chapter 7 -- Creating Smarter Forms