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

Size: px
Start display at page:

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

Transcription

1 Topic 9: Swing Outline Swing = Java's GUI library Swing is a BIG library Goal: cover basics give you concepts & tools for learning more Assignment 7: Expand moving shapes from Assignment 4 into game. "Programming Contest" last day of classes: A. Basics today a little background & history putting a frame (window) on the screen B. Layouts arranging multiple components in a frame three different kinds of "layout managers" C. Components & Actions more kinds of components adding actions to components D. Graphics drawing pictures dynamically E. Mouse Events & Timers reacting to mouse clicks using timers for animation 1 2 GUIs Up to now: line-by-line programs: computer displays text user types text AWT Early GUIs: write your own, huge amount of work Common style emerged: buttons, text boxes, menus Libraries to help you write GUI programs GUI = Graphical User Interface Advantages & disadvantages? X-Windows for Unix/Linux Microsoft Foundation Classes (MFC) for Windows etc. not portable AWT = Abstract Window Toolkit part of Java API classes for writing portable GUI programs easier to use than MFC can be used by itself (no Swing) 3 4

2 Swing Extension to AWT: part of Java API in versions 1.2 & later some new features (file & color choosers, more graphics features) replaced some items with improved versions (Button -> JButton, Frame -> JFrame all start with "J") some improvements to existing features (double buffering) Packages For a basic Java GUI program, import these packages: import javax.swing.*; import java.awt.*; import java.awt.event.*; Still use parts of AWT that Swing hasn't replaced: same old layout managers, basic graphics commands 5 6 Tasks in GUI Programming Getting a Window Running 1. Getting your screen to look the way you want it to. (laying out components buttons, text boxes, etc.) 2. Getting the program to do what you want it to. (functionality) These tasks are somewhat independent. Common order: 1. get screen looking right, no functionality 2. add functionality First practical task: get a window up on your screen and be able to exit gracefully Basic Swing class: JFrame A frame is a window with: a border a title menu bar (optional place to put menu items) minimize, maximize, close buttons inner area for contents ("content pane") Another possibility: 1. put components on screen, quick & sloppy 2. add functionality, debug 3. improve appearance 7 8

3 Fonts A font consists of: name ("Serif", "Sanserif", "Monospaced") type (constants: PLAIN, ITALIC, BOLD) size (in points) Colours class Color: constants for common colours (RED, BLUE, BLACK, etc.) constructor to create a custom colour: Color(int r, int g, int b) methods in JComponent: setbackground(color c) setforeground(color c) Example: Font bigfont = new Font("Serif", Font.PLAIN, 24); quitbutton.setfont(bigfont); Notes: some components don't use both colours labels are transparent (no background colour) panels have no foreground colour 9 10 JOptionPane (1) JOptionPane (2) JOptionPane class for common pop-up windows many capabilities; we'll look at 3 basic static methods int result = JOptionPane.showConfirmDialog(myFrame, "are you awake?"); JOptionPane.showMessageDialog(myFrame, "hello, world!"); result gets one of three values: JOptionPane.YES_OPTION JOptionPane.NO_OPTION JOptionPane.CANCEL_OPTION 11 12

4 JOptionPane (3) String name = JOptionPane.showInputDialog(myFrame, "what is your name?"); Outline A. Basics a little background & history putting a frame (window) on the screen B. Layouts arranging multiple components in a frame three different kinds of "layout managers" C. Components & Actions more kinds of components adding actions to components name gets user input -- or null if user clicks "Cancel" D. Graphics drawing pictures dynamically E. Mouse Events & Timers reacting to mouse clicks using timers for animation Layout Managers Different Kinds of Layout Managers layout manager decides: position of each component in frame size of each component what changes when window is resized We will concentrate on three: BorderLayout FlowLayout GridLayout programmer's job: give layout manager some general instructions Each has different purpose, different layout algorithms. Real power comes from combining them -- different parts of frame

5 Sizes of Components Every component has a "preferred size" For buttons and labels, based on the text and the font Sometimes layout managers "stretch" components BorderLayout default layout manager for frames frame has 5 positions: NORTH, SOUTH, EAST, WEST, CENTER demo... Button at preferred size: Same button, stretched: Rules: max of 1 component in each position north & south stretched horizontally to fit frame east & west stretched vertically center stretched both ways can specify gaps FlowLayout GridLayout adds components left to right demo... lays out components in a rectangular grid demo... Rules: components always at preferred sizes breaks into multiple rows if necessary can specify alignment & gaps Rules: components are stretched to fill frame all components have same dimensions specify number of rows OR number of columns can specify gaps FAQ: can you create a vertical row with a FlowLayout? no! 19 20

6 Changing a Preferred Size Combining Layouts You may state a preference about the size of a component: btn.setpreferredsize(new Dimension(120,45)); You may also query the preferred size: Now we know about 3 kinds of layouts Each fairly limited by itself Can sub-divide frame into sections, lay each out individually each section called a "panel" Dimension size3 = btn.getpreferredsize(); btn.setpreferredsize( new Dimension(size3.width*2,size3.height)); This does *not* guarantee that the button will be the size you asked for! The layout manager is still in charge. Swing class: JPanel a component which is also a container can add other components to a JPanel to create: new JPanel(new GridLayout(2,0)); new JPanel(); // default is FlowLayout Panel Example 1 Panel Example 2 Suppose we want to put 6 buttons in a frame like this: Suppose we want to put 6 buttons in a frame like this: 23 24

