1. Applets and Frames CS 21a: Introduction to Computing I First Semester, 2013-2014

2. Applets ► Usually graphical in content ► One way of writing Java programs (besides applications) ► Java programs that can be embedded in HTML documents (web pages) ► Note: Not all web browsers automatically support Java 2. You will have to install the Java Plug-in, which is done automatically if you installed Java on your machines.

3. JApplet ► This is the “swing” version of Applets ► JApplet is the newer version of the Applet class that is used with Java’s swing GUI components ► We will be using this in class

4. Java Applet Classes ► Abstract Window Toolkit (AWT) ► Contain classes that provide the Java graphical user interface (GUI) components ► Java Foundation Classes ► Was an extension to java ► Contains swing components written entirely in java

5. Writing Java Applets import javax.swing.*; import java.awt.*; /**This applet displays “Hello, world!” on a label.**/ public class MyApplet extends JApplet { private JLabel helloLabel; public void init() { Container c = getContentPane(); c.setLayout( new FlowLayout() ); this.helloLabel = new JLabel( "Hello, world!" ); c.add( helloLabel ); }

6. Running Java Applets ► Recall that an.html needs to be created to execute applets ► Executing through an IDE ► In BlueJ:, right-click on the class and select “Run Applet”, then Click on “OK” and wait for the applet to appear ► In JCreator, create the.html file and execute that file ► Executing through the Command Prompt ► appletviewer file.html ► Executing through a browser: ► Go to the folder where the.html and the.class resides ► Double-click on that and wait for the browser to load

7. Writing Web Pages with Applets ► You will have to include this in the body of the HTML file to tell it you are embedding an applet: ► To embed the class file of MyApplet.java:

8. Container and getContentPane() ► Container ► A generic AWT container ► a component that can contain other AWT components ► Most important methods: setLayout() and add() ► getContentPane() ► A method found in JApplet ► This method returns the contentPane object (a Container) for this applet. ► You’ll need these to be able to add components to your applet.

9. public void init() ► Every applet must implement one or more of the init(), start(), and paint() methods. This is what a browser usually looks for when it runs applets. ► You will have to include the init() method to give your applet its intended appearance and functionality ► Think of init() as a constructor for your applet ► This is where you add the components to a container ► The applet is in effect an aggregate class containing the labels, buttons, text fields, and other visual components

10. Importing Packages ► To be able to use JApplet and swing components you will have to import the javax.swing package and to be able to use some AWT components, you will have to import the java.awt package. ► At the top of your java class: import javax.swing.*; import java.awt.*;

11. The Java Swing Components ► Java’s framework for programming lightweight GUI Components ► Lightweight here means that it’s written in and it runs entirely in Java ► Components ► JButton, JTextField, JTextArea, JLabel, JPanel ► Others (self-study) ► You will have to add these components to an AWT container

12. Java Abstract Window Toolkit (AWT) ► Java’s framework for programming Graphical User Interfaces (GUIs) ► Containers ► Layout Managers ► FlowLayout, GridLayout, BorderLayout ► CardLayout, GridBagLayout (self-study)

13. Components ► JButton: clickable visual object ► JLabel: text ► JTextField ► contains editable text ► methods setText() and getText() ► JTextArea ► same as JTextField but can support multiple lines ► JPanel ► may contain other visual components ► methods setLayout() and add()

14. Layout Managers ► FlowLayout ► objects are placed row by row, left to right ► GridLayout ► divides container into an m by n grid ► BorderLayout ► divides container into 5 parts ► Center, North, South, East, West ► e.g., add( component, “North” ); ► See examples

15. Panel ► A Panel is a component that can contain other objects ► We can do more complex layouts by using Panels within the Applet ► or even Panels within Panels

16. Designing a GUI for an Applet ► import java.awt.*; ► import javax.swing.*; ► extends JApplet ► inherits built-in features of JApplet ► Declare variables for the different visual components to be placed on the applet ► In the init() method, ► create visual components – use new ► establish layout manager – use setLayout() ► default for JApplets: BorderLayout ► add visual components – use MyContainer.add() ► nested layouts possible – use Panels

17. Applet Example import javax.swing.*; import java.awt.*; public class HelloWorldApplet extends JApplet { private JButton button; private JTextField textField; private JLabel label; public void init() { Container c = getContentPane(); c.setLayout( new FlowLayout() ); label = new JLabel( "Hello, World!" ); c.add( label ); textField = new JTextField( "Enter your name here", 15 ); c.add( textField ); button = new JButton( "Click Me" ); c.add( button ); }... }

18. HTML File for the Applet

19. JFrame ► Use JFrame instead of JApplet if you want a GUI application (instead of a web-based applet) ► Extend JFrame instead of JApplet ► Instead of the init() method, place initialization code in the class’ constructor ► Need a main method (perhaps in a separate class) that instantiates and displays the frame

20. Frame Example import javax.swing.*; import java.awt.*; public class HelloWorldFrame extends JFrame { private JButton button; private JTextField textField; private JLabel label; public HelloWorldFrame() { Container c = this.getContentPane(); c.setLayout( new FlowLayout() ); label = new JLabel( "Hello, World!" ); c.add( label ); textField = new JTextField( "Enter your name here", 15 ); c.add( textField ); button = new JButton( "Click Me" ); c.add( button ); }... }

21. Driver Class for the Frame import javax.swing.*; public class FrameRunner { public static void main( String args[] ) { JFrame f = new HelloWorldFrame(); f.setSize( 200, 300 ); f.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE ); f.setVisible( true ); }

22. About Frames ► When using frames, you could call setLayout() and add() directly on the frame object ► No need to declare a Container object or call getContentPane() ► Other methods applicable on a frame object (these can be called in the frame’s constructor, or from the driver) ► setSize() : sets the dimensions of the frame ► setTitle() : sets the title bar of the frame