Page 729 - Introduction to Programming with Java: A Problem Solving Approach

• Choosetherightcomponents.
• Be consistent.
• Positioncomponentsappropriately.
GUI Design Basics
In Figure 17.1, note the small circles next to Visa, MasterCard, and Other. Those circles are radio button components (we describe radio buttons in section 17.13). Using radio buttons for the credit card options is an example of choosing the right component. Radio buttons provide implicit instructions to the user about how to proceed. Most users recognize small circles as radio buttons, and when they see them, they know to click one of them with their mouse.
In Figure 17.1, note the Next and Cancel buttons at the bottom center of the window. Assume that the window is one of several windows in a purchasing application. Assume that other windows in the application also display Next and Cancel buttons in the bottom center position. Placing Next and Cancel buttons in the same position is an example of being consistent. Consistency is important because users are more comfortable with things they’ve seen before. As another example, be consistent with color schemes. In a given application, if you choose red for a warning message, use red for all your warning messages.
In Figure 17.1, note how the three radio button components (Visa, MasterCard, and Other) and the
“Credit card:” label component are positioned together as a group. More specifically, they’re aligned in a
vertical column and they’re physically close together. That’s an example of positioning components appro-
priately. Positioning them together as a group provides a visual cue that they’re logically related. As another
Apago PDF Enhancer
example of appropriate positioning, note that there are sizable gaps separating the left, center, and right component groups. Finally, note how the “Shipping destination:”, “Credit card:”, and “Additional services:” labels are aligned in the same row. That alignment, the aforementioned gaps, and the aforementioned com- ponent groupings all lead to a more appealing and understandable display.
Layout Managers
As you now know, positioning components appropriately is an important part of GUI design. In the old days, positioning components was a tedious, manual process. Programmers would spend hours calculating the space needed for each component and the pixel coordinate positions for each component. Today, pro- grammers are freed from that tedium by having layout managers do those calculations for them. As you may recall from the previous chapter, a layout manager is an object that controls the positioning of components within a container. In general, the layout manager’s goal is to arrange components neatly. Usually, the neat- ness goal equates to making sure components are aligned and making sure components are appropriately spaced within the layout manager’s container. For example, in Figure 17.1, layout managers are responsible for aligning the left components, aligning the middle components, aligning the right components, and spac- ing the three component groups across the width of the window.
If a user adjusts a window’s size, the Java Virtual Machine (JVM) consults with the layout manager and the layout manager then recalculates the pixel coordinate positions for each component. All this takes place automatically without any intervention on the programmer’s part. How convenient! Hail to the layout manager!
There are different types of layout managers and they have different strategies for positioning compo- nents within a container. See the table in Figure 17.2. It describes several layout managers from Sun’s API library.
17.2 GUI Design and Layout Managers 695