7 Panel Example 3 More Complicated Example Suppose we want to put 6 buttons in a frame like this (small change from example 2): A. Basics a little background & history putting a frame (window) on the screen B. Layouts arranging multiple components in a frame three different kinds of "layout managers" C. Components & Actions more kinds of components adding actions to components Outline Part C: Components & Actions We will talk about 4 different kinds of components: buttons labels text fields text areas Plus how to use "listeners" to attach actions to components D. Graphics drawing pictures dynamically E. Mouse Events & Timers reacting to mouse clicks using timers for animation 27 28

8 Goal For This Sub-Topic A simple program using three kinds of components with actions attached demo... "clickable" button with a border JButton JButton addbutton = new JButton("add"); JButton Methods JLabel String gettext() void settext(string newtext) Puts text on screen No borders, no actions, no background color (transparent) void setenabled(boolean enabled); default is true disabled button is "greyed out", no graphic reaction when clicked JLabel addlabel = new JLabel("amount to add: "); 31 32

9 JLabel Methods Text Components String gettext() void settext(string newtext) two kinds: text field (one line) text area (multiple lines) one line only space for entering/displaying text JTextField "editable " JTextArea like a JTextField, but multiple lines not "editable" JTextField addfield = new JTextField(10); width in "m JTextField multfield = new JTextField(10); spaces" JTextArea quotetextarea = new JTextArea(3,20); JTextField totalfield = new JTextField(10); totalfield.seteditable(false); JTextArea databasearea = new JTextArea(20, 30); databasearea.seteditable(false); 35 36

10 Methods For Text Components String gettext() void settext(string newtext) Event-Driven Programming Imperative Programming: You specify sequence of commands Programmer in control Event-Driven Programming: sequence driven by user's choices program waits for "events" and reacts to them Examples of events: button click menu choice window closed or resized mouse clicks, mouse motion ActionEvent Class describes a simple event like a button click, menu choice methods: Object getsource() returns the component that "caused" the event (button that was clicked) String getactioncommand() returns text from component ActionListener Interface public interface ActionListener { void actionperformed(actionevent e); } Program can register an action listener for a button. Meaning: when button is clicked, call actionperformed in this listener 39 40

11 Sequence of Events Set-up (usually in constructor): create button create listener register listener with button you write this code Demo: Baby Calculator Three different styles: inner listener class(es) use frame as listener anonymous inner classes During Program Run: Swing does this for you 1. user clicks button 2. Swing checks whether button has a listener 3. if yes: Swing creates an ActionEvent object Swing calls actionperformed method in listener with the object as argument A. Basics a little background & history putting a frame (window) on the screen B. Layouts arranging multiple components in a frame three different kinds of "layout managers" C. Components & Actions more kinds of components adding actions to components Outline Part D: Graphics We've seen how to put text on components Also possible to put "icon" (image from file) onto component. Sometimes we want to draw our own pictures dynamically Often use an empty panel D. Graphics drawing pictures dynamically E. Mouse Events & Timers reacting to mouse clicks using timers for animation 43 44

12 paintcomponent (1) every component has a paintcomponent method default method: draws text, borders, etc. on screen you can override to create your own graphics effects paintcomponent (2) void paintcomponent(graphics g) Parameter: "graphics context" current drawing colour & font position & size of component lots more You never call paintcomponent! Swing calls it automatically whenever the component needs painting: frame is created frame is resized frame is minimized then restored Graphics methods Note About Coordinates void drawline(int x1, int y1, int x2, int y2) void drawstring(string str, int x, int y) void drawrect(int x, int y, int width, int height) void fillrect(int x, int y, int width, int height) void drawoval(int x, int y, int width, int height) void filloval(int x, int y, int width, int height)...and lots more! Swing uses x & y coordinates, different from math x positive x: to the right positive y: down y 47 48

13 Simple Example Program start with a static display; add actions paintcomponent vs. repaint paintcomponent: takes a Graphics object as a parameter you override paintcomponent to draw your picture Swing (not you!) calls paintcomponent when necessary repaint: no parameters you call it to tell Java the component's graphics need to be updated you don't write or override it defined by Swing: gets the appropriate Graphics context and calls paintcomponent Summary For custom graphic effects: "state variables" to store information about current state of graphics button clicks & other actions change those variables create custom component subclass for drawing subclass gets special paintcomponent method which uses the state variables remember to call repaint() when you change the state variables! A. Basics a little background & history putting a frame (window) on the screen B. Layouts arranging multiple components in a frame three different kinds of "layout managers" C. Components & Actions more kinds of components adding actions to components D. Graphics drawing pictures dynamically Outline E. Mouse Events & Timers reacting to mouse clicks using timers for animation 51 52

14 Part E: Timers & Mouse Events Timers & Animation 1. Using a timer for animation 2. Reacting to mouse events Goal: Picture changes at frequent intervals without user intervention. To accomplish this: program generates its own events that change the screen Swing Timer Class Example Swing Timer: object that generates events at intervals. Timer(int delay, ActionListener listener) creates a timer, not started yet Program from last time: box with lines, grows & shrinks in response to buttons. New version: grows & shrinks by itself. demo... Timer timr = new Timer(500, new MyListenerClass()); will generate an ActionEvent every 500 milliseconds Caution: No guarantee events will occur exactly twice a second. Depends on program & system load. timr.start(); // timr starts generating events timr.stop(); // timr stops generating events 55 56

15 Review of Events & Listeners So Far We have discussed one kind of event: ActionEvent. Generated by several kinds of components: buttons text fields menu items ActionEvent object is simple: contains source of event Listener interface: ActionListener One method only -- actionperformed. Mouse Events A mouse event can be generated for mouse events inside any component. Kinds of mouse events: mouse enters the component mouse leaves the component mouse button pressed mouse button released mouse button clicked (pressed & same spot) MouseEvent Objects MouseListener interface A MouseEvent describes a mouse event. Methods to get location where event happened: getx() gety() public interface MouseListener { void mouseclicked(mouseevent e); void mouseentered(mouseevent e); void mouseexited(mouseevent e); void mousepressed(mouseevent e); void mousereleased(mouseevent e); } quick demo

16 Helpful Class: MouseAdapter Next example: I want to react to mouse clicks, not the other 4 kinds of events. Straightforward way: create a MouseListener class, 4 of the methods will have empty bodies. Example: Line Drawing Program demo... Shortcut: MouseAdapter is a class that implements MouseListener. All 5 method bodies are empty. My example: extend MouseAdapter and just have to override one method Suggestion For Assignment 4 Use mousepressed instead of mouseclicked. Why? Hard to keep it mouse absolutely still during a click. 63

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

Topic 9: Swing. Swing is a BIG library Goal: cover basics give you concepts & tools for learning more Swing = Java's GUI library Topic 9: Swing Swing is a BIG library Goal: cover basics give you concepts & tools for learning more Assignment 5: Will be an open-ended Swing project. "Programming Contest"

More information

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!

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! Swing = Java's GUI library Topic 9: Swing Swing is a BIG library Goal: cover basics give you concepts & tools for learning more Why are we studying Swing? 1. Useful & fun! 2. Good application of OOP techniques

More information

Unit 7: Event driven programming

Unit 7: Event driven programming Faculty of Computer Science Programming Language 2 Object oriented design using JAVA Dr. Ayman Ezzat Email: ayman@fcih.net Web: www.fcih.net/ayman Unit 7: Event driven programming 1 1. Introduction 2.

More information

GUI DYNAMICS Lecture July 26 CS2110 Summer 2011

GUI DYNAMICS Lecture July 26 CS2110 Summer 2011 GUI DYNAMICS Lecture July 26 CS2110 Summer 2011 GUI Statics and GUI Dynamics 2 Statics: what s drawn on the screen Components buttons, labels, lists, sliders, menus,... Containers: components that contain

More information

Graphical User Interfaces. Comp 152

Graphical User Interfaces. Comp 152 Graphical User Interfaces Comp 152 Procedural programming Execute line of code at a time Allowing for selection and repetition Call one function and then another. Can trace program execution on paper from

More information

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

Frames, GUI and events. Introduction to Swing Structure of Frame based applications Graphical User Interface (GUI) Events and event handling Frames, GUI and events Introduction to Swing Structure of Frame based applications Graphical User Interface (GUI) Events and event handling Introduction to Swing The Java AWT (Abstract Window Toolkit)

More information

Java Programming Lecture 6

Java Programming Lecture 6 Java Programming Lecture 6 Alice E. Fischer Feb 15, 2013 Java Programming - L6... 1/32 Dialog Boxes Class Derivation The First Swing Programs: Snow and Moving The Second Swing Program: Smile Swing Components

More information

Graphical User Interface (GUI)

Graphical User Interface (GUI) Graphical User Interface (GUI) An example of Inheritance and Sub-Typing 1 Java GUI Portability Problem Java loves the idea that your code produces the same results on any machine The underlying hardware

More information

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

CSEN401 Computer Programming Lab. Topics: Graphical User Interface Window Interfaces using Swing CSEN401 Computer Programming Lab Topics: Graphical User Interface Window Interfaces using Swing Prof. Dr. Slim Abdennadher 22.3.2015 c S. Abdennadher 1 Swing c S. Abdennadher 2 AWT versus Swing Two basic

More information

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

CSE 143. Event-driven Programming and Graphical User Interfaces (GUIs) with Swing/AWT CSE 143 Event-driven Programming and Graphical User Interfaces (GUIs) with Swing/AWT slides created by Marty Stepp based on materials by M. Ernst, S. Reges, D. Notkin, R. Mercer, Wikipedia http://www.cs.washington.edu/331/

More information

Window Interfaces Using Swing Objects

Window Interfaces Using Swing Objects Chapter 12 Window Interfaces Using Swing Objects Event-Driven Programming and GUIs Swing Basics and a Simple Demo Program Layout Managers Buttons and Action Listeners Container Classes Text I/O for GUIs

More information

PIC 20A GUI with swing

