CS12420 - Lecture 01 Frames and Components and events Lynda Thomas

Slides:



Advertisements
Similar presentations
Java GUI building with the AWT. AWT (Abstract Window Toolkit) Present in all Java implementations Described in (almost) every Java textbook Adequate for.
Advertisements

Graphical User Interfaces
Graphic User Interfaces Layout Managers Event Handling.
F27SB2 Programming Languages
Multithreading : animation. slide 5.2 Animation Animation shows different objects moving or changing as time progresses. Thread programming is useful.
CMSC 341 Building Java GUIs. 09/26/2007 CMSC 341 GUI 2 Why Java GUI Development? Course is about Data Structures, not GUIs. We are giving you the opportunity.
Java Swing Recitation – 11/(20,21)/2008 CS 180 Department of Computer Science, Purdue University.
Event Driven Programming and GUIs Part 3 CS221 – 4/15/09.
Event-Driven Programming Thus far, our programs have been executed one statement after the other However, many programs depend on user actions to dictate.
Java GUI Libraries Swing Programming. Swing Components Swing is a collection of libraries that contains primitive widgets or controls used for designing.
© L.Lúcio, An example GUI in Java n Two graphic libraries in Java u AWT u Swing n Swing is more recent than AWT: u Built on top of AWT classes;
Gui Interfaces a la Swing Up to speed with Swing by Steven Gutz is a good source It don’t mean a thing if it ain’t got that swing Duke Ellington.
Event-Driven Programming Thus far, our programs have been executed one statement after the other However, many programs depend on user actions to dictate.
IEEM 110 Computing in Industrial Applications Basic User Interface in Java.
1 Event Driven Programming with Graphical User Interfaces (GUIs) A Crash Course © Rick Mercer.
GUI and Event-Driven Programming Recitation – 3/6/2009 CS 180 Department of Computer Science, Purdue University.
Scott Grissom, copyright 2006Ch 11: GUI Slide 1 Graphical User Interfaces (Ch 11) Careful design of a graphical user interface is key to a viable software.
Unit 11 Object-oriented programming: Graphical user interface Jin Sa.
Lesson 35: Review of the Java GUI. The JFrame, Container and JButton.
Chapter 8: Graphical User Interfaces Objectives - by the end of this chapter, you should be able to do the following: –write a simple graphical user interface.
Java Programming Chapter 10 Graphical User Interfaces.
Introduction to GUI Java offers a great number of pre-defined classes to support the development of graphical user interfaces –These are broken down into.
1 Event Driven Programming wirh Graphical User Interfaces (GUIs) A Crash Course © Rick Mercer.
Consolidation. Code making (i.e. making ciphers) is undertaken by a cryptographer whereas cryptanalysts try to break ciphers in order to gain intelligence.
Layout Management Containers can arrange their components. Our container is a JPanel, and it can set the way it’s components will be laid out : mypanel.setLayout.
Applets and Frames CS 21a: Introduction to Computing I First Semester,
CSE 219 Computer Science III Graphical User Interface.
Chapter 12- GUI’s, Java, and Swing.. Overview n What are GUI’s n How Java does GUI’s- Swing n Buttons n Containers n Text I/O and Swing n Review.
MIT AITI 2003 Lecture 17. Swing - Part II. The Java Event Model Up until now, we have focused on GUI's to present information (with one exception) Up.
עקרונות תכנות מונחה עצמים תרגול 4 - GUI. Outline  Introduction to GUI  Swing  Basic components  Event handling.
Java GUI building with Swing. 2 AWT (Abstract Window Toolkit) Present in all Java implementations Described in (almost) every Java textbook Adequate for.
GUI Components and Design Here we add one more component to our programs, JButtons –JButtons can only be inserted into JPanels (or JApplets) –Clicking.
1 CSC111H Graphical User Interfaces (GUIs) Introduction GUIs in Java Understanding Events A Simple Application The Containment Hierarchy Layout Managers.
Graphic User Interface. Graphic User Interface (GUI) Most of us interact with computers using GUIs. GUIs are visual representations of the actions you.
Graphics and Event-Driven Programming in Java John C. Ramirez Department of Computer Science University of Pittsburgh.
Copyright © 2002, Systems and Computer Engineering, Carleton University c-Gui3.ppt * Object-Oriented Software Development Part 18-c Building.
CS Lecture 00 Swing overview and introduction Lynda Thomas
Swing GUI Components You can create graphics components to place on your applet using classes available in the Swing package ( javax.swing ) Class names.
Timer class and inner classes. Processing timer events Timer is part of javax.swing helps manage activity over time Use it to set up a timer to generate.
CompSci 100E 35.1 Graphical User Interfaces: GUIs  Components  Flat Layouts  Hierarchical Layouts  Designing a GUI  Coding a GUI.
MT311 Java Application Development and Programming Languages Li Tak Sing ( 李德成 )
Layout Managers Arranges and lays out the GUI components on a container.
Applets and Frames. Copyright 2005, by the authors of these slides, and Ateneo de Manila University. All rights reserved L14: GUI Slide 2 Applets Usually.
1 / 67 COP 3503 FALL 2012 SHAYAN JAVED LECTURE 14 Programming Fundamentals using Java 1.
Java GUI. Graphical User Interface (GUI) a list a button a text field a label combo box checkbox.
Introduction to GUI in 1 Graphical User Interface 2 Nouf Almunyif.
1 Lecture 25 Listening to buttons and mice Quotes by Tony Hoare There are two ways of constructing a software design: (1) make it so simple that there.
Computer Science 209 GUIs Model/View/Controller Layouts.
Basics of GUI Programming Chapter 11 and Chapter 22.
1 Event Driven Programs with a Graphical User Interface Rick Mercer.
CS Lecture 04 Mice Lynda Thomas
Chapter 10 - Writing Graphical User Interfaces1 Chapter 10 Writing Graphical User Interfaces.
Swing GUI Components So far, we have written GUI applications which can ‘ draw ’. These applications are simple, yet typical of all Java GUI applications.
Lesson 28: More on the GUI button, frame and actions.
Graphical User Interface (GUI)
Applets. 9/04/2005 Copyright 2005, by the authors of these slides, and Ateneo de Manila University. All rights reserved L12: Applets Slide 2 Applets Usually.
MIT AITI 2004 Swing Event Model Lecture 17. The Java Event Model In the last lecture, we learned how to construct a GUI to present information to the.
5-1 GUIs and Events Rick Mercer. 5-2 Event-Driven Programming with Graphical user Interfaces  Most applications have graphical user interfaces to respond.
AWT Vs SWING. 2 AWT (Abstract Window Toolkit) Present in all Java implementations Described in most Java textbooks Adequate for many applications Uses.
Java Visual Applications CSIS 3701: Advanced Object Oriented Programming.
GUI.1 Graphical User Interfaces GUIs. GUI.2 The Plan Components Flat Layouts Hierarchical Layouts Designing a GUI Coding a GUI.
1 Event Driven Programming with Graphical User Interfaces (GUIs) A Crash Course © Rick Mercer.
A Quick Java Swing Tutorial
GUIs and Events Rick Mercer.
Graphical User Interfaces
Graphical User Interfaces -- GUIs
Graphical User Interface (pronounced "gooey")
Ellen Walker Hiram College
Steps to Creating a GUI Interface
Graphical User Interface
Presentation transcript:

CS Lecture 01 Frames and Components and events Lynda Thomas

In This Lecture Frames, panels and layout Basic Components This is the most important of the Swing lectures because here you see the overall way an event driven program works Just a reminder Swing is built on AWT. Some things exist in AWT and in Swing. Example: Frame/JFrame are the AWT and Swing versions. DO NOT MIX!!!!!

Frames Generally known as a window JFrame –Title –Buttons to close, maximize, iconize

This is where we look at handout 1 if we haven’t already

JFrame – some methods setVisible(boolean b) setTitle(String title) setSize(int width,int height) setLocation(int horizontal,int vertical) pack() setDefaultCloseOperation(int operation) –setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE)

JPanels – some methods Used as canvas or containers in Frames JPanel setBackground(Color c) setPreferredSize(Dimension d)

But what do you put in your JPanel (or JFrame) ? JComponents like: JLabel- displays stuff JTextField- display and enter JTextArea- display and enter JButton- press and action

Layout Manager JFrame : default is BorderLayout –CENTER, NORTH, SOUTH, EAST, WEST JPanel: default is FlowLayout –RIGHT, LEFT, CENTER GridLayout –Rows and columns GridBagLayout –Most powerful (and complicated)

So Far in This Lecture Frames, panels and layout probably skip example in 1-frames for now - which is on next 2 slides

Driver public class SimpleFrameDriver { public static void main(String[] args) { SimpleFrame sFrame1 = new SimpleFrame(); //etc Frame import javax.swing.*; public class SimpleFrame extends JFrame { SimpleFrame() { this.setSize(200,200); this.setLocation(200,320); //etc

public class SimplePanelFrame extends SimpleFrame { //note SimpleFrame gives visibility, size, exiting on close etc. SimplePanelFrame() { ColorPanel CPWest = new ColorPanel(Color.white); add(CPWest,BorderLayout.WEST); //etc public class ColorPanel extends JPanel { ColorPanel(Color c,int w,int h) { this.setPreferredSize (new Dimension(width,height)); this.setBackground(col); } Where do these methods come from? They come from JPanel

And this leads us to event driven programming Nothing happens until you click a button (later – move the mouse etc also) Something has to ‘listen’ to button presses These things are called ‘Listeners’ You can have separate Listeners or things like Panels which are also Listeners

Edit the simple example (or look at 2-simpleImprovedCode or 2- handout ) import javax.swing.*; /** the panel */ public class MyPanel extends JPanel private JButton button; public MyPanel() { button=new JButton("Hello"); add(button); MyActionListener listener=new MyActionListener(); //added button.addActionListener(listener); }

Add a class called MyActionListener import javax.swing.*; import java.awt.event.*; public class MyActionListener implements ActionListener{ public void actionPerformed (ActionEvent e) { System.out.println("pressed button"); }

See handout 2 for a nicer version Also show how the Panel could implement ActionListener…

Project Specification – handout 3 Counter Up8Down Reset

We will build this from the ground up in 3-events-components/Counter handout 3 First the model: CounterModel.java This represents the functionality of the Model Try and separate the Model and the way it is presented

public class CounterModel { private int value; public CounterModel() { value = 0; } public void increment() { value++; } //etc } Notice CounterModelTest where we test the model!

Components - and some methods JLabel(String text) setText(String text) setForeground(Color c) JButton(String text) Moves us into event-driven programming addActionListener(ActionListener listener)

CounterDriver runs the CounterFrame CounterFrame has a CounterPanel in it CounterPanel is guts ….. Contains a link to the Model and Buttons CounterListener listens to the Buttons

public class CounterPanel extends JPanel { private CounterModel counter; private JLabel valueLabel; JButton upButton, downButton, resetButton; public CounterPanel() { //setup the layout this.setLayout(new BorderLayout()); //create model and its display: counter = new CounterModel(); valueLabel = new JLabel(""+counter.getValue(),SwingConstants.CENTER); this.add(valueLabel,BorderLayout.CENTER);

//this is the constructor from last slide continued … //setup the listener (include a link back to here so that it can update) CounterListener countList = new CounterListener(this); //now do the buttons upButton = new JButton("Up"); //create a button this.add(upButton,BorderLayout.WEST); //position it upButton.addActionListener(countList); //set listener to listen //do same with other buttons //THESE 3 THINGS ALWAYS NEED TO BE DONE FOR ANYTHING //THAT IS RESPONDING TO EVENTS – create, add, listen

How does the listener work? import java.awt.event.*; public class CounterListener implements ActionListener { private CounterPanel counterPane; public CounterListener(CounterPanel cp) { counterPane = cp; } public void actionPerformed(ActionEvent evt) { String actionCommand = evt.getActionCommand(); if(actionCommand.equals("Up")) { counterPane.increment(); }//etc

UML Class Diagram JFrameJLabelJPanelJButton > ActionListener CounterFrame CounterPanel + increment() + decrement() + reset() CounterModel + increment() + decrement() + reset() + getValue() : int CounterListener + actionPerformed(e : ActionEvent) SimpleFrame + showIt() CounterDriver + main()

Lynda – this is handout 3 we’ll act this out (maybe)

If this seems complicated …. It is because things are getting all linked up with things pointing to things that point to them One possibility is to make the Panel itself its own listener – see CounterAlternative

public class CounterPanelSelfListener extends JPanel implements ActionListener { private CounterModel counter; private JLabel valueLabel; JButton upButton, downButton, resetButton; public CounterPanelSelfListener() { ……………… //now do the buttons upButton = new JButton("Up"); //create a button this.add(upButton,BorderLayout.WEST); //position it upButton.addActionListener(this); ………………. } public void actionPerformed(ActionEvent evt) { //etc

If this is too complex look at zzBruteForce – handout 4 BruteForceAndIgnorance.java Everything done in one class. if (this helps) great – look at it but consider the advantages of the other way else ignore it!

This Lecture Basic Frames and the things that go in them TODO: put a JTextField in the North that allows the user to enter a starting value for the Counter –There is an example of a JTextField in Bank –You’ll get the most out of it if you try it today. It shouldn’t take very long at all.

In The Next Lecture Other kinds of selection and Menus