View
236
Download
1
Category
Preview:
Citation preview
© Daly and Wrigley
Objectives• Use Graphic Components:
▫ Strings▫ Lines▫ Rectangles▫ Ovals▫ Arcs
• Change the color and font of elements.
2© Daly and Wrigley
© Daly and Wrigley
Graphical User Interfaces• Swing Set
▫ Flexible cross-platform GUIs that allow windows to appear in a similar format on different operating systems.
▫ Start with a “J” (example: JFrame)▫ Import: import javax.swing.*;
• Abstract Windowing Toolkit▫ Older GUI components, change colors, or change fonts ▫ Import: import java.awt.*;
3
© Daly and Wrigley
JFrameBefore GUI components can be placed onto the screen, a window must first be created to hold these components.
JFrame frame = new JFrame("Title of window here ");frame.setSize(200, 100);frame.setLocationRelativeTo(null); frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setVisible(true);
4
© Daly and Wrigley
Container• Every JFrame has a container called a content pane. • Purpose - provide a visual area in which to place GUI
components.
Container content = frame.getContentPane();content.setBackground(Color.YELLOW);
5
© Daly and Wrigley
Null Layouts• Place components wherever you would like on the container by
using x and y coordinates.
• To add this JComponent to your content pane called content: content.add(this);
6
© Daly and Wrigley
Graphic Components• The AWT (Abstract Windowing Toolkit) includes methods for
drawing many different types of shapes, everything from lines to polygons; using colors; using fonts; and drawing images.
• Painting: allows us to draw graphics on the screen ▫ Paint takes an argument of a Graphics object▫ JComponent has a paint method associated with it ▫ g.drawLine tells the computer to do the method called drawLine on the
Graphics object called g. • public void paint ( Graphics g ) {
}
7
© Daly and Wrigley
Changing the Font• Typeface( font name): Helvetica, Courier, TimesRoman, etc.• Style: Font.PLAIN, Font.BOLD, Font.ITALIC,
Font.BOLD+Font.ITALIC• Size: Point size such as 24 point. Note: These are points -- not
pixels) The standard typewriter size font is 12 point.
g.setFont(new Font ("TimesRoman", Font.ITALIC, 72) );
You can also create a font object (instance):Font f = new Font("TimesRoman", Font.BOLD,
36);g.setFont(f) ;
9
© Daly and Wrigley
Adding Color• The 13 predefined colors are: white, black, lightGray, gray,
darkGray, red, green, blue, yellow, magenta, cyan, pink and orange. g.setColor(Color.GREEN);
• Define your own color:
g.setColor(new Color(100,50,25));
Color myTeal = new Color (0,128,128);g.setColor(myTeal);
10
© Daly and Wrigley
Drawing Rectangles1. g.drawRect(0, 0, 50, 25); 2. g.setColor(Color.GREEN); g.fillRect(100,0,50,40); 3. g.setColor(Color.BLACK); g.drawRoundRect(175,0,50,50,20,20); (20 pixel curve)4. g.setColor(Color.RED); g.fillRoundRect(0,75,50,50,35,35); (35 pixel curve)5. g.setColor(Color.BLACK); g.fillRect(100,100,50,50);
g.clearRect(120,120,10,10); 6. g.draw3DRect(175,100,50,30,true); (true means raised)7. g.draw3DRect(250,100,50,20,false); (false means indented)8. g.setColor(Color.DARKGRAY); g.fill3DRect(250,175,50,20,false); (false means indented)
12
© Daly and Wrigley
Drawing Ovalsg.setColor(Color.BLUE);g.drawOval(0,0,30,60); // draws an oval starting at point 0,0 width=30, height =60 // see the first oval below
g.fillOval(50,0,100,40); // draws oval starting pt is 50,0 width =100, height = 40 // see the second filled in oval below
13
© Daly and Wrigley
Drawing Arcs
g.drawArc(0, 40, 50, 50, 0, 75); // the first arc shown below // Picture an oval with upperleft corner of its rectangle at 0,40 and its 50 wide and 50 high // starting angle is 0 which is 3 o'clock // degrees is 75 which means to go counterclockwise 75 degrees.
g.fillArc(100, 75, 50, 50, 90, 180); // the filled in black arc below // Picture an oval with upperleft corner of its rectangle at 100,75 and its 50 wide and 50 high // starting angle is 90 which is 12 o'clock // degrees is 180 which means to go counterclockwise 180 degrees // the same arc could be drawn clockwise with g.fillArc(100, 75, 50, 50, 270, -180);
The syntax is: g.drawArc (x, y, width, height, startangle, degrees);
g.fillArc (x, y, width, height, startangle, degrees);
14
Recommended