PIC 20A GUI with swing PIC 20A GUI with swing Ernest Ryu UCLA Mathematics Last edited: November 22, 2017 Hello swing Let s create a JFrame. import javax. swing.*; public class Test { public static void main ( String [] args

More information

User interfaces and Swing

User interfaces and Swing User interfaces and Swing Overview, applets, drawing, action listening, layout managers. APIs: java.awt.*, javax.swing.*, classes names start with a J. Java Lectures 1 2 Applets public class Simple extends

More information

GUI Basics. Object Orientated Programming in Java. Benjamin Kenwright

GUI Basics. Object Orientated Programming in Java. Benjamin Kenwright GUI Basics Object Orientated Programming in Java Benjamin Kenwright Outline Essential Graphical User Interface (GUI) Concepts Libraries, Implementation, Mechanics,.. Abstract Windowing Toolkit (AWT) Java

More information

Window Interfaces Using Swing Objects

Window Interfaces Using Swing Objects Chapter 12 Window Interfaces Using Swing Objects Event-Driven Programming and GUIs Swing Basics and a Simple Demo Program Layout Managers Buttons and Action Listeners Container Classes Text I/O for GUIs

More information

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

Starting Out with Java: From Control Structures Through Objects Sixth Edition Starting Out with Java: From Control Structures Through Objects Sixth Edition Chapter 12 A First Look at GUI Applications Chapter Topics 12.1 Introduction 12.2 Creating Windows 12.3 Equipping GUI Classes

More information

Graphical User Interface (GUI)

Graphical User Interface (GUI) Graphical User Interface (GUI) An example of Inheritance and Sub-Typing 1 Java GUI Portability Problem Java loves the idea that your code produces the same results on any machine The underlying hardware

More information

Programming graphics

Programming graphics Programming graphics Need a window javax.swing.jframe Several essential steps to use (necessary plumbing ): Set the size width and height in pixels Set a title (optional), and a close operation Make it

More information

GUI in Java TalentHome Solutions

GUI in Java TalentHome Solutions GUI in Java TalentHome Solutions AWT Stands for Abstract Window Toolkit API to develop GUI in java Has some predefined components Platform Dependent Heavy weight To use AWT, import java.awt.* Calculator

More information

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

Building a GUI in Java with Swing. CITS1001 extension notes Rachel Cardell-Oliver Building a GUI in Java with Swing CITS1001 extension notes Rachel Cardell-Oliver Lecture Outline 1. Swing components 2. Building a GUI 3. Animating the GUI 2 Swing A collection of classes of GUI components

More information

Graphics. Lecture 18 COP 3252 Summer June 6, 2017

Graphics. Lecture 18 COP 3252 Summer June 6, 2017 Graphics Lecture 18 COP 3252 Summer 2017 June 6, 2017 Graphics classes In the original version of Java, graphics components were in the AWT library (Abstract Windows Toolkit) Was okay for developing simple

More information

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

Part 3: Graphical User Interface (GUI) & Java Applets 1,QWURGXFWLRQWR-DYD3URJUDPPLQJ (( Part 3: Graphical User Interface (GUI) & Java Applets EE905-GUI 7RSLFV Creating a Window Panels Event Handling Swing GUI Components ƒ Layout Management ƒ Text Field ƒ

More information

Introduction to the JAVA UI classes Advanced HCI IAT351

Introduction to the JAVA UI classes Advanced HCI IAT351 Introduction to the JAVA UI classes Advanced HCI IAT351 Week 3 Lecture 1 17.09.2012 Lyn Bartram lyn@sfu.ca About JFC and Swing JFC Java TM Foundation Classes Encompass a group of features for constructing

More information

PROGRAMMING DESIGN USING JAVA (ITT 303) Unit 7

PROGRAMMING DESIGN USING JAVA (ITT 303) Unit 7 PROGRAMMING DESIGN USING JAVA (ITT 303) Graphical User Interface Unit 7 Learning Objectives At the end of this unit students should be able to: Build graphical user interfaces Create and manipulate buttons,

More information

Class 16: The Swing Event Model

Class 16: The Swing Event Model Introduction to Computation and Problem Solving Class 16: The Swing Event Model Prof. Steven R. Lerman and Dr. V. Judson Harward 1 The Java Event Model Up until now, we have focused on GUI's to present

More information

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

What is Widget Layout? Laying Out Components. Resizing a Window. Hierarchical Widget Layout. Interior Design for GUIs What is Widget Layout? Laying Out Components Positioning widgets in their container (typically a JPanel or a JFrame s content pane) Basic idea: each widget has a size and position Main problem: what if

More information

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

Graphics programming. COM6516 Object Oriented Programming and Design Adam Funk (originally Kirill Bogdanov & Mark Stevenson) Graphics programming COM6516 Object Oriented Programming and Design Adam Funk (originally Kirill Bogdanov & Mark Stevenson) Overview Aims To provide an overview of Swing and the AWT To show how to build

More information

CS 251 Intermediate Programming GUIs: Components and Layout

CS 251 Intermediate Programming GUIs: Components and Layout CS 251 Intermediate Programming GUIs: Components and Layout Brooke Chenoweth University of New Mexico Fall 2017 import javax. swing.*; Hello GUI public class HelloGUI extends JFrame { public HelloGUI ()

More information

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

All the Swing components start with J. The hierarchy diagram is shown below. JComponent is the base class. Q1. If you add a component to the CENTER of a border layout, which directions will the component stretch? A1. The component will stretch both horizontally and vertically. It will occupy the whole space

More information

BASICS OF GRAPHICAL APPS

BASICS OF GRAPHICAL APPS CSC 2014 Java Bootcamp Lecture 7 GUI Design BASICS OF GRAPHICAL APPS 2 Graphical Applications So far we ve focused on command-line applications, which interact with the user using simple text prompts In

More information

CS 2113 Software Engineering

CS 2113 Software Engineering CS 2113 Software Engineering Java 5 - GUIs Import the code to intellij https://github.com/cs2113f18/template-j-5.git Professor Tim Wood - The George Washington University Class Hierarchies Abstract Classes

More information

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

Command-Line Applications. GUI Libraries GUI-related classes are defined primarily in the java.awt and the javax.swing packages. 1 CS257 Computer Science I Kevin Sahr, PhD Lecture 14: Graphical User Interfaces Command-Line Applications 2 The programs we've explored thus far have been text-based applications A Java application is

More information

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

CSE 331. Event-driven Programming and Graphical User Interfaces (GUIs) with Swing/AWT CSE 331 Event-driven Programming and Graphical User Interfaces (GUIs) with Swing/AWT slides created by Marty Stepp based on materials by M. Ernst, S. Reges, D. Notkin, R. Mercer, Wikipedia http://www.cs.washington.edu/331/

More information

Laying Out Components. What is Widget Layout?

Laying Out Components. What is Widget Layout? Laying Out Components Interior Design for GUIs What is Widget Layout? Positioning widgets in their container (typically a JPanel or a JFrame s content pane) Basic idea: each widget has a size and position

More information

G51PRG: Introduction to Programming Second semester Applets and graphics

G51PRG: Introduction to Programming Second semester Applets and graphics G51PRG: Introduction to Programming Second semester Applets and graphics Natasha Alechina School of Computer Science & IT nza@cs.nott.ac.uk Previous two lectures AWT and Swing Creating components and putting

More information

Graphic User Interfaces. - GUI concepts - Swing - AWT

Graphic User Interfaces. - GUI concepts - Swing - AWT Graphic User Interfaces - GUI concepts - Swing - AWT 1 What is GUI Graphic User Interfaces are used in programs to communicate more efficiently with computer users MacOS MS Windows X Windows etc 2 Considerations

More information

G51PGP Programming Paradigms. Lecture 008 Inner classes, anonymous classes, Swing worker thread

G51PGP Programming Paradigms. Lecture 008 Inner classes, anonymous classes, Swing worker thread G51PGP Programming Paradigms Lecture 008 Inner classes, anonymous classes, Swing worker thread 1 Reminder subtype polymorphism public class TestAnimals public static void main(string[] args) Animal[] animals

More information

Graphical User Interfaces 2

Graphical User Interfaces 2 Graphical User Interfaces 2 CSCI 136: Fundamentals CSCI 136: Fundamentals of Computer of Science Computer II Science Keith II Vertanen Keith Vertanen Copyright 2011 Extending JFrame Dialog boxes Overview

More information

Systems Programming Graphical User Interfaces

Systems Programming Graphical User Interfaces Systems Programming Graphical User Interfaces Julio Villena Román (LECTURER) CONTENTS ARE MOSTLY BASED ON THE WORK BY: José Jesús García Rueda Systems Programming GUIs based on Java

More information

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

Introduction to Graphical User Interfaces (GUIs) Lecture 10 CS2110 Fall 2008 Introduction to Graphical User Interfaces (GUIs) Lecture 10 CS2110 Fall 2008 Announcements A3 is up, due Friday, Oct 10 Prelim 1 scheduled for Oct 16 if you have a conflict, let us know now 2 Interactive

More information

Lecture 5: Java Graphics

Lecture 5: Java Graphics Lecture 5: Java Graphics CS 62 Spring 2019 William Devanny & Alexandra Papoutsaki 1 New Unit Overview Graphical User Interfaces (GUI) Components, e.g., JButton, JTextField, JSlider, JChooser, Containers,

More information

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

KF5008 Program Design & Development. Lecture 1 Usability GUI Design and Implementation KF5008 Program Design & Development Lecture 1 Usability GUI Design and Implementation Types of Requirements Functional Requirements What the system does or is expected to do Non-functional Requirements

More information

CS Exam 1 Review Suggestions

CS Exam 1 Review Suggestions CS 235 - Fall 2015 - Exam 1 Review Suggestions p. 1 last modified: 2015-09-30 CS 235 - Exam 1 Review Suggestions You are responsible for material covered in class sessions, lab exercises, and homeworks;

More information

Graphical User Interfaces (GUIs)

Graphical User Interfaces (GUIs) CMSC 132: Object-Oriented Programming II Graphical User Interfaces (GUIs) Department of Computer Science University of Maryland, College Park Model-View-Controller (MVC) Model for GUI programming (Xerox

More information

2IS45 Programming

2IS45 Programming Course Website Assignment Goals 2IS45 Programming http://www.win.tue.nl/~wsinswan/programmeren_2is45/ Rectangles Learn to use existing Abstract Data Types based on their contract (class Rectangle in Rectangle.

More information

CPS122 Lecture: Graphical User Interfaces and Event-Driven Programming

CPS122 Lecture: Graphical User Interfaces and Event-Driven Programming CPS122 Lecture: Graphical User Interfaces and Event-Driven Programming Objectives: Last revised 1/15/10 1. To introduce the notion of a component and some basic Swing components (JLabel, JTextField, JTextArea,

More information

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

Control Flow: Overview CSE3461. An Example of Sequential Control. Control Flow: Revisited. Control Flow Paradigms: Reacting to the User CSE3461 Control Flow Paradigms: Reacting to the User Control Flow: Overview Definition of control flow: The sequence of execution of instructions in a program. Control flow is determined at run time by

More information

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

CSE 331. Event- driven Programming and Graphical User Interfaces (GUIs) with Swing/AWT CSE 331 Event- driven Programming and Graphical User Interfaces (GUIs) with Swing/AWT Lecturer: Michael Hotan slides created by Marty Stepp based on materials by M. Ernst, S. Reges, D. Notkin, R. Mercer,

More information

Example Programs. COSC 3461 User Interfaces. GUI Program Organization. Outline. DemoHelloWorld.java DemoHelloWorld2.java DemoSwing.

Example Programs. COSC 3461 User Interfaces. GUI Program Organization. Outline. DemoHelloWorld.java DemoHelloWorld2.java DemoSwing. COSC User Interfaces Module 3 Sequential vs. Event-driven Programming Example Programs DemoLargestConsole.java DemoLargestGUI.java Demo programs will be available on the course web page. GUI Program Organization

More information

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

Java Swing. based on slides by: Walter Milner. Java Swing Walter Milner 2005: Slide 1 Java Swing based on slides by: Walter Milner Java Swing Walter Milner 2005: Slide 1 What is Swing? A group of 14 packages to do with the UI 451 classes as at 1.4 (!) Part of JFC Java Foundation Classes

More information

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

Lab 4. D0010E Object-Oriented Programming and Design. Today s lecture. GUI programming in Lab 4 D0010E Object-Oriented Programming and Design Lecture 9 Lab 4: You will implement a game that can be played over the Internet. The networking part has already been written. Among other things, the

More information

AP CS Unit 11: Graphics and Events

AP CS Unit 11: Graphics and Events AP CS Unit 11: Graphics and Events This packet shows how to create programs with a graphical interface in a way that is consistent with the approach used in the Elevens program. Copy the following two

More information

Java. GUI building with the AWT

Java. GUI building with the AWT Java GUI building with the AWT AWT (Abstract Window Toolkit) Present in all Java implementations Described in most Java textbooks Adequate for many applications Uses the controls defined by your OS therefore

More information

H212 Introduction to Software Systems Honors

H212 Introduction to Software Systems Honors Introduction to Software Systems Honors Lecture #19: November 4, 2015 1/14 Third Exam The third, Checkpoint Exam, will be on: Wednesday, November 11, 2:30 to 3:45 pm You will have 3 questions, out of 9,

More information

Part I: Learn Common Graphics Components

Part I: Learn Common Graphics Components OOP GUI Components and Event Handling Page 1 Objectives 1. Practice creating and using graphical components. 2. Practice adding Event Listeners to handle the events and do something. 3. Learn how to connect

More information

DM503 Programming B. Peter Schneider-Kamp.

DM503 Programming B. Peter Schneider-Kamp. DM503 Programming B Peter Schneider-Kamp petersk@imada.sdu.dk! http://imada.sdu.dk/~petersk/dm503/! ADVANCED OBJECT-ORIENTATION 2 Object-Oriented Design classes often do not exist in isolation from each

More information

COMPSCI 230. Software Design and Construction. Swing

COMPSCI 230. Software Design and Construction. Swing COMPSCI 230 Software Design and Construction Swing 1 2013-04-17 Recap: SWING DESIGN PRINCIPLES 1. GUI is built as containment hierarchy of widgets (i.e. the parent-child nesting relation between them)

More information

GUI Program Organization. Sequential vs. Event-driven Programming. Sequential Programming. Outline

GUI Program Organization. Sequential vs. Event-driven Programming. Sequential Programming. Outline Sequential vs. Event-driven Programming Reacting to the user GUI Program Organization Let s digress briefly to examine the organization of our GUI programs We ll do this in stages, by examining three example

More information

Chapter 14: Applets and More

Chapter 14: Applets and More Chapter 14: Applets and More Starting Out with Java: From Control Structures through Objects Fifth Edition by Tony Gaddis Chapter Topics Chapter 14 discusses the following main topics: Introduction to

More information

8/23/2014. Chapter Topics. Introduction to Applets. Introduction to Applets. Introduction to Applets. Applet Limitations. Chapter 14: Applets and More

8/23/2014. Chapter Topics. Introduction to Applets. Introduction to Applets. Introduction to Applets. Applet Limitations. Chapter 14: Applets and More Chapter 14: Applets and More Starting Out with Java: From Control Structures through Objects Fifth Edition by Tony Gaddis Chapter Topics Chapter 14 discusses the following main topics: Introduction to

More information

CPS122 Lecture: Graphical User Interfaces and Event-Driven Programming

CPS122 Lecture: Graphical User Interfaces and Event-Driven Programming CPS122 Lecture: Graphical User Interfaces and Event-Driven Programming Objectives: Last revised March 2, 2017 1. To introduce the notion of a component and some basic Swing components (JLabel, JTextField,

More information

Chapter 14: Applets and More

Chapter 14: Applets and More Chapter 14: Applets and More Starting Out with Java: From Control Structures through Objects Fourth Edition by Tony Gaddis Addison Wesley is an imprint of 2010 Pearson Addison-Wesley. All rights reserved.

More information

Unit 6: Graphical User Interface

Unit 6: Graphical User Interface Faculty of Computer Science Programming Language 2 Object oriented design using JAVA Dr. Ayman Ezzat Email: ayman@fcih.net Web: www.fcih.net/ayman Unit 6: Graphical User Interface 1 1. Overview of the

More information

DM550 / DM857 Introduction to Programming. Peter Schneider-Kamp

DM550 / DM857 Introduction to Programming. Peter Schneider-Kamp DM550 / DM857 Introduction to Programming Peter Schneider-Kamp petersk@imada.sdu.dk http://imada.sdu.dk/~petersk/dm550/ http://imada.sdu.dk/~petersk/dm857/ GRAPHICAL USER INTERFACES 2 HelloWorld Reloaded

More information

GUI 4.1 GUI GUI MouseTest.java import javax.swing.*; import java.awt.*; import java.awt.event.*; /* 1 */

GUI 4.1 GUI GUI MouseTest.java import javax.swing.*; import java.awt.*; import java.awt.event.*; /* 1 */ 25 4 GUI GUI GUI 4.1 4.1.1 MouseTest.java /* 1 */ public class MouseTest extends JApplet implements MouseListener /* 2 */ { int x=50, y=20; addmouselistener(this); /* 3 */ super.paint(g); /* 4 */ g.drawstring("hello

More information

Dr. Hikmat A. M. AbdelJaber

Dr. Hikmat A. M. AbdelJaber Dr. Hikmat A. M. AbdelJaber JWindow: is a window without a title bar or move controls. The program can move and resize it, but the user cannot. It has no border at all. It optionally has a parent JFrame.

More information

GUI (Graphic User Interface) Programming. Part 2 (Chapter 8) Chapter Goals. Events, Event Sources, and Event Listeners. Listeners

GUI (Graphic User Interface) Programming. Part 2 (Chapter 8) Chapter Goals. Events, Event Sources, and Event Listeners. Listeners GUI (Graphic User Interface) Programming Part 2 (Chapter 8) Chapter Goals To understand the Java event model To install action and mouse event listeners To accept input from buttons, text fields, and the

More information

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

Datenbank-Praktikum. Universität zu Lübeck Sommersemester 2006 Lecture: Swing. Ho Ngoc Duc 1 Datenbank-Praktikum Universität zu Lübeck Sommersemester 2006 Lecture: Swing Ho Ngoc Duc 1 Learning objectives GUI applications Font, Color, Image Running Applets as applications Swing Components q q Text

More information

Agenda. Programming Seminar. By: dr. Amal Khalifa. Coordinate systems Colors Fonts Drawing shapes Graphics2D API

Agenda. Programming Seminar. By: dr. Amal Khalifa. Coordinate systems Colors Fonts Drawing shapes Graphics2D API Agenda Coordinate systems Colors Fonts Drawing shapes Graphics2D API By: dr. Amal Khalifa 1 Programming Seminar @12:30 13:30 pm on Wednesday 9/4/2014 Location : 2.505.01 Painting components 2 Every component

More information

The JFrame Class Frame Windows GRAPHICAL USER INTERFACES. Five steps to displaying a frame: 1) Construct an object of the JFrame class

The JFrame Class Frame Windows GRAPHICAL USER INTERFACES. Five steps to displaying a frame: 1) Construct an object of the JFrame class CHAPTER GRAPHICAL USER INTERFACES 10 Slides by Donald W. Smith TechNeTrain.com Final Draft 10/30/11 10.1 Frame Windows Java provides classes to create graphical applications that can run on any major graphical

More information

2110: GUIS: Graphical User Interfaces

2110: GUIS: Graphical User Interfaces 2110: GUIS: Graphical User Interfaces Their mouse had a mean time between failure of a week it would jam up irreparably, or... jam up on the table--... It had a flimsy cord whose wires would break. Steve

More information

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

Graphical User Interfaces. Swing. Jose Jesus García Rueda Graphical User Interfaces. Swing Jose Jesus García Rueda Introduction What are the GUIs? Well known examples Basic concepts Graphical application. Containers. Actions. Events. Graphical elements: Menu

More information

Lecture 19 GUI Events

Lecture 19 GUI Events CSE 331 Software Design and Implementation Lecture 19 GUI Events The plan User events and callbacks Event objects Event listeners Registering listeners to handle events Anonymous inner classes Proper interaction

More information

What is Widget Layout? COSC 3461 User Interfaces. Hierarchical Widget Layout. Resizing a Window. Module 5 Laying Out Components

What is Widget Layout? COSC 3461 User Interfaces. Hierarchical Widget Layout. Resizing a Window. Module 5 Laying Out Components COSC User Interfaces Module 5 Laying Out Components What is Widget Layout? Positioning widgets in their container (typically a JPanel or a JFrame s content pane) Basic idea: each widget has a size and

More information

CompSci 125 Lecture 17. GUI: Graphics, Check Boxes, Radio Buttons

CompSci 125 Lecture 17. GUI: Graphics, Check Boxes, Radio Buttons CompSci 125 Lecture 17 GUI: Graphics, Check Boxes, Radio Buttons Announcements GUI Review Review: Inheritance Subclass is a Parent class Includes parent s features May Extend May Modify extends! Parent

More information

Object-Oriented Programming Design. Topic : Graphics Programming GUI Part I

Object-Oriented Programming Design. Topic : Graphics Programming GUI Part I Electrical and Computer Engineering Object-Oriented Topic : Graphics GUI Part I Maj Joel Young Joel.Young@afit.edu 15-Sep-03 Maj Joel Young A Brief History Lesson AWT Abstract Window Toolkit Implemented

More information

Computer Science 210: Data Structures. Intro to Java Graphics

Computer Science 210: Data Structures. Intro to Java Graphics Computer Science 210: Data Structures Intro to Java Graphics Summary Today GUIs in Java using Swing in-class: a Scribbler program READING: browse Java online Docs, Swing tutorials GUIs in Java Java comes

More information

CSE 331 Software Design & Implementation

CSE 331 Software Design & Implementation CSE 331 Software Design & Implementation Hal Perkins Spring 2017 GUI Event-Driven Programming 1 The plan User events and callbacks Event objects Event listeners Registering listeners to handle events Anonymous

More information

COSC 123 Computer Creativity. Graphics and Events. Dr. Ramon Lawrence University of British Columbia Okanagan

COSC 123 Computer Creativity. Graphics and Events. Dr. Ramon Lawrence University of British Columbia Okanagan COSC 123 Computer Creativity Graphics and Events Dr. Ramon Lawrence University of British Columbia Okanagan ramon.lawrence@ubc.ca Key Points 1) Draw shapes, text in various fonts, and colors. 2) Build

More information

1.00 Lecture 14. Lecture Preview

1.00 Lecture 14. Lecture Preview 1.00 Lecture 14 Introduction to the Swing Toolkit Lecture Preview Over the next 5 lectures, we will introduce you to the techniques necessary to build graphic user interfaces for your applications. Lecture

More information

Class 14: Introduction to the Swing Toolkit

Class 14: Introduction to the Swing Toolkit Introduction to Computation and Problem Solving Class 14: Introduction to the Swing Toolkit Prof. Steven R. Lerman and Dr. V. Judson Harward 1 Class Preview Over the next 5 lectures, we will introduce

More information

Programming Mobile Devices J2SE GUI

Programming Mobile Devices J2SE GUI Programming Mobile Devices J2SE GUI University of Innsbruck WS 2009/2010 thomas.strang@sti2.at Graphical User Interface (GUI) Why is there more than one Java GUI toolkit? AWT write once, test everywhere

More information

GUI Event Handlers (Part I)

GUI Event Handlers (Part I) GUI Event Handlers (Part I) 188230 Advanced Computer Programming Asst. Prof. Dr. Kanda Runapongsa Saikaew (krunapon@kku.ac.th) Department of Computer Engineering Khon Kaen University 1 Agenda General event

More information

To gain experience using GUI components and listeners.

To gain experience using GUI components and listeners. Lab 5 Handout 7 CSCI 134: Fall, 2017 TextPlay Objective To gain experience using GUI components and listeners. Note 1: You may work with a partner on this lab. If you do, turn in only one lab with both

More information

Graphical User Interfaces 2

Graphical User Interfaces 2 Graphical User Interfaces 2 CSCI 136: Fundamentals of Computer Science II Keith Vertanen Copyright 2011 Extending JFrame Dialog boxes Ge?ng user input Overview Displaying message or error Listening for

More information

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

Course Status Networking GUI Wrap-up. CS Java. Introduction to Java. Andy Mroczkowski CS 190 - Java Introduction to Java Andy Mroczkowski uamroczk@cs.drexel.edu Department of Computer Science Drexel University March 10, 2008 / Lecture 8 Outline Course Status Course Information & Schedule

More information

CS108, Stanford Handout #22. Thread 3 GUI

CS108, Stanford Handout #22. Thread 3 GUI CS108, Stanford Handout #22 Winter, 2006-07 Nick Parlante Thread 3 GUI GUIs and Threading Problem: Swing vs. Threads How to integrate the Swing/GUI/drawing system with threads? Problem: The GUI system

More information

Graphical User Interfaces 2

Graphical User Interfaces 2 Graphical User Interfaces 2 CSCI 136: Fundamentals of Computer Science II Keith Vertanen Copyright 2014 2011 Extending JFrame Dialog boxes Overview Ge

More information

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

Goals. Lecture 7 More GUI programming. The application. The application D&D 12. CompSci 230: Semester JFrame subclass: ListOWords Goals By the end of this lesson, you should: Lecture 7 More GUI programming 1. Be able to write Java s with JTextField, JList, JCheckBox and JRadioButton components 2. Be able to implement a ButtonGroup

More information

Lecture 3: Java Graphics & Events

Lecture 3: Java Graphics & Events Lecture 3: Java Graphics & Events CS 62 Fall 2017 Kim Bruce & Alexandra Papoutsaki Text Input Scanner class Constructor: myscanner = new Scanner(System.in); can use file instead of System.in new Scanner(new

More information

Introduction This assignment will ask that you write a simple graphical user interface (GUI).

Introduction This assignment will ask that you write a simple graphical user interface (GUI). Computing and Information Systems/Creative Computing University of London International Programmes 2910220: Graphical Object-Oriented and Internet programming in Java Coursework one 2011-12 Introduction

More information

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

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 List of Slides 1 Title 2 Chapter 13: Graphical user interfaces 3 Chapter aims 4 Section 2: Example:Hello world with a GUI 5 Aim 6 Hello world with a GUI 7 Hello world with a GUI 8 Package: java.awt and

More information

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

Parts of a Contract. Contract Example. Interface as a Contract. Wednesday, January 30, 13. Postcondition. Preconditions. Parts of a Contract Syntax - Method signature Method name Parameter list Return type Semantics - Comments Preconditions: requirements placed on the caller Postconditions: what the method modifies and/or

More information

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

Java & Graphical User Interface II. Wang Yang wyang AT njnet.edu.cn Java & Graphical User Interface II Wang Yang wyang AT njnet.edu.cn Outline Review of GUI (first part) What is Event Basic Elements of Event Programming Secret Weapon - Inner Class Full version of Event

More information

Basicsof. JavaGUI and SWING

Basicsof. JavaGUI and SWING Basicsof programming3 JavaGUI and SWING GUI basics Basics of programming 3 BME IIT, Goldschmidt Balázs 2 GUI basics Mostly window-based applications Typically based on widgets small parts (buttons, scrollbars,

More information

Method Of Key Event Key Listener must implement three methods, keypressed(), keyreleased() & keytyped(). 1) keypressed() : will run whenever a key is

Method Of Key Event Key Listener must implement three methods, keypressed(), keyreleased() & keytyped(). 1) keypressed() : will run whenever a key is INDEX Event Handling. Key Event. Methods Of Key Event. Example Of Key Event. Mouse Event. Method Of Mouse Event. Mouse Motion Listener. Example of Mouse Event. Event Handling One of the key concept in

More information

HW#1: Pencil Me In Status!? How was Homework #1? Reminder: Handouts. Homework #2: Java Draw Demo. 3 Handout for today! Lecture-Homework mapping.

HW#1: Pencil Me In Status!? How was Homework #1? Reminder: Handouts. Homework #2: Java Draw Demo. 3 Handout for today! Lecture-Homework mapping. HW#1: Pencil Me In Status!? CS193J: Programming in Java Summer Quarter 2003 Lecture 6 Inner Classes, Listeners, Repaint Manu Kumar sneaker@stanford.edu How was Homework #1? Comments please? SITN students

More information

Chapter 12 Advanced GUIs and Graphics

Chapter 12 Advanced GUIs and Graphics Chapter 12 Advanced GUIs and Graphics Chapter Objectives Learn about applets Explore the class Graphics Learn about the classfont Explore the classcolor Java Programming: From Problem Analysis to Program

More information

CSE 331 Software Design and Implementation. Lecture 19 GUI Events

CSE 331 Software Design and Implementation. Lecture 19 GUI Events CSE 331 Software Design and Implementation Lecture 19 GUI Events Leah Perlmutter / Summer 2018 Announcements Announcements Quiz 7 due Thursday 8/9 Homework 8 due Thursday 8/9 HW8 has a regression testing

More information

Advanced Java Unit 6: Review of Graphics and Events

Advanced Java Unit 6: Review of Graphics and Events Advanced Java Unit 6: Review of Graphics and Events This is a review of the basics of writing a java program that has a graphical interface. To keep things simple, all of the graphics programs will follow

More information