JFrame and JPanel CSCI 201L Jeffrey Miller, Ph.D. HTTP :// WWW - SCF. USC. EDU /~ CSCI 201 USC CSCI 201L

Outline USC CSCI 201L2/16 ▪J▪JFrame Class ▪A▪Adding Components ▪P▪Panels ▪P▪Program

JFrame Overview ▪javax.swing.JFrame inherits from java.awt.Frame ▪The JFrame is typically the outermost container used in GUI applications ›JApplet could also be the outermost container depending on your application ▪JFrame contains a JRootPane, which is where all of the components are added ›The JRootPane is shared among all container objects to support good OO design ›When components are added to a JFrame, they are actually added to the content pane (JRootPane) ▪To display a window in Java, create a JFrame, set the size, set the location, and set it visible USC CSCI 201L3/16 JFrame Class

My First GUI 1import javax.swing.JFrame; 2public class MyFirstGUI extends JFrame { 3 public MyFirstGUI() { 4 super("First Frame"); 5 setSize(500, 300); 6 setLocation(100, 100); 7 setVisible(true); 8 } 9 public static void main(String[] args) { 10 MyFirstGUI mfgui = new MyFirstGUI(); 11 } 12} USC CSCI 201L4/16 JFrame Class

Closing a GUI ▪The default operation of the X on the GUI is to set the visibility of the frame to false ›Note that this does not terminate the program ▪Since there may be some clean up that needs to occur before a GUI can be closed, we can add custom code to the close operation ›We will learn more about this when we talk about event-based programming ▪Java gives us the ability to just make the program terminate when the X is clicked on a GUI ›On the frame, call the setDefaultCloseOperation method with JFrame.EXIT_ON_CLOSE as a parameter 10.5 mfgui.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); USC CSCI 201L5/16 JFrame Class

Outline USC CSCI 201L6/16 ▪J▪JFrame Class ▪A▪Adding Components ▪P▪Panels ▪P▪Program

Adding Components to a JFrame ▪To add a component to a JFrame, create the component, set its properties, and pass the instance into the add method of the JFrame ▪The component will be added to the content pane of the frame ▪If you only add one component, it will take up the entire frame USC CSCI 201L7/16 Adding Components

Adding Component Example 1 import javax.swing.JButton; 2 import javax.swing.JFrame; 3 4 public class Test extends JFrame { 5 6 public Test() { 7 super("My Frame"); 8 setSize(300, 400); 9 setLocation(200, 200); 10 setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JButton helloButton = new JButton("Hello"); 13 add(helloButton); setVisible(true); 16 } public static void main(String [] args) { 19 Test t = new Test(); 20 } 21 } USC CSCI 201L8/16 Adding Components

Adding Component Example 1 import javax.swing.JButton; 2 import javax.swing.JFrame; 3 4 public class Test extends JFrame { 5 6 public Test() { 7 super("My Frame"); 8 setSize(300, 400); 9 setLocation(200, 200); 10 setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JButton helloButton = new JButton("Hello"); 13 add(helloButton); 14 Jbutton worldButton = new JButton(“World”); 15 add(worldButton); setVisible(true); 16 } public static void main(String [] args) { 19 Test t = new Test(); 20 } 21 } USC CSCI 201L9/16 Adding Components

BorderLayout Description ▪If we want to add components to different locations on the frame, we need to specify where to add them ▪Layout managers allow us to do that ›This is the topic of our next lecture ▪The default layout manager for a JFrame is BorderLayout ›When you add a component, you can specify you want to add it to the BorderLayout.NORTH, BorderLayout.SOUTH, BorderLayout.EAST, BorderLayout.WEST, or BorderLayout.CENTER ›Components in the north and south will have their height acknowledged but the width will be expanded to the width of the frame ›Components in the east and west will have their width acknowledged but the height will be expanded to the height of the frame ›Components in the center will have their heights and widths expanded to take up whatever space is remaining in the frame after the other four regions are rendered USC CSCI 201L10/16 Adding Components

BorderLayout Example 1 import java.awt.BorderLayout; 2 import javax.swing.JButton; 3 import javax.swing.JFrame; 4 5 public class Test extends JFrame { 6 public Test() { 7 super("My Frame"); 8 setSize(300, 400); 9 setLocation(200, 200); 10 setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JButton northButton = new JButton("North"); 13 add(northButton, BorderLayout.NORTH); 14 JButton southButton = new JButton("South"); 15 add(southButton, BorderLayout.SOUTH); 16 JButton eastButton = new JButton("East"); 17 add(eastButton, BorderLayout.EAST); 18 JButton westButton = new JButton("West"); 19 add(westButton, BorderLayout.WEST); 20 JButton centerButton = new JButton("Center"); 21 add(centerButton, BorderLayout.CENTER); setVisible(true); 24 } public static void main(String [] args) { 27 Test t = new Test(); 28 } 29 } USC CSCI 201L11/16 Adding Components

Outline USC CSCI 201L12/16 ▪J▪Java GUI Organization ▪J▪JFrame Class ▪A▪Adding Components ▪P▪Panels ▪P▪Program

Panel Overview ▪With BorderLayout, we can only add one component to each of the five locations ▪If we want to have more than one component in one of the locations, we need to create a panel ›We use the JPanel class for this ▪A panel is a container (and therefore also a component) ▪A panel has its own layout manager, so you can add components to the panel similar to adding them to the frame ›The default layout manager of a panel is a FlowLayout, which adds components from left to right, top to bottom and acknowledges the component’s requested height and width ›A panel can also be added to a panel ▪The panel can then be added to one of the locations in the frame USC CSCI 201L13/16 Panels

JPanel Example 1 import java.awt.BorderLayout; 2 import javax.swing.JButton; 3 import javax.swing.JFrame; 4 import javax.swing.JPanel; 5 6 public class Test extends JFrame { 7 public Test() { 8 super("My Frame"); 9 setSize(300, 400); 10 setLocation(200, 200); 11 setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); JPanel jp = new JPanel(); JButton helloButton = new JButton("Hello"); 16 jp.add(helloButton); 17 JButton worldButton = new JButton("World"); 18 jp.add(worldButton); add(jp, BorderLayout.NORTH); JButton eastButton = new JButton("East"); 23 add(eastButton, BorderLayout.EAST); 24 JButton westButton = new JButton("West"); 25 add(westButton, BorderLayout.WEST); 26 JButton centerButton = new JButton("Center"); 27 add(centerButton, BorderLayout.CENTER); setVisible(true); 30 } USC CSCI 201L14/16 Panels 31 public static void main(String [] args) { 32 Test t = new Test(); 33 } 34 }

Outline USC CSCI 201L15/16 ▪J▪Java GUI Organization ▪J▪JFrame Class ▪A▪Adding Components ▪P▪Panels ▪P▪Program

Program ▪Write a program that produces the GUI below. USC CSCI 201L16/16 Program