Introduction to Java Swing Graphical User Interface Two

Introduction to Java Swing Graphical User Interface

Two Types of Applications Console Applications: • Input from keyboard using java. util. Scanner • Output is usually displayed to a console window using System. out. print(). • Not practical for real-world GUI Applications • Graphical User Interface • Very practical for real-world

What is Java Swing? • Java Swing is a framework for developing Java GUI Apps. • Graphical functionality is provided by the library. There is no need to write your own. Note: Java 7: Uses Swing (current applications still use it. ) Java 8+: Java. FX

Topics • Swing Components JFrame JComponent JPanel User Interface (UI) components: buttons, text fields, labels, etc. • Action Events • Building a Fractal drawing application.

Swing Components • Swing is a toolkit that Sun Microsystems created to enable large-scale java applications. • Swing provides a wide array of visual and interactive components. • All Swing component names begin with "J"

JFrame • The graphical window for an application. • JFrame provides a top-level window with a title, border. • JFrame is a container component. • User Interface components can be easily added to a JFrame.

JFrame Example The application window shown below is a JFrame. Buttons, text input fields, and a graphic component have been added to the JFrame.

JComponent • This is a container class. • j. Component also provides functionality for painting and drawing.

Jcomponent Example: . A JComponent element was added to the Jframe. Rectangles were drawn on the JComponent.

Common UI Components • JButton : This is a typical button. Buttons can react to an action event. • JText. Field: This is a standard input text box for the input of a single line of text. A JText. Field can react to input events. • JLabel: Used to label a nearby action component. Labels do not react to action events or input events.

Action. Event Handling • UIComponents, such as a Jbutton, fire off Action. Events to indicate some kind of action has occurred. For example, a JButton fires off an Action. Event whenever the user presses it. • To respond to an Action. Event, an action listener must be attached to the UI component. • An event listener is triggered when an action event occurs. • action event can be registered to many UI components.

Handling Events • Clicking a button on the interface is an example of an event. When an event occurs, there are three objects that must be involved: 1. The object causing the event, the event source, such as a button. 2. An object representing the event, the Action. Event. 3. The object that listens for and then handles a triggered event, the Action. Listener.

The Action. Listener object provides a method called action. Performed that accepts an Action. Event argument.

a. b. c. Example: A button is created. An Action. Listener is instantiated and registered to the button. When a button click event occurs, the action. Performed () method will respond. private void create. Button() { button = new JButton("Create Rectangles"); Action. Listener listener = new Add. My. Listener(); button. add. Action. Listener(listener); } class Add. My. Listener implements Action. Listener { public void action. Performed(Action. Event event) { //DRAW ON ADRAWING COMPONENT Draw. Component. create. Rectangle(); } }

Build the Fractal Generator App

App Structure Design uses a MVC Architecture

Build the App from the Bottom Up! • • Fractal. java C_curve. Component C-curve. Frame My. App

import java. awt. Graphics; Fractal. java public class Fractal { public void draw. CCurve(Graphics g, int x 1, int y 1, int x 2, int y 2, int level) { //PRIMITIVE STATE: DRAWS A STRAIGHT LINE FROM X 1, Y 1 TO X 2, Y 2 if (level == 1){ g. draw. Line(x 1, y 1, x 2, y 2); } //RECURSIVE ELEMENT: TWO LINES WILL BE PRODUCED FOR EVERY SINGLE LINE else { int xn = (x 1 + x 2) / 2 + (y 1 - y 2) / 2; int yn = (x 2 - x 1) / 2 + (y 1 + y 2) / 2; draw. CCurve(g, x 1, y 1, xn, yn, level - 1); draw. CCurve(g, xn, yn, x 2, y 2, level - 1); } } }

public class C_curve. Component extends JComponent { private Fractal fractal; private int level; private int x 1, y 1, x 2, y 2; public C_curve. Component() { C-curve. Component. java level = 2; fractal = new Fractal(); } public void set. XY(int _x 1, int _y 1, int _x 2, int _y 2) { x 1 = _x 1; y 1 = _y 1; x 2 = _x 2; y 2 = _y 2; } public void set. Level(int _level){ level = _level; } public void create. Ccurve() { repaint(); } public void paint. Component(Graphics g) { fractal. draw. CCurve(g, x 1, y 1, x 2, y 2, level); } }

public class C_curve. Frame extends JFrame { private JPanel panel; C-curve. Frame. java private JLabel level. Label; private JText. Field level. Field; private JButton button; private C_curve. Component c. Curve. Draw. Component; public C_curve. Frame() { // TASK : BUILD THE PANEL ELEMENTS this. set. Size(700, 700); //WINDOW SIZE panel = new JPanel(); level. Label = new JLabel("Level: "); level. Field = new JText. Field(10); //FIELD WIDTH OF 10 level. Field. set. Text("" + 2); //INITIALIZE THE TEXT FIELD TO 2 button = new JButton("Create C-curve"); panel. add(level. Label); panel. add(level. Field); panel. add(button); c. Curve. Draw. Component = new C_curve. Component(); c. Curve. Draw. Component. set. Preferred. Size(new Dimension(700, 700)); c. Curve. Draw. Component. set. Level(2); //2 is the default level panel. add(c. Curve. Draw. Component);

C-curve. Frame. java // TASK : ADD THE COMPLETED PANEL TO THE FRAME WINDOW this. add(panel); } // TASK : REGISTER AN ACTION LISTENER FOR THE BUTTON Action. Listener listener = new Add. My. Listener(); button. add. Action. Listener(listener);

class Add. My. Listener implements Action. Listener { public void action. Performed(Action. Event event) { //TASK 1: GET THE FRACTAL LEVEL INPUT BY THE USER int level = Integer. parse. Int(level. Field. get. Text()); c. Curve. Draw. Component. set. Level(level); //TASK 2: COMPUTE THE STARTING AND ENDING XY COORDINATES int frame_width = 700; int frame_height = 700; int x 1 = frame_width / 4; C-curve. Frame. java int y 1 = frame_height / 3; int x 2 = frame_width - x 1; int y 2 = y 1; //TASK 3: SET THE XY START AND END FOR THE DRAWING COMPONENT c. Curve. Draw. Component. set. XY(x 1, y 1, x 2, y 2); } } } //TASK 4: CREATE THE CURVE ON THE DRAWING COMPONENT c. Curve. Draw. Component. create. Ccurve();

My. App. java import javax. swing. JFrame; public class My. App { public static void main(String[] args) { JFrame frame = new C_curve. Frame(); frame. set. Default. Close. Operation(JFrame. EXIT_ON_CLOSE); frame. set. Visible(true); } }