📄 answers-ch6.html
字号:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"><html> <head> <title>Answers: Performing Custom Painting (The Java™ Tutorials > Creating a GUI with JFC/Swing > )</title><style type="text/css"> .FigureCaption { margin-left: 1in; margin-right: 1in; font-family: sans-serif; font-size: smaller; text-align: justify; } #TopBar_bl { background: url(../../images/java_bar_bl.gif) 0 100% no-repeat; width: 100%; height: 60px; } #TopBar_br { background: url(../../images/java_bar_br.gif) 100% 100% no-repeat; width: 100%; height: 60px; } #TopBar_tl { background: url(../../images/java_bar_tl.gif) 0 0 no-repeat; width: 100%; height: 60px; } #TopBar_tr { background: url(../../images/java_bar_tr.gif) 100% 0 no-repeat; width: 100%; height: 60px; } #TopBar { background: #35556B url(../../images/java_bar.gif); margin: 10px 10px 0 10px; height:60px; min-width:700px; color: white; font-family: sans-serif; font-weight: bold; } @media print { #BreadCrumbs, #Download { display: none; } } #TopBar_right { line-height: 14px; float: right; padding-top: 2px; padding-right: 30px; text-align: center; } @media print { #TopBar_right { display: none; } } #TopBar_right a { font-size: 12px; margin: 3px; padding: 0; } #TopBar a:visited, #TopBar a:link { color: white; text-decoration: none; } #TopBar a:hover, #TopBar a:active { background-color: white; color: #35556B; } #BreadCrumbs { padding: 4px 5px 0.5em 0; font-family: sans-serif; float: right; } #BreadCrumbs a { color: blue; } #BreadCrumbs a:visited, #BreadCrumbs a:link { text-decoration: none; } #BreadCrumbs a:hover, #BreadCrumbs a:active { text-decoration: underline; } #PageTitle { margin: 0 5px 0.5em 0; color: #E76F00; font-family: sans-serif; font-weight: bold; font-size: 20px; } .LeftBar_shown { width: 13em; float: left; margin-left: 10px; margin-top: 4px; margin-bottom: 2em; } @media print { .LeftBar_shown { display: none; } } .LeftBar_hidden { display: none; } #Footer { padding-top: 10px; padding-left: 10px; margin-right: 10px; } .NavBit { padding: 4px 5px 0.5em 0; font-family: sans-serif; } @media print { .NavBit { display: none; } } #TagNotes { text-align: right; font-size: smaller; font-family: sans-serif; } @media print { #TagNotes a:visited, #TagNotes a:link { color: #35556B; text-decoration: none; } } #Contents a, .NavBit a, #TagNotes a { color: blue } #TagNotes a:visited, #TagNotes a:link, #Contents a:visited, #Contents a:link, .NavBit a:visited, .NavBit a:link { text-decoration: none; } #TagNotes a:hover, #TagNotes a:active, #Contents a:hover, #Contents a:active, .NavBit a:hover, .NavBit a:active { text-decoration: underline; } #Contents { float: left; font-family: sans-serif; } @media print { #Contents { display: none; } } @media screen { div.PrintHeaders { display: none; } } .linkLESSON, .nolinkLESSON { margin-left: 0.5em; text-indent: -0.5em } .linkAHEAD, .nolinkAHEAD, .linkQUESTIONS, .nolinkQUESTIONS { margin-left: 1.5em; text-indent: -0.5em } .linkBHEAD, .nolinkBHEAD { margin-left: 2.5em; text-indent: -0.5em } .linkCHEAD, .nolinkCHEAD { margin-left: 3.5em; text-indent: -0.5em } .nolinkLESSON, .nolinkAHEAD, .nolinkBHEAD, .nolinkCHEAD, .nolinkQUESTIONS { font-weight: bold; color: #E76F00; } .MainFlow_indented { margin-right: 10px; margin-left: 15em; margin-bottom: 2em; } .MainFlow_wide { margin-right: 10px; margin-left: 10px; margin-bottom: 2em; } @media print { .MainFlow_indented, .MainFlow_wide { padding-top: 0; margin-top: 10px; margin-right: 10px; margin-left: 0; } } h3, h4, h5 { color: #E76F00; font-family: sans-serif; } #ToggleLeft { display: none; } /t</style> </head><body> <div id=TopBar> <div id=TopBar_tr> <div id=TopBar_tl> <div id=TopBar_br> <div id=TopBar_bl> <div id=TopBar_right> <a target="_blank" href="http://java.sun.com/javase/6/download.jsp">Download the JDK</a> <br> <a href="../../search.html" target="_blank">Search the Tutorials</a> </div> <div class=PrintHeaders> <b>Trail:</b> Creating a GUI with JFC/Swing </div> </div> </div> </div> </div> </div> <div class=MainFlow_wide> <span id=BreadCrumbs> <a href=../../index.html target=_top>Home Page</a> > <a href=../index.html target=_top>Creating a GUI with JFC/Swing</a> </span> <div class=NavBit> <a href=../TOC.html>« Previous</a> • <a href=../TOC.html>TOC</a> </div> <div id=PageTitle>Answers: Performing Custom Painting</div> <blockquote></blockquote><H3>Questions</H3><BLOCKQUOTE> <P><FONT COLOR="#ff0000">Question 1.</FONT> What method defined by <CODE>JComponent</CODE> paints the inside of a component?<BR> <FONT COLOR="#009900">Answer 1:</FONT> As described in <a href="../painting/concepts.html">How Swing Components Are Displayed</a>, the <a href="http://java.sun.com/j2se/1.4.2/docs/api/javax/swing/JComponent.html#paintComponent(java.awt.Graphics)"><code>paintComponent</code></a> method paints a component's innards (with the exception of any children it contains). <BR> </P> <P><FONT COLOR="#ff0000">Question 2.</FONT> Which of the following code snippets paint a rectangle (filled or not) that is 100x100 pixels?</P> <BLOCKQUOTE> <P>a. <CODE>g.fillRect(x, y, 100, 100)</CODE><BR> b. <CODE>g.fillRect(x, y, 99, 99)</CODE><BR> c. <CODE>g.drawRect(x, y, 100, 100)</CODE><BR> d. b and c<BR> e. a and c</P> </BLOCKQUOTE> <P><FONT COLOR="#009900">Answer 2: </FONT>a. As noted in <a href="../painting/concepts2.html">Introduction to Painting Concepts</a>, <code>drawRect</code> methods paint lines just below the specified rectangle. So to get a 100x100 rectangle, you need to specify a width and height of 99, 99 to <code>drawRect</code>. For <code>fill<em>Xxx</em></code> methods, on the other hand, you specify exactly the desired width and height, so <code>g.fillRect(x, y, 100, 100)</code> results in a 100x100 rectangle.</P> <BR> <P><FONT COLOR="#ff0000">Question 3.</FONT> What code would you use to make a component perform the next painting operation using the background color at 50% transparency?<BR> <FONT COLOR="#009900">Answer 3:</FONT> You can find the answer by looking at the faded rocketship code in <a href="../painting/practice.html">Implementing a Custom Component</a> and then modifying the specified amount of fading. Here's the result:</P> <blockquote> <pre>g2d.setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_OVER, 0.5f)); </pre> </blockquote></BLOCKQUOTE><H3>Exercises</H3><BLOCKQUOTE> <P><FONT COLOR="#ff0000">Exercise 1.</FONT> Using a standard border and custom component painting, implement a component that has a preferred size of 250x100, is opaque by default, has a 5-pixel black border, and paints an “X” (using 5-pixel-thick lines) in the foreground color, as shown in the following figure. <BLOCKQUOTE> <IMG SRC="../../figures/uiswing/QandE/ComponentDisplayer-1.png" WIDTH="258" HEIGHT="134" ALIGN="BOTTOM" NATURALSIZEFLAG="3" ALT="ComponentDisplayer-1.png"> </BLOCKQUOTE> <p><FONT COLOR="#009900">Answer 1:</FONT> See <code><a href="examples/XMarksTheSpot.java">XMarksTheSpot.java</a></code>, which you can run using <code><a href="examples/ComponentDisplayer.java">ComponentDisplayer.java</a></code>. </p> <p>Here's the code that sets the border of the <code>XMarksTheSpot</code> component: </P> <blockquote> <pre>setBorder(BorderFactory.createMatteBorder(5,5,5,5, Color.BLACK));</pre> </blockquote> <p> Here's the X-drawing code from the <code>paintComponent</code> method of <code>XMarksTheSpot</code>:</p> <BLOCKQUOTE> <pre>Graphics2D g2 = (Graphics2D)g;Insets insets = getInsets();g2.setStroke(new BasicStroke(5.0f));g2.draw(new Line2D.Double(insets.left, insets.top, getWidth() - insets.right, getHeight() - insets.bottom));g2.draw(new Line2D.Double(insets.left, getHeight() - insets.bottom, getWidth() - insets.right, insets.top));</pre> </BLOCKQUOTE> <br> <P><FONT COLOR="#ff0000">Exercise 2.</FONT> Implement an icon that’s 10x10 pixels and paints a solid rectangle that fills the 10x10 area. If the icon’s component is enabled, the rectangle should be red; if disabled, gray. Make a copy of <CODE>ButtonDemo.java</CODE> that uses your custom <CODE>Icon</CODE> for the middle button, instead of displaying <CODE>middle.gif</CODE>. The following pictures show what the icon should look like. <BLOCKQUOTE> <TABLE WIDTH="450" BORDER="0" CELLSPACING="2" CELLPADDING="0"> <TR> <TD WIDTH="50%"> <IMG SRC="../../figures/uiswing/QandE/SquareIcon-1.png" WIDTH="111" HEIGHT="44" ALIGN="BOTTOM" NATURALSIZEFLAG="3" ALT="SquareIcon-1.png"> </TD> <TD WIDTH="50%"> <IMG SRC="../../figures/uiswing/QandE/SquareIcon-2.png" WIDTH="111" HEIGHT="44" ALIGN="BOTTOM" NATURALSIZEFLAG="3" ALT="SquareIcon-2.png"> </TD> </TR> </TABLE> </BLOCKQUOTE> <p><FONT COLOR="#009900">Answer 2: </FONT>See <code><a href="examples/SquareIcon.java">SquareIcon.java</a></code>, which you can run using this <a href="examples/ButtonDemo.java">modified <code>ButtonDemo.java</code></a>. </p> <p>Here's the code that sets the icon:</p> <blockquote> <pre>Icon middleButtonIcon = new SquareIcon();...b2 = new JButton("Middle button", middleButtonIcon);</pre> </blockquote> <p>Here is <code>SquareIcon</code>'s implementation of the three methods required by the <code><a href="http://java.sun.com/j2se/1.4.2/docs/api/javax/swing/Icon.html">Icon</a></code> interface: </p><blockquote><pre>public void paintIcon(Component c, Graphics g, int x, int y) { if (c.isEnabled()) { g.setColor(Color.RED); } else { g.setColor(Color.GRAY); } g.fillRect(x, y, SIZE, SIZE);}public int getIconWidth() { return SIZE;}public int getIconHeight() { return SIZE;}</pre></blockquote> <BR> <P><FONT COLOR="#ff0000">Exercise 3.</FONT> Implement a border that paints a red 15-pixel-tall stripe all the way across the top of its component. Test this border by substituting it for the border on the component you created in exercise 1. The result should look like the following figure. <BLOCKQUOTE> <IMG SRC="../../figures/uiswing/QandE/ComponentDisplayer-2.png" WIDTH="258" HEIGHT="134" ALIGN="BOTTOM" NATURALSIZEFLAG="3" ALT="ComponentDisplayer-2.png"> </BLOCKQUOTE> <FONT COLOR="#009900">Answer 3: </FONT>See <code><a href="examples/StripeBorder.java">StripeBorder.java</a></code>, which you can run using <code><a href="examples/ComponentDisplayer.java">ComponentDisplayer.java</a></code> and <code><a href="examples/XMarksTheSpot.java">XMarksTheSpot.java</a></code> (be sure to uncomment the line that sets the border to <code>StripeBorder</code>). Here is <code>StripeBorder</code>'s implementation of the three methods required by the <code><a href="http://java.sun.com/j2se/1.4.2/docs/api/javax/swing/border/Border.html">Border</a></code> interface: <blockquote><pre>public void paintBorder(Component c, Graphics g, int x, int y, int width, int height) { g.setColor(Color.RED); g.fillRect(x, y, c.getWidth(), HEIGHT);}public Insets getBorderInsets(Component c) { return new Insets(HEIGHT, 0, 0, 0);}public boolean isBorderOpaque() { return true;}</pre></blockquote> <BR></BLOCKQUOTE> </blockquote> </div> <div id=Footer> <span class=NavBit> <a href=../TOC.html>« Previous</a> • <a href=../TOC.html>TOC</a> </span><div id=TagNotes> Problems with the examples? Try <a target="_blank" href=../../information/run-examples.html>Compiling and Running the Examples: FAQs</a>. <br> Complaints? Compliments? Suggestions? <a target="_blank" href="http://developer.sun.com/contact/tutorial_feedback.jsp">Give us your feedback</a>.<br><br> <a target="_blank" href="../../information/copyright.html">Copyright</a> 1995-2006 Sun Microsystems, Inc. All rights reserved. <span id=Download></span></div> </div> <div class=PrintHeaders> <b>Previous page:</b> Questions and Exercises: Performing Custom Painting </div> </body></html> ⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -