ch22.htm

Java_by_Example,初级经典例子哦,珍藏版本

<P>

This is where the applet creates its <TT>GridBagLayout</TT> object

and sets it as the applet's layout. In the next line, the applet

creates its <TT>GridBagConstraints</TT> object, like this:

<BLOCKQUOTE>

<PRE>

GridBagConstraints constraints = new GridBagConstraints();

</PRE>

</BLOCKQUOTE>

<P>

The applet will use this single <TT>GridBagConstraints</TT> object

in order to set the constraints for each component added to the

layout. Before components can be added, however, they must be

created, which the applet does as shown in Listing 22.7.

<HR>

<BLOCKQUOTE>

<B>Listing 22.7&nbsp;&nbsp;LST22_7.TXT: Creating the Applet's

Buttons.<BR>

</B>

</BLOCKQUOTE>

<BLOCKQUOTE>

<PRE>

Button button1 = new Button(&quot;Button1&quot;);

Button button2 = new Button(&quot;Button2&quot;);

Button button3 = new Button(&quot;Button3&quot;);

Button button4 = new Button(&quot;Button4&quot;);

Button button5 = new Button(&quot;Button5&quot;);

Button button6 = new Button(&quot;Button6&quot;);

Button button7 = new Button(&quot;Button7&quot;);

Button button8 = new Button(&quot;Button8&quot;);

Button button9 = new Button(&quot;Button9&quot;);

</PRE>

</BLOCKQUOTE>

<HR>

<P>

After creating the buttons, the program can start adding them

to the layout. But before the first button gets added, the constraints

object must contain the appropriate values. In this case, only

the <TT>fill</TT> field must be initialized, since the first button

component will use all the other default values:

<BLOCKQUOTE>

<PRE>

constraints.fill = GridBagConstraints.BOTH;

</PRE>

</BLOCKQUOTE>

<P>

Setting the <TT>fill</TT> field to both ensures that the components

(in this case, buttons) will expand both vertically and horizontally

to completely fill their display areas. After initializing the

constraints for the first button, the applet sets the constraints

and adds the button:

<BLOCKQUOTE>

<PRE>

layout.setConstraints(button1, constraints);

add(button1);

</PRE>

</BLOCKQUOTE>

<P>

Now that you have the first button added, it's time to consider

how the second button will fit in the layout. The value the applet

initialized the <TT>fill</TT> field to will remain in effect for

all buttons, so the applet doesn't need to change it again. However,

the layout manager is going to want to know how <TT>button2</TT>

should be placed. The following lines set the constraints and

add the button:

<BLOCKQUOTE>

<PRE>

constraints.gridwidth = GridBagConstraints.RELATIVE;

layout.setConstraints(button2, constraints);

add(button2);

</PRE>

</BLOCKQUOTE>

<P>

By setting <TT>gridwidth</TT> to <TT>GridBagConstraints.RELATIVE</TT>,

the applet tells the layout manager that this button is the next

to the last component in this row, which will determine its width.

The <TT>button3</TT> object is the last component for the first

row, so it sets <TT>gridwidth</TT> to <TT>GridBagConstraints.REMAINDER</TT>:

<BLOCKQUOTE>

<PRE>

constraints.gridwidth = GridBagConstraints.REMAINDER;

layout.setConstraints(button3, constraints);

add(button3);

</PRE>

</BLOCKQUOTE>

<P>

The <TT>REMAINDER</TT> constant tells the layout manager that

this control should fill the first row all the way to the end.

<P>

The <TT>button4</TT> component is the only object on its row,

so it too uses a <TT>gridwidth</TT> of <TT>REMAINDER</TT>:

<BLOCKQUOTE>

<PRE>

constraints.gridwidth = GridBagConstraints.REMAINDER;

layout.setConstraints(button4, constraints);

add(button4);

</PRE>

</BLOCKQUOTE>

<P>

Yes, it's true that the first line above really isn't necessary,

since <TT>gridwidth</TT> was already set to <TT>REMAINDER</TT>.

However, I like leaving this kind of line around because it tells

me that I haven't forgotten something here, that I do indeed want

a width of <TT>REMAINDER</TT> for this button too.

<P>

Because <TT>button5</TT> is both the first and next-to-last button

in its row, it uses a width of <TT>RELATIVE</TT>:

<BLOCKQUOTE>

<PRE>

constraints.gridwidth = GridBagConstraints.RELATIVE;

layout.setConstraints(button5, constraints);

add(button5);

</PRE>

</BLOCKQUOTE>

<P>

Because there's only two buttons in this row, the <TT>button6</TT>

component gets a width of <TT>REMAINDER</TT>:

<BLOCKQUOTE>

<PRE>

constraints.gridwidth = GridBagConstraints.REMAINDER;

layout.setConstraints(button6, constraints);

add(button6);

</PRE>

</BLOCKQUOTE>

<P>

Now, things get a little tricky (like they weren't tricky enough,

right?). If you look at Figure 22.11, you'll see that <TT>button7</TT>

is one cell wide but two cells high. Buttons seven and eight,

on the other hand are two cells wide but only one cell high. Even

though <TT>button7</TT> is technically the next-to-last button

in its row, you don't want to give it the <TT>RELATIVE</TT> width

because then Java will make the button twice as wide. So, the

applet sets the width of <TT>button7</TT> to 1 and the height

to 2, as shown in Listing 22.8.

<HR>

<BLOCKQUOTE>

<B>Listing 22.8&nbsp;&nbsp;LST22_8.TXT: Setting </B><I>button7's</I><B>

size.<BR>

</B>

</BLOCKQUOTE>

<BLOCKQUOTE>

<PRE>

constraints.gridwidth = 1;

constraints.gridheight = 2;

layout.setConstraints(button7, constraints);

add(button7);

</PRE>

</BLOCKQUOTE>

<HR>

<P>

Now, because <TT>button8</TT> is the last button in its row, it

gets the <TT>REMAINDER</TT> width. However, the button also must

be set back to a normal one-cell height, as shown in Listing 22.9.

<HR>

<BLOCKQUOTE>

<B>Listing 22.9&nbsp;&nbsp;LST22_9.LST: Creating<I> </I></B><I>button8</I><B>.

<BR>

</B>

</BLOCKQUOTE>

<BLOCKQUOTE>

<PRE>

constraints.gridwidth = GridBagConstraints.REMAINDER;

constraints.gridheight = 1;

layout.setConstraints(button8, constraints);

add(button8);

</PRE>

</BLOCKQUOTE>

<HR>

<P>

Finally, <TT>button9</TT> can use exactly the same restraints,

which means simply setting the constraints and adding the button,

like this:

<BLOCKQUOTE>

<PRE>

layout.setConstraints(button9, constraints);

add(button9);

</PRE>

</BLOCKQUOTE>

<P>

All of the lines described in this section work together to create

the applet's layout. Every layout will work differently, requiring

that you carefully plan ahead how you want the applet's components

laid out. There's almost an infinite number of ways to use the

constraints along with the <TT>GridBagLayout</TT> manager.

<P>

You may wonder how changes to this example layout will affect

the appearance of the applet. Suppose, for example, you left the

<TT>fill</TT> field set to its default value of <TT>GridBagConstraints.NONE</TT>.

You would then end up with a layout like that shown in Figure

22.12. Figure 22.13 shows the applet with a <TT>fill</TT> setting

of <TT>GridBagConstraints.VERTICAL</TT>.

<P>

<A HREF="f22-13.gif"><B> Figure 22.13 : </B><I>The vertical fill stretches sone controls vertically.



</I></A><P>

<P>

<A HREF="f22-12.gif"><B> Figure 22.12 : </B><I>The fill setting can make a huge difference in how a layout looks.



</I></A><P>

<P>

Another change you might make is to set <TT>weightx</TT> and <TT>weighty</TT>,

which tells Java how to use the extra space that usually surrounds

the controls in the layout. For example, in <TT>GridBagApplet</TT>,

if you set <TT>weightx</TT> to 1, you get a display like Figure

22.14, because you've told Java that you want the layout to fill

the entire horizontal space in the applet. Setting <TT>weighty</TT>

stretches the layout in the vertical direction, as shown in Figure

22.15, which has both <TT>weightx</TT> and <TT>weighty</TT> set.

<P>

<A HREF="f22-14.gif"><B> Figure 22.14 : </B><I>Setting the weightx field stretches the layout horizontally.



</I></A><P>

<P>

<A HREF="f22-15.gif"><B> Figure 22.15 : </B><I>Setting both weightx and weighty stretches the layout in both directions.



</I></A><P>

<H2><A NAME="Summary"><FONT SIZE=5 COLOR=#Ff0000>

Summary</FONT></A></H2>

<P>

Java gives you many options when it comes to creating a layout

for the components that make up your applet. However, having so

many possibilities at your fingertips can be daunting at first,

because there may be several ways to get the effect that you want.

The better you learn to use Java's layout managers, the more easily

you'll know which is the appropriate manager for a specific situation.

Mastering the <TT>GridBagLayout</TT> manager especially requires

time and patience.

<H2><A NAME="ReviewQuestions"><FONT SIZE=5 COLOR=#Ff0000>

Review Questions</FONT></A></H2>

<OL>

<LI>Why would you add multiple <TT>Panel</TT> objects to an applet?

<LI>What are the names of Java's five layout managers?

<LI>Which layout manager is the default manager for an applet?

<LI>How does the <TT>FlowLayout</TT> manager organize components?

<LI>What are the arguments for the <TT>GridLayout</TT> manager's

constructor?

<LI>What component positions can use with a <TT>BorderLayout</TT>

manager?

<LI>How do you add a component to an applet that uses the <TT>BorderLayout</TT>

manager?

<LI>How does the <TT>CardLayout</TT> manager enable you to mimic

Windows 95's property sheets?

<LI>How do you switch from one card to another when using a <TT>CardLayout</TT>

manager?

<LI>How does a <TT>GridBagConstraints</TT> object work in conjunction

with a <TT>GridBagLayout</TT> manager?

<LI>What does the <TT>GridBagConstraints</TT>.fill field control?

<LI>How do you add a component to a layout controlled by a <TT>GridBagLayout</TT>

manager?

</OL>

<H2><A NAME="ReviewExercises"><FONT SIZE=5 COLOR=#Ff0000>

Review Exercises</FONT></A></H2>

<OL>

<LI>Write an applet that uses a <TT>FlowLayout</TT> manager to

display a button on the left side of the applet.

<LI>Write an applet that displays nine buttons in a 3<TT>x</TT>3

grid.

<LI>Write an applet that uses a <TT>BorderLayout</TT> object to

display a single button at the bottom of the applet.

<LI>Write an applet that uses two panels to group two sets of

three buttons.

<LI>Write an applet called CardApplet2 that contains three pages

of controls. The first page should contain three buttons, the

second page should contain a scrolling list, and the third page

should contain a <TT>TextField</TT> control. Clicking on any control

should cause the applet to switch to the next page (except for

the <TT>TextField</TT> control, which only sends an event when

you press Enter). Figure 22.16 shows what CardApplet2 looks like

when its scrolling list card is visible. (You can find the solution

to this exercise in the CHAP22 folder of this book's CD-ROM.)

<BR>

<A HREF="f22-16.gif"><B> Figure 22.16 : </B><I>This is the second page of the CardApplet2 applet.



</I></A><P>

<LI>Write an applet called GridBagApplet2 that displays three

rows of buttons. The first row should contain two buttons, with

the first button twice as wide as the second. The second row should

contain two buttons, with the second button twice as wide as the

first. The third row should contain three normal-width buttons.

Figure 22.17 shows the completed applet running under Appletviewer.

(You can find the solution for this exercise in the CHAP22 folder

of this book's CD-ROM.)<BR>

<A HREF="f22-17.gif"><B> Figure 22.17 : </B><I>This is GridBagApplet2 running under Appletviewer.



</I></A><P>

</OL>

<HR>











<HR WIDTH="100%"></P></CENTER>

<!-- reference library footer #1-->
</CENTER>
<IMG SRC="/images/rule.gif" WIDTH="460" HEIGHT="5" VSPACE="5"
ALT="Ruler image"><br>

<FONT SIZE="-1">

Contact <a href="mailto:[e-mail]">
[e-mail]</a> with questions or comments.<br>


<a href="/legal/">
Copyright 1998</a> 
<a href="http://www.earthweb.com" target="_top">
EarthWeb Inc.</a>,  All rights reserved.<BR>
PLEASE READ THE <a href="/reference/usage.html">ACCEPTABLE USAGE STATEMENT</a>.
<BR>
Copyright 1998 Macmillan Computer Publishing. All rights reserved.
</FONT>
</BLOCKQUOTE>


<!--outer table--><TD VALIGN="TOP">

<!--right side ads -->
<a target="resource window" href="http://adserver.developer.com/cgi-bin/accipiter/adclick.exe/AREA=DCAD1.REF" alt="Click here for more info"><img src="http://adserver.developer.com/cgi-bin/accipiter/adserver.exe/AREA=DCAD1.REF" alt="Click here for more info" height="88" width="88" border="0"></a>
<P>
<a target="resource window" href="http://adserver.developer.com/cgi-bin/accipiter/adclick.exe/AREA=DCAD2.REF" alt="Click here for more info"><img src="http://adserver.developer.com/cgi-bin/accipiter/adserver.exe/AREA=DCAD2.REF" alt="Click here for more info" height="88" width="88" border="0"></a>
<P>



</td>
</tr>
</table>
</BODY>
</HTML>