CMPUT 301 Section H02 Lab 2 Swing - Webdocs Cs Ualberta

CMPUT 301
Section H02
Lab 2
Swing
TA: Michelle Annett
09/24/07
.intro.
•Swing
–Containers
–Components
–Layouts
–Events
•Assignment 2
TA: Michelle Annett
09/24/07
.swing.
•A
GUI
(graphical user interface)
toolkit for Java
•Has a pluggable
‘look and feel’
•Allows for the creation of different GUI widgets:
•Buttons, Sliders, Lists, Menus
•File Choosers, Text Areas, Tables, Tooltips
•Dialogs, Panels, Tabbed Panes
•Java previously used
AWT (Abstract Window
Toolkit)
which was platform dependent, and as such
the behavior and appearance of components
changed from system to system
•All AWT components are a part of Swing
•Swing component –JFrame, JPanel, ect.
•AWT component Frame, Panel, etc.
TA: Michelle Annett
09/24/07
.swing -look and feel.
TA: Michelle Annett
09/24/07
Java LnFWindows LnF
TA: Michelle Annett
09/24/07
CDE/Motif LnF
Custom LnF
.swing -look and feel.
.swing -applets.
TA: Michelle Annett
09/24/07
•runs within a
web browser
•
embedded
into the
html/php
of a webpage:
<applet width="910" height="560“code= “Annoki.class”</applet>
•must have
init()
method in order to run
.swing -applications.
TA: Michelle Annett
09/24/07
•
stand-alone
•must have a
main()
method in order to run
•we will be using applications for 301
.containers.
TA: Michelle Annett
09/24/07
•Abstract class that holds or
contains other Java Swing components
in a
hierarchical manner
•Every Java program that uses swing components has at least one
‘
Top Level Container
’
•Examples of Containers:
•JFrames
•JApplets
•JDialogs
Using these for 301
.containers -frames.
TA: Michelle Annett
09/24/07
•A frame is a top level
component
•Has a
title
and a
border
•Buttons to control its closing
or minimization
.components.
TA: Michelle Annett
09/24/07
JButtonJCheckBoxesJRadioButtonsJComboBoxJList
JMenu
JLabels
JToolBar
JProgressBar
JSeparator
TA: Michelle Annett
09/24/07
.components.
TA: Michelle Annett
09/24/07
JPanel
JSplitPane
JScrollPane
JTabbedPane
JLayeredPane
JToolTip
TA: Michelle Annett
09/24/07
•Having all of these components within our
application, is great, but how do we achieve
an effective, easy to use interface?
Layout Managers!
•Encapsulates an algorithm that controls
the size and position of elements within a
window
•Seamlessly deals with the resizing of
windows
•Deal with sizing issues that arise from
custom Look and Feel
.layouts.
.layouts.
TA: Michelle Annett
09/24/07
•
BorderLayout
•Components are places
according to a direction
(Top, Bottom, Right, Left ,
Center
•
CardLayout
•Most often used with a JComboBox
•The JComboBoxSelection determines
which Jpanelor group of objects is
displayed
.layouts.
TA: Michelle Annett
09/24/07
•GridBagLayout
•Uses a grid to align objects
•Rows and columns can have different heights
and elements can span more than one cell
•BoxLayout
•All components are placed in one row or
column
•Flow Layout
•Default for JPanels
•Left to Right Component layout
.events.
TA: Michelle Annett
09/24/07
I have all the components and the layout, now what?
•We need to ‘capture’the events generated by a user
•There are many classes of events:
•Window Events
•
Action Events
•
List Selection Events
•Mouse Events
•Mouse Motion Events
•
Keyboard Focus Events
.events.
TA: Michelle Annett
09/24/07
public class MyClassimplements
ActionListener
{
//component code
}
JButtonmyButton= new JButton(INCREASE);
myButton.
addActionListener
(this);
public void
actionPerformed
(
ActionEvente
) {
//code that reacts to the action ...
String command =
e.getActionCommand
();
if(command.equals(INCREASE)){
this.increaseGraph();
}
}
Declaration:
Event Handler:
.links.
TA: Michelle Annett
09/24/07
•Java SDK Documentation:
http://java.sun.com/j2se/1.5.0/docs/index.html
•Java SDK API:
http://java.sun.com/j2se/1.5.0/docs/api/index.html
•Source Code Examples:
http://www.java2s.com/
.assignment 2.
TA: Michelle Annett
09/24/07
•Creating an
Image Viewer
•Basic Capabilities
•
Load images
from a user-specified directory
•
View image thumbnails
from directory chosen above
•
View
a single, full size
image
•
Scalean image
larger, smaller, and to its original dimensions
•
Adjust
the
brightness
of an image
•
View
the selected image’s
filename
•
View
the
current
, and
original image scaling resolution
•
Obtain help
.assignment 2.
TA: Michelle Annett
09/24/07
•Deliverables:
•
User Manual
•
UML Class Diagram
•
UML Sequence Diagram
describing how a user would adjust the
brightness of an image
•
Source Code
•Suggested Structure:
as2
src
docs
tests
images
images
images
.the end.
Assignment 2 due:
Monday, February 4th, 2007
12:00 noon
TA: Michelle Annett
09/24/07
Demos:
Thursday, February 7th, 2007
In Lab