Java Swing. Recitation 11/(20,21)/2008. CS 180 Department of Computer Science, Purdue University

Similar documents
Window Interfaces Using Swing. Chapter 12

Window Interfaces Using Swing Objects

Window Interfaces Using Swing Objects

Parts of a Contract. Contract Example. Interface as a Contract. Wednesday, January 30, 13. Postcondition. Preconditions.

CSEN401 Computer Programming Lab. Topics: Graphical User Interface Window Interfaces using Swing

Command-Line Applications. GUI Libraries GUI-related classes are defined primarily in the java.awt and the javax.swing packages.

Introduction. Introduction

Starting Out with Java: From Control Structures Through Objects Sixth Edition

Agenda. Container and Component

Frames, GUI and events. Introduction to Swing Structure of Frame based applications Graphical User Interface (GUI) Events and event handling

Handout 14 Graphical User Interface (GUI) with Swing, Event Handling

Graphics programming. COM6516 Object Oriented Programming and Design Adam Funk (originally Kirill Bogdanov & Mark Stevenson)

Java. GUI building with the AWT

CS 251 Intermediate Programming GUIs: Event Listeners

17 GUI API: Container 18 Hello world with a GUI 19 GUI API: JLabel 20 GUI API: Container: add() 21 Hello world with a GUI 22 GUI API: JFrame: setdefau

Swing I CHAPTER EVENT-DRIVEN PROGRAMMING 921 Events and Listeners 921

Swing I Event-Driven Programming Buttons, Events, and Other Swing Basics Containers and Layout Managers 946

Graphical User Interfaces. Comp 152

Systems Programming Graphical User Interfaces

PIC 20A GUI with swing

Calculator Class. /** * Create a new calculator and show it. */ public Calculator() { engine = new CalcEngine(); gui = new UserInterface(engine); }

Part I: Learn Common Graphics Components

Graphical User Interfaces. Swing. Jose Jesus García Rueda

Course Status Networking GUI Wrap-up. CS Java. Introduction to Java. Andy Mroczkowski

Topic 9: Swing. Swing is a BIG library Goal: cover basics give you concepts & tools for learning more

Topic 9: Swing. Why are we studying Swing? GUIs Up to now: line-by-line programs: computer displays text user types text. Outline. 1. Useful & fun!

Example: Building a Java GUI

Example: Building a Java GUI

AP CS Unit 11: Graphics and Events

PROGRAMMING DESIGN USING JAVA (ITT 303) Unit 7

CS 251 Intermediate Programming GUIs: Components and Layout

COMP16121 Sample Code Lecture 1

CSC 161 SPRING 17 LAB 2-1 BORDERLAYOUT, GRIDLAYOUT, AND EVENT HANDLING

Introduction to the JAVA UI classes Advanced HCI IAT351

CSIS 10A Assignment 7 SOLUTIONS

GUI and its COmponent Textfield, Button & Label. By Iqtidar Ali

Building a GUI in Java with Swing. CITS1001 extension notes Rachel Cardell-Oliver

Swing from A to Z Some Simple Components. Preface

11/6/15. Objec&ves. RouleQe. Assign 8: Understanding Code. Assign 8: Bug. Assignment 8 Ques&ons? PROGRAMMING PARADIGMS

Introduction to Graphical User Interfaces (GUIs) Lecture 10 CS2110 Fall 2008

MIT AITI Swing Event Model Lecture 17

Chapter 7: A First Look at GUI Applications

Swing UI. Powered by Pentalog. by Vlad Costel Ungureanu for Learn Stuff

Control Flow: Overview CSE3461. An Example of Sequential Control. Control Flow: Revisited. Control Flow Paradigms: Reacting to the User

Graphic User Interfaces. - GUI concepts - Swing - AWT

CSE 143. Event-driven Programming and Graphical User Interfaces (GUIs) with Swing/AWT

Outline. Topic 9: Swing. GUIs Up to now: line-by-line programs: computer displays text user types text AWT. A. Basics

Java Swing. based on slides by: Walter Milner. Java Swing Walter Milner 2005: Slide 1

Dr. Hikmat A. M. AbdelJaber

Datenbank-Praktikum. Universität zu Lübeck Sommersemester 2006 Lecture: Swing. Ho Ngoc Duc 1

CHAPTER 2. Java Overview

encompass a group of features for building Graphical User Interfaces (GUI).

Graphical User Interfaces (GUIs)

Interfaces & Polymorphism part 2: Collections, Comparators, and More fun with Java graphics

Building Graphical User Interfaces. GUI Principles

Java & Graphical User Interface II. Wang Yang wyang AT njnet.edu.cn

