Basics of programming 3. Java GUI and SWING

Similar documents
Swing. Component overview. Java UI, summer semester 2017/2018 1

Introduction to the JAVA UI classes Advanced HCI IAT351

Basicsof. JavaGUI and SWING

CS410G: GUI Programming. The Model/View/Controller Pattern. Model. Controller. View. MVC is a popular architecture for building GUIs

Outline. More on the Swing API Graphics: double buffering and timers Model - View - Controller paradigm Applets

Graphics. Lecture 18 COP 3252 Summer June 6, 2017

Introduction p. 1 JFC Architecture p. 5 Introduction to JFC p. 7 The JFC 1.2 Extension p. 8 Swing p. 9 Drag and Drop p. 16 Accessibility p.

Is image everything?

Java Swing. Lists Trees Tables Styled Text Components Progress Indicators Component Organizers

Custom Data Models and Cell Renderers

Tool Kits, Swing. Overview. SMD158 Interactive Systems Spring Tool Kits in the Abstract. An overview of Swing/AWT

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

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

Graphic User Interfaces. - GUI concepts - Swing - AWT

Swing. By Iqtidar Ali

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

Packages: Putting Classes Together

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

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

Computer Science 210: Data Structures. Intro to Java Graphics

Lecture 18 Java Graphics and GUIs

Charlie Garrod Bogdan Vasilescu

CSE 331 Software Design & Implementation

G51PRG: Introduction to Programming Second semester Applets and graphics

Graphics and Painting

DM550 Introduction to Programming part 2. Jan Baumbach.

To follow the Deitel publishing program, sign-up now for the DEITEL BUZZ ON-

Chapter 12 GUI Basics

Outline. Composite Pattern. Model-View-Controller Pattern Callback Pattern

Graphical User Interface (GUI)

CS 251 Intermediate Programming GUIs: Components and Layout

Chapter 8: GUI Dialog & Table. Informatics Practices Class XII. By- Rajesh Kumar Mishra. KV No.1, AFS, Suratgarh

JComponent. JPanel. JFrame. JFrame JDialog, JOptionPane. JPanel. JPanel

GUI Event Handlers (Part II)

Advanced Java Programming. Swing. Introduction to Swing. Swing libraries. Eran Werner, Tel-Aviv University Summer, 2005

Widgets. Overview. Widget. Widgets Widget toolkits Lightweight vs. heavyweight widgets Swing Widget Demo

Java IDE Programming-I

CHAPTER 2. Java Overview

GUI Components Continued EECS 448

Window Interfaces Using Swing Objects

Graphical User Interface (GUI)

DM537/DM550 Object-Oriented Programming. Jan Baumbach

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

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

Object-Oriented Programming Design. Topic : User Interface Components with Swing GUI Part III

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

Java Programming Lecture 6

Uppsala University. Assignment 3. Separation into Model-View TableModel ListModel ( multiple inheritance or adapter) Renderer (delegation)

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

Announcements. Introduction. Lecture 18 Java Graphics and GUIs. Announcements. CSE 331 Software Design and Implementation

Trees CSCI 201 Principles of Software Development

JAVA NOTES GRAPHICAL USER INTERFACES

DM537 Object-Oriented Programming. Peter Schneider-Kamp.

DM503 Programming B. Peter Schneider-Kamp.

Practical Scala. Dianne Marsh Emerging Technology for the Enterprise Conference 03/26/2009

1.1 GUI. JFrame. import java.awt.*; import javax.swing.*; public class XXX extends JFrame { public XXX() { // XXX. init() main() public static

Heavyweight with platform-specific widgets. AWT applications were limited to commonfunctionality that existed on all platforms.

Advanced Web Technology - Java Server Faces

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

Design Case Study: GUI with Swing

Design Case Study: GUI with Swing (2)

DM550 / DM857 Introduction to Programming. Peter Schneider-Kamp

Administrivia. CSSS Movie Night: Zombieland & Iron Man Date: Thurs., Mar 11 Time: 6 10 pm Location: DMP 310 Free pop & popcorn for every attendee!

Example: Building a Java GUI

Widget. Widget is a generic name for parts of an interface that have their own behaviour. e.g., buttons, progress bars, sliders, drop-down

Example: Building a Java GUI

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!

China Jiliang University Java. Programming in Java. Java Swing Programming. Java Web Applications, Helmut Dispert

Window Interfaces Using Swing Objects

COMPSCI 230. Software Design and Construction. Swing

Chapter 13 Lab Advanced GUI Applications

Widgets. Widgets Widget Toolkits. User Interface Widget

(Incomplete) History of GUIs

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

JDirectoryChooser Documentation

Programming graphics

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

TYPES OF INTERACTORS Prasun Dewan Department of Computer Science University of North Carolina at Chapel Hill

Introduction to Graphical Interface Programming in Java. Introduction to AWT and Swing

Widgets. Widgets Widget Toolkits. 2.3 Widgets 1

CS 315 Software Design Homework 1 First Sip of Java Due: Sept. 10, 11:30 PM

Java How to Program, 9/e. Copyright by Pearson Education, Inc. All Rights Reserved.

Inheritance (cont) Abstract Classes

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

Java. GUI building with the AWT

PART 23. Java GUI Advanced JList Component. more items.

Static Detection of Brittle Parameter Typing

Graphics in Swing. Engineering 5895 Faculty of Engineering & Applied Science Memorial University of Newfoundland

Java: Graphical User Interfaces (GUI)

Graphical User Interfaces 2

Summary Chapter 25 GUI Components: Part 2

Sri Vidya College of Engineering & Technology

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

Bringing Life to Swing Desktop Applications

CS111: PROGRAMMING LANGUAGE II

Class 14: Introduction to the Swing Toolkit

1.00 Lecture 14. Lecture Preview

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

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

Transcription:

Basics of programming 3 Java GUI and SWING

Complex widgets Basics of programming 3 BME IIT, Goldschmidt Balázs 2

Complex widgets JList elements can be selected from a list JComboBox drop down list with optional textfield JTable matrix-like representation of data more on laboratory JTree tree-like representation of hierarchical data Basics of programming 3 BME IIT, Goldschmidt Balázs 3

Separation of aspects Model-View-Controller (MVC) pattern model: storing and handling data view: GUI representation and visual info controller: event handling by listener implementation Simple widgets combine data and GUI, only listeners are separated Complex widgets GUI and data are also separated e.g. JList and ListModel, JTable and TableModel default model implementations are provided Basics of programming 3 BME IIT, Goldschmidt Balázs 4

MVC architecture Model Interface update Model Impl query Controller Interface Controller Impl notification notification query View Impl View Interface Objektumorientált SW-tervezés BME IIT, Goldschmidt Balázs 5

Complex widget: JList Shows a list of objects by default objects tostring() method is used Objects are stored separately Object[] (immutable) Vector<T> (immutable) ListModel implementation (eg. DefaultListModel) Scrolling is done by JScrollPane JScrollPane is a container providing scrolling functionality JList only renders the list Basics of programming 3 BME IIT, Goldschmidt Balázs 6

Model part: ListModel interface javax.swing.listmodel Object getelementat(int index) returns element at index int getsize() returns number of stored elements void removelistdatalistener (ListDataListener l) void addlistdatalistener (ListDataListener l) adds/removes listener Basics of programming 3 BME IIT, Goldschmidt Balázs 7

ListDataListener When model changes, listeners are notified JList has its own implementation: BasicListUI.ListDataHandler Methods void intervaladded(listdataevent e) void intervalremoved(listdataevent e) interval specified in e is modified void contentschanged(listdataevent e) complex change has occured Basics of programming 3 BME IIT, Goldschmidt Balázs 8

DefaultListModel Implements interface ListModel Methods resembling java.util.list void add(int index, Object o) int size() Object get(int index) Object remove(int index)... Basics of programming 3 BME IIT, Goldschmidt Balázs 9

JList class diagram -component JComponent VIEW JScrollPane MODEL <<<<interface>>>> ListSelectionListener 0..* JList 1 -model <<<<interface>>>> ListModel DefaultListModel MyListener CONTROL Basics of programming 3 BME IIT, Goldschmidt Balázs 10

JList example Let s create a window with a list for displaying strings a textfield for entering strings when entered, list is updated Basics of programming 3 BME IIT, Goldschmidt Balázs 11

JList example code public class SwingList implements ActionListener{ JTextField tf; JList list; DefaultListModel model; public void actionperformed(actionevent ae) { model.addelement(tf.gettext()); tf.settext(""); } static public void main(string args[]) { (new SwingList()).run(); }... Basics of programming 3 BME IIT, Goldschmidt Balázs 12

JList example code }... public void run() { JFrame f = new JFrame("AWT Example"); tf = new JTextField("", 20); model = new DefaultListModel(); list = new JList(model); JScrollPane pane = new JScrollPane(list); tf.addactionlistener(this); f.add(tf, BorderLayout.SOUTH); f.add(pane, BorderLayout.CENTER); f.pack(); f.show(); } Basics of programming 3 BME IIT, Goldschmidt Balázs 13

MVC in operation If model is modified, GUI is updated calling model.addelement( Holiday ) makes GUI refresh If GUI gets an event, Controller is notified ListSelectionListener void valuechanged(listselectionevent e) For retreiving selected value(s), use JList s getselectedindex() or getselectedindices() and ListModel s getelementat() methods Basics of programming 3 BME IIT, Goldschmidt Balázs 14

MVC analysis Model: DefaultListModel handles collection of elements when changes, notifies View View: JList(+BasicListUI.ListDataHandler) displays elements only Controller: SwingList (implements ActionListener) updates Model based on GUI element (View) actions Basics of programming 3 BME IIT, Goldschmidt Balázs 15

Complex widget: JTree Displaying tree structure (hierarchy) Model: TreeModel Might be initialized with a TreeNode-tree when specifying the root Basics of programming 3 BME IIT, Goldschmidt Balázs 16

JTree example Problem: let s create an application for displaying a binary tree! tree stores doubles new element can be added Basics of programming 3 BME IIT, Goldschmidt Balázs 17

JTree example BinTree implements a binary tree (DIY) no children: uses Null object instead of null easier implementation Null Object pattern similar to sentinels in linked lists expensive! after insertion full path to new element is to be returned Basics of programming 3 BME IIT, Goldschmidt Balázs 18

JTree example BinTreeModel the model for JTree gives access to BinTree BinTree root = new BinTree() handling TreeModelListener-s Vector<TreeModelListener> listeners public void addtreemodellistener(treemodellistener l) public void removetreemodellistener(treemodellistener l) Basics of programming 3 BME IIT, Goldschmidt Balázs 19

JTree example BinTreeModel (cont) accessing the model public Object getchild(object parent, int index) public int getchildcount(object parent) public int getindexofchild(object parent, Object child) public Object getroot() public boolean isleaf(object node) public void valueforpathchanged(treepath path, Object newvalue) public void insert(double d) Basics of programming 3 BME IIT, Goldschmidt Balázs 20

JTree class diagram JTree <<interface>> TreeModel DefaultTreeModel 0..2 BinTree BinTreeModel 0..* <<interface>> TreeModelListener JTree.TreeModelHandler Basics of programming 3 BME IIT, Goldschmidt Balázs 21

JTree example: application JTextField tf; BinTreeModel btm; public void actionperformed(actionevent ae) { double d = Double.parseDouble(tf.getText()); btm.insert(d); tf.settext(""); } tf = new JTextField("", 20); btm = new BinTreeModel(); JTree tree = new JTree(btm); JScrollPane scrollpane = new JScrollPane(tree); tf.addactionlistener(this); Basics of programming 3 BME IIT, Goldschmidt Balázs 22

MVC vs MVP Basics of programming 3 BME IIT, Goldschmidt Balázs 23

Questions of layering Thin vs thick client where is the business logic? MVC: how much business logic in View? Multi-tier architecture browser, application server, database display, service, business logic, infrastructure Smart browser Ajax, GWT, HTML5, etc browser does view and model is it still thin? Basics of programming 3 BME IIT, Goldschmidt Balázs 24

Classic MVC (revisited) Model Interface update Model Impl query Controller Interface Controller Impl notify notify query View Impl View Interface Basics of programming 3 BME IIT, Goldschmidt Balázs 25

Model-View-Controller V View View Logic query notify C Controller update notify query M Model Basics of programming 3 BME IIT, Goldschmidt Balázs 26

Model-View-Presenter V View update View Logic P query notify Controller update notify query M Model Basics of programming 3 BME IIT, Goldschmidt Balázs 27

Model-View-ViewModel V View update binder makes this automatic View Logic VM query notify Controller update notify query M Model Basics of programming 3 BME IIT, Goldschmidt Balázs 28

Low level graphics Basics of programming 3 BME IIT, Goldschmidt Balázs 29

JComponent and painting JComponent: basic class of widget hierarchy paint(graphics g) paints on g when needed repaint() notifies GUI to repaint the component variants with subrectangles specified Graphics: basic class for drawing primitives the usual methods for drawing lines, arcs, text, etc Graphics2d: advanced graphics shapes, glyphs, etc Basics of programming 3 BME IIT, Goldschmidt Balázs 30

Class Graphics Drawing primitives drawline, drawrect, drawpolygon, drawtext etc. Image handling drawimage, see class Image also Filling primitives fillrect, filloval, fillpolygon, etc. Clearing primitives clearrect Colour and font setting setcolor, setfont, etc Basics of programming 3 BME IIT, Goldschmidt Balázs 31

Accessing class Graphics Inside method paint(graphics g) method parameter use only in the method Outside method paint e.g. off-screen graphic rendering JComponent.getGraphics() method Creating off-screen images (buffering) use class BufferedImage java.awt.image package Basics of programming 3 BME IIT, Goldschmidt Balázs 32

Special components Basics of programming 3 BME IIT, Goldschmidt Balázs 33

Adding menus to frames ActionListener al = new MyActionListener(); b.addactionlistener(al); JMenuItem mi1 = new JMenuItem("Current Date"); mi1.setactioncommand("date"); // setting action command mi1.addactionlistener(al); // adding listener JMenu m1 = new JMenu("Test"); m1.add(mi1); JMenuBar bar = new JMenuBar(); bar.add(m1); f.setjmenubar(bar); Basics of programming 3 BME IIT, Goldschmidt Balázs 34

Using dialogs Dialogs are transient windows Default swing dialogs JFileChooser file selection; OK button text can be changed, file pattern can be set, etc JColorChooser for choosing a colour from a palette with different models JOptionPane selecting options (OK, OK-cancel, yes-no-cancel, etc.) JDialog general purpose empty dialog, has to be filled Basics of programming 3 BME IIT, Goldschmidt Balázs 35

Dialog examples JFileChooser chooser = new JFileChooser(); // parent window and approve text has to be defined int returnval = chooser.showdialog(f, "Select"); if(returnval == JFileChooser.APPROVE_OPTION) { System.out.println(chooser.getSelectedFile().getName()); } Basics of programming 3 BME IIT, Goldschmidt Balázs 36

Dialog examples JOptionPane opt = new JOptionPane( Close the dialog?", JOptionPane.QUESTION_MESSAGE, // type JOptionPane.YES_NO_CANCEL_OPTION); // options // parent and dialog title JDialog jd = opt.createdialog(f, "Question"); jd.setvisible(true); System.out.println(opt.getValue().toString()); Basics of programming 3 BME IIT, Goldschmidt Balázs 37

Further features Basics of programming 3 BME IIT, Goldschmidt Balázs 38

Further swing features Convenient tooltip management e.g. JComponent.setToolTipText Inside windows within frames with own window management Drag and drop text and other objects, works across applications Look and feel... customizable by adding a simple jar file Basics of programming 3 BME IIT, Goldschmidt Balázs 39