Graphic Interface Programming II Using Swing and OOP more advanced issues. Uppsala universitet

Similar documents
Graphic Interface Programming II Events and Threads. Uppsala universitet

Graphics. Lecture 18 COP 3252 Summer June 6, 2017

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

CSC 160 LAB 8-1 DIGITAL PICTURE FRAME. 1. Introduction

Assignment 2. Application Development

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

Graphics and Painting

UI Software Organization

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!

Inheritance. One class inherits from another if it describes a specialized subset of objects Terminology:

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

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

Advanced Effects in Java Desktop Applications

1.00 Lecture 14. Lecture Preview

Overview. Lecture 7: Inheritance and GUIs. Inheritance. Example 9/30/2008

Bringing Life to Swing Desktop Applications

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

Introduction to the JAVA UI classes Advanced HCI IAT351

CS 251 Intermediate Programming GUIs: Components and Layout

CSE 331 Software Design & Implementation

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

Class 14: Introduction to the Swing Toolkit

Lecture 18 Java Graphics and GUIs

Java Programming Lecture 6

Window Interfaces Using Swing Objects

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

IT101. Graphical User Interface

Programmierpraktikum

Window Interfaces Using Swing Objects

Week Chapter Assignment SD Technology Standards. 1,2, Review Knowledge Check JP3.1. Program 5.1. Program 5.1. Program 5.2. Program 5.2. Program 5.

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

PIC 20A GUI with swing

Java Programming. Computer Science 112

JAVA NOTES GRAPHICAL USER INTERFACES

Object-oriented programming in Java (2)

DM550 / DM857 Introduction to Programming. Peter Schneider-Kamp

H212 Introduction to Software Systems Honors

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

Graphical User Interface (GUI)

Final Examination Semester 2 / Year 2012

2D Graphics. Shape Models, Drawing, Selection. CS d Graphics 1

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

CS 209 Programming in Java #13 Multimedia

Here is a list of a few of the components located in the AWT and Swing packages:

COMP-202 Unit 10: Basics of GUI Programming (Non examinable) (Caveat: Dan is not an expert in GUI programming, so don't take this for gospel :) )

+! Today. Lecture 3: ArrayList & Standard Java Graphics 1/26/14! n Reading. n Objectives. n Reminders. n Standard Java Graphics (on course webpage)

Systems Programming Graphical User Interfaces

Swing and you are winning

CS 11 java track: lecture 3

CSE 331 Software Design & Implementation

Kirill Grouchnikov, Amdocs Desktop Matters Conference San Jose, March

First Name: AITI 2004: Exam 2 July 19, 2004

Final Examination Semester 2 / Year 2010

Inheritance and Interfaces

DM503 Programming B. Peter Schneider-Kamp.

Event Driven Programming

!"# $!"%& ' (" % ) % % %* % % % * ' %

CS506 Web Programming and Development Solved Subjective Questions With Reference For Final Term Lecture No 1

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

Programming Languages and Techniques (CIS120)

Computer Science 210: Data Structures. Intro to Java Graphics

CS Exam 1 Review Suggestions

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

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

Graphical User Interface (GUI)

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

Graphic User Interfaces. - GUI concepts - Swing - AWT

Final Examination Semester 2 / Year 2011

Programming graphics

Implementing Graphical User Interfaces

Packages: Putting Classes Together

CS193k, Stanford Handout #3. Swing 1

Java Coordinate System

CompSci 125 Lecture 20. Inheritance: Introduction, Overrides UML: Introduction to Class Diagrams

AP CS Unit 11: Graphics and Events

2IS45 Programming

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

Queen s University Faculty of Arts and Science School of Computing CISC 124 Final Examination December 2004 Instructor: M. Lamb

Swing. By Iqtidar Ali

Lecture 5: Java Graphics

1.00/1.001 Introduction to Computers and Engineering Problem Solving Spring Quiz 2

CS-140 Fall 2017 Test 1 Version Practice Practice for Nov. 20, Name:

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

AP CS Unit 12: Drawing and Mouse Events

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

5. In JAVA, is exception handling implicit or explicit or both. Explain with the help of example java programs. [16]

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

First Name: AITI 2004: Exam 2 July 19, 2004

User interfaces and Swing

ICOM 4015 Advanced Programming Laboratory. Chapter 3 Introduction to Graphical Applications in Java using Swing

Programming Languages and Techniques (CIS120)

Virtualians.ning.pk. 2 - Java program code is compiled into form called 1. Machine code 2. native Code 3. Byte Code (From Lectuer # 2) 4.

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.

Announcements. Java Graphics. Exceptions. Java Odds & Ends

More Swing. CS180 Recitation 12/(04,05)/08

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

Lecture 3: Java Graphics & Events

2D Graphics. Shape Models, Drawing, Selection. CS d Graphics 1

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

Transcription:

Graphic Interface Programming II Using Swing and OOP more advanced issues IT Uppsala universitet

Good interface programming Swing is an EXTENDIBLE toolkit Build your OWN components Many times you need the same (similar) solution several times Make a general (reusable) solution 4/6/11 #2

Example: ImagePanel Working with images Want to use a JPanel with an image drawn on it Extend the JPanel! 4/6/11 #3

ImagePanel public class ImagePanel extends JPanel { private Image img; } public ImagePanel(String img) { this(new ImageIcon(img).getImage()); } public ImagePanel(Image img) { this.img = img; Dimension size = new Dimension(img.getWidth(null),img.getHeight(null)); setpreferredsize(size); setminimumsize(size); setmaximumsize(size); setsize(size); setlayout(null); } public void paintcomponent(graphics g) { g.drawimage(img,0,0,null); } 4/6/11 #4

Labels too? public class ImageLabel extends JLabel { public ImageLabel(String img) { this(new ImageIcon(img)); } } public ImageLabel(ImageIcon icon) { seticon(icon); seticontextgap(0); setborder(null); settext(null); setsize(icon.getimage().getwidth(null), icon.getimage().getheight(null)); } 4/6/11 #5

ImageButtons? import java.awt.*; import javax.swing.*; public class ImageButton extends JButton { public ImageButton(String img) { this(new ImageIcon(img)); } } public ImageButton(ImageIcon icon) { seticon(icon); setmargin(new Insets(0,0,0,0)); seticontextgap(0); setborderpainted(false); setborder(null); settext(null); setsize(icon.getimage().getwidth(null), icon.getimage().getheight(null)); } 4/6/11 #6

Reusable! All these Components can be extended in turn They are (extended) JPanels, JLabels and JButtons but with a twist Your twist 4/6/11 #7

ReUsable Methods? Why not just make a method library? //Create and set up a colored label. private JLabel createcoloredlabel(string text, Color color, Point origin) { JLabel label = new JLabel(text); label.setverticalalignment(jlabel.top); label.sethorizontalalignment(jlabel.center); label.setopaque(true); label.setbackground(color); label.setforeground(color.black); label.setborder(borderfactory.createlineborder(color.black)); label.setbounds(origin.x, origin.y, 140, 140); return label; } 4/6/11 #8

Flexibility ReUsable Methods? Multiple Constructors No Copying between classes less errors //A Colored Label Class with Black Border private class ColoredLabel extends Jlabel { ColoredLabel(String text, Color color, Point origin) { super(text); // The JLabel Constructor. this.setverticalalignment(jlabel.top); this.sethorizontalalignment(jlabel.center); this.setopaque(true); this.setbackground(color); this.setforeground(color.black); this.setborder(borderfactory.createlineborder(color.black)); this.setbounds(origin.x, origin.y, 140, 140); } } 4/6/11 #9

RichLabel A Label class that can be configured to display a message in different styles Provides concistensy Simple to adapt Reusable (if made right this one isn t) 4/6/11 #10

// drop shadow w/ highlight label.setleftshadow(1,1,color.white); label.setrightshadow(2,3,color.black); label.setforeground(color.gray); label.setfont(label.getfont().derivefont(140f)); // 3d letters label.setleftshadow(5,5,color.white); label.setrightshadow(-3,-3, new Color(0xccccff)); label.setforeground(new Color(0x8888ff)); label.setfont(label.getfont().derivefont(140f)); 4/6/11 #11

Custom Borders 4/6/11 #12

Custom Borders 4/6/11 #13

Custom Borders Provide the puzzle pieces Let the class do the puzzling 4/6/11 #14

UU/IT Useful Principle Border images are simple to do in Photoshop Cut in slices Use standardized class to draw the borders Do the programming once, change images 4/6/11 #15

UU/IT Useful Principle Border images are simple to do in Photoshop Cut in slices Use standardized class to draw the borders Do the programming once, change images This one won t work with this method 4/6/11 #16

Not only for Java This method is also used for theme building in Web sites Content management systems Often driven by PHP, but same idea Automated graphics generation 4/6/11 #17

Always think in terms of reuse! What might be useful? TextLabels that have a different Font? TextLabels that change the textsize when scaled? A Shaped Window? Your issue is to create it once, so you can reuse it many times 4/6/11 #18

paintcomponent(grahpics g) A key to advanced interface design in Java Necessary to understand how paintcomponent does the painting We can use it to do interesting effects 4/6/11 #19

In extended classes: Standard case Call super.paintcomponent(g) Causes the basic drawing of the component to be performed E.g. In a button, draws the button outline, the text, etc. Then describe what you want to draw on top of that Good for most standard purposes 4/6/11 #20

Painting paintcomponent The main method for painting. By default, it first paints the background if the component is opaque. Then it performs any custom painting. paintborder Tells the component's border (if any) to paint. Do not invoke or override this method. paintchildren Tells any components contained by this component to paint themselves. Do not invoke or override this method. 4/6/11 #21

Stages Background Custom Painting (You) Border This is why: a Swing button will be drawn over any painted graphic you may want to override the border or children methods Children 4/6/11 #22

Do not invoke or override Yes, you should! But you have to know how to do this Always call super to be on the safe side 4/6/11 #23

Overriding paintchildren public void paintchildren (Graphics g) { super.paintchildren(g); // Initialization of image and other stuff g.drawimage( some image ); } The image will be drawn over the swing components 4/6/11 #24

WaterMarking E.g., adding a fixed Corporate Logotype under some text Can be implemented through clever use of paintcomponent() Requires some understanding of the painting process 4/6/11 #25

ViewPort For large information views A sized hole through which a part of the info is visible ScrollBars are used to move the ViewPort over the content 4/6/11 #26

Example 4/6/11 #27

JScrollPane An implementation of the ViewPort paradigm Takes a JPanel, JTextArea etc. as client and adds a view port to it We can modify it! (http://java.sun.com/docs/books/tutorial/uiswing/components/scrollpane.html) 4/6/11 #28

Layer order JScrollPane contains JPanel, which contains // or JTextArea all components added to it Buttons, areas etc. textarea = new JTextArea(5, 30);... JScrollPane scrollpane = new JScrollPane(textArea);... 4/6/11 #29

Watermarking public void setbackgroundtexture(url url) throws IOException { bgimage = ImageIO.read(url); Rectangle rect = new Rectangle(0,0, bgimage.getwidth(null),bgimage.getheight(null)); texture = new TexturePaint(bgimage, rect); } Create the Background texture from an image (URL) public void setview(jcomponent view) { view.setopaque(false); super.setview(view); } Set Opacity BEFORE calling the super method 4/6/11 #30

paintcomponent public void paintcomponent(graphics g) { // do the superclass behavior first super.paintcomponent(g); } // paint the texture if(texture!= null) { Graphics2D g2 = (Graphics2D)g; g2.setpaint(texture); g.fillrect(0,0,getwidth(),getheight()); } Call superclass behaviour and then paint the Picture with the paint. 4/6/11 #31

Watermarking This makes the watermark stay put and the text moves over it If the watermark is added to the Textarea then it will move with the scroll 4/6/11 #32

Knowledge about painting Essential for creating graphics Outside of the box Requires practice Create a testing class: A simple frame including the selected paintcomponent definition. Just clone the class för a new version 4/6/11 #33

JComponent Layers Jframe ContentPane JPanel JButtons, JTextAreas, etc Other SubComponents All this as manged by the paintcomponent definitions (initiated by the JFrame or by a call to repaint() 4/6/11 #34

Display Layers 4/6/11 #35

On my request Interfaces Packages Structuring 4/6/11 #36

When to use? Interface Simplest definition: Use an interface when you need to be able to handle several different classes as one type Interface is (sort of) a replacement for multiple inheritance 4/6/11 #37

Other use Use an interface when you want to publish a support class and make sure that all methods needed will be defined by the programmer Do not overuse interfaces! You might consider implementing default methods instead (that can be overridden) Gives a safer implementation (if there is a default behaviour Compare AbstractXxxx classes 4/6/11 #38

Packages When should we split up into packages? When a project grows big (or we know that it will grow big). To structure different functionalities To avoid name clashes 4/6/11 #39

Structuring tools Support for overview and clarity Support for programming projects It is just as bad to have too many as having too few A package should be a conceptual unit 4/6/11 #40

Structuring Use file and project structures (packages, interfaces, extensions) that are logical Put similar things together with good names Try also to structure the files in the project in a logical way Use visual structuring tools Straight lines in indentations, lines to divide in sections. Meta Comments that describe how classes connect 4/6/11 #41