Graphical User Interface (Part-1) Supplementary Material for CPSC 233

Lab 4. D0010E Object-Oriented Programming and Design. Today s lecture. GUI programming in

CPS122 Lecture: Graphical User Interfaces and Event-Driven Programming

KF5008 Program Design & Development. Lecture 1 Usability GUI Design and Implementation

Chapter 13 Lab Advanced GUI Applications Lab Objectives. Introduction. Task #1 Creating a Menu with Submenus

Java Programming Lecture 6

Graphical User Interfaces in Java

What Is an Event? Some event handler. ActionEvent. actionperformed(actionevent e) { }

Graphics User Defined Forms, Part I

Class 16: The Swing Event Model

Jonathan Aldrich Charlie Garrod

Swing/GUI Cheat Sheet

Hanley s Survival Guide for Visual Applications with NetBeans 2.0 Last Updated: 5/20/2015 TABLE OF CONTENTS

CPS122 Lecture: Graphical User Interfaces and Event-Driven Programming

Proctors are unable to respond to queries about the interpretation of exam questions. Do your best to answer exam questions as written.

Graphical User Interface (GUI) components in Java Applets. With Abstract Window Toolkit (AWT) we can build an applet that has the basic GUI

CS180 Recitation. More about Objects and Methods

GUI in Java TalentHome Solutions

GUI Forms and Events, Part II

JAVA NOTES GRAPHICAL USER INTERFACES

Goals. Lecture 7 More GUI programming. The application. The application D&D 12. CompSci 230: Semester JFrame subclass: ListOWords

Event Driven Programming

Java Applets / Flash

Building Graphical User Interfaces. Overview

To gain experience using GUI components and listeners.

Design patterns for graphical user interface applications

Graphical User Interface (GUI)

CSE 331. Event-driven Programming and Graphical User Interfaces (GUIs) with Swing/AWT

Together, the appearance and how user interacts with the program are known as the program look and feel.

Object-Oriented Software Engineering. PersonGui (Mark 1) Case Study

Part 3: Graphical User Interface (GUI) & Java Applets

Overview. Building Graphical User Interfaces. GUI Principles. AWT and Swing. Constructing GUIs Interface components GUI layout Event handling

Programming Language Concepts: Lecture 8

H212 Introduction to Software Systems Honors

Laying Out Components. What is Widget Layout?

This exam is closed textbook(s) and closed notes. Use of any electronic device (e.g., for computing and/or communicating) is NOT permitted.

2IS45 Programming

COMPSCI 230. Software Design and Construction. Swing

More about GUIs GEEN163

All the Swing components start with J. The hierarchy diagram is shown below. JComponent is the base class.

Chapter 13 Lab Advanced GUI Applications

CS 180 Fall 2006 Exam II

Lecture 5: Java Graphics

What is Widget Layout? Laying Out Components. Resizing a Window. Hierarchical Widget Layout. Interior Design for GUIs

Transcription:

Java Swing Recitation 11/(20,21)/2008 CS 180 Department of Computer Science, Purdue University

Announcements Project 8 is out Milestone due on Dec 3rd, 10:00 pm Final due on Dec 10th, 10:00 pm No classes, recitations and labs next week. No study group meeting next Tuesday. Consulting hours will be held only on Monday 7-10 pm.

Event Driven Programming Most GUI programs involve events and event handlers. A GUI event is an object that represents some action such as clicking the mouse, dragging the mouse, pressing a keyboard key, clicking the close-window button on a window, etc. When an object generates an event, it is said to fire the event.

Event Driven Programming An event is an object that represents an action Event handling is similar to exception handling Difference Exceptions are created by user code or java interpreter. Events are created by external actions, such as user interactions through a GUI 4

Programming Example: A Simple Window This simple program produces a window and displays some text. JFrame : to create a window JLabel : to create a label getcontentpane().add() : add a component such as a label to the content pane of the window settitle() : set the title of the window setsize() : set the size of the window setvisible() : Method setvisible permits the programmer to specify when GUI objects should be displayed and when they should not

Example Programming Example: A Simple Window public class makewindow { A Frame } public static void main(string args[]) { JFrame mywindow=new JFrame(); //create the window mywindow.setsize(300, 200); //set the title of the window mywindow.settitle("this is a window"); //create the label JLabel mylabel=new JLabel("this is a label"); //add the label to the content pane of the window mywindow.getcontentpane().add(mylabel); //set color of the content pane mywindow.getcontentpane().setbackground(color.cyan); //make the window visible mywindow.setvisible(true); } This area is the content pane

Layout Managers A layout manager arranges objects within a container After a container has been created, you can set its layout manager using the setlayout method. For example: Container contentpane = frame.getcontentpane(); contentpane.setlayout(new FlowLayout()); FlowLayout : It simply lays out components in a single row, starting a new row if its container is not sufficiently wide. 7

Layout Managers BorderLayout : It places components in up to five areas: top, bottom, left, right, and center. Every content pane is initialized to use a BorderLayout. GridLayout : It simply arranges a bunch of components in a grid of rows and columns. Components are ordered in a rowmajor fashion. 8

Example - Border Layout A BorderLayout manager can place a component into any of the five regions. Regions which are unused give up their space to BorderLayout.CENTER. This layout limits the GUI to five objects, these are almost always five (or fewer) JPanels. Equivalent forms for center: content.add(label3, BorderLayout.CENTER); and content.add(label3, Center ); and (for center ONLY) content.add(label3); Even though BorderLayout is default, it s better to set the layout explicitly

Buttons A button is a GUI component that looks like a button and fires an event when it is clicked using a mouse. Like a label, a button is created and added to a container. Unlike a label, a button can fire an event and the event can cause a GUI to perform some action. Buttons are instances of the JButton class.

Adding Buttons A button is created using JButton Button_Name = new JButton( Button_Label ); A button is added to a container using Container_Name.add(Button_Name);

Action Listeners and Action Events For each button, the GUI needs to register (specify) the listener object(s). define the methods to be invoked when an event is fired. Buttons fire action events which are handled by action listeners. An action listener is an object of type ActionListener, and ActionListener is an interface Note: A user defined GUI class can itself be its own listener if it implements the ActionListener interface.

Action Listeners and Action Events, cont. To make a class into an ActionListener, add implements ActionListener to the heading of the class definition Define a method named actionperformed. register the ActionListener object with the component that will fire the event using the method addactionlistener(..) The actionperformedmethod of the ActionListener class will be called every time the object fires an event. This is an important step that must not be forgotten. (A component may register with more than one listener.)

Buttons and an Action Listener

The actionperformed Method An actionlistener class must have a method named actionperformed that has one parameter of type ActionEvent. syntax public void actionperformed(actionevent e) { Code_for_Actions_Performed }

Method setactioncommand Every object that fires an action event has an associated string known as the action command for that component. e.getactioncommand() returns the action command for the component that fired the event e. The default action command for a button is its name. Method setactioncommand(string) can be used to change the action command for the object.

. Example with buttons

Example with buttons

The JPanel Class A GUI can be organized hierarchically, with window-like containers inside other containers. Components can be placed in a JPanel which can be placed in another JPanel, which can be placed in a JFrame. E.g, to place two components in BorderLayout.SOUTH for example, simply place the two components in a panel and place the panel in the BorderLayout.SOUTH position. The panel has its own layout manager.

Example with JPanel Container contentpane = getcontentpane (); contentpane.setbackground (Color.BLUE); contentpane.setlayout (new BorderLayout ()); JPanel buttonpanel = new JPanel (); buttonpanel.setbackground (Color.WHITE); buttonpanel.setlayout (new FlowLayout ()); JButton stopbutton = new JButton ("Red"); stopbutton.setbackground (Color.RED); stopbutton.addactionlistener (this); buttonpanel.add (stopbutton); JButton gobutton = new JButton ("Green"); gobutton.setbackground (Color.GREEN); gobutton.addactionlistener (this); buttonpanel.add (gobutton); contentpane.add (buttonpanel, BorderLayout.SOUTH); Creating a panel with flow layout Adding a red button to the panel Adding a green button to the panel Adding panel to the frame

The JPanel Class, cont. Panel with two buttons since BorderLayout limits the GUI to five objects, there are usually JPanels (five or fewer) in the pane.

The Container Class An object of a class which descends from class Container is called a container class and can have components added to it. Examples JFrame is a descendent of class Container, permitting any JFrame object to hold labels, buttons, panels, and other components. JPanel is a descendent of class Container, permitting any JPanel object to hold labels, buttons, other panels, and other components.

Text I/O using JTextField Create a text field with some initial text JTextField textfield = new JTextField("Initial Text"); Create a text field with some initial text and a default number of columns. The number of columns controls the preferred width of the component textfield = new JTextField("Initial Text", cols); Use textfield.gettext() to return the written text

Text I/O using JTextArea Create a text area with some initial text JTextArea textarea = new JTextArea("Initial Text"); Create a text area with some initial text and a default number of rows and columns. This number of rows and columns controls the preferred width and height of the component; textarea = new JTextArea( InitialText", rows, cols);

Quiz GUI components can be added to an object of any class that descends from the class.