Anda di halaman 1dari 39

SSD3: Object-Oriented Programming and

Design

Object-Oriented Programme 1
Unit 3. Advanced Class Implementation
 3.1 Input and Output Programming
 3.2 Graphical User Interface
 3.3 Toward Commercial Use

 Assessments
 Exam 3

Object-Oriented Programme 2
3.2 Graphical User Interface
 Contents
 3.2.1 Swing Components and Containers
 3.2.2 Swing Event Handling
 3.2.3 Class JFileChooser

 Assessments
 Multiple-Choice Quiz 6
 Exercise 7

Object-Oriented Programme 3
3.2.1 Swing Components and Containers
 Component JLabel
 Component JButton
 Component JRadioButton
 Component JTextField
 Component JTextArea
 Component JList

 You will know


 how Swing components are created and customized?
 how components events are handled?
 Compared with MS Window platform controls

Object-Oriented Programme 4
Component JLabel
 JLabel is used for display
 text
 an image
 or text and an image

 ClassJLabelDemo(JLabelDemo.java) creates a
window with three JLabel components:
 The first label contains text and an image;
 the second label contains text;
 the third label contains an image.

Object-Oriented Programme 5
Note on the sample code
 In line 40,
 the ImageIcon constructor receives the name of the
image file and a string with a description of the image.
 In lines 49 and 50,
 setHorizontalTextPosition() modify the horizontal position
of the text relative to the image
 setVerticalTextPosition() modify the vertical position of
the text relative to the image.
 In lines 51 and 55,
 setFont() modifies the font of the text.
 In line 54,
 setHorizontalAlignment() modifies the alignment of the
text along the X-axis.

Object-Oriented Programme 6
other JLabel methods
 void setText(String).
 Modifies the text of the component.
 String getText().
 Obtains the text of the component.
 void setIcon(Icon).
 Modifies the image of the component.
 Icon getIcon().
 Obtains the image of the component.
 void setIconTextGap(int).
 Defines the space (in pixels) between the text and the
image.

 See API document


Object-Oriented Programme 7
Component JButton
 JButton can display
 text
 an image
 or text and an image,

 Class
JButtonDemo(JButtonDemo.java) creates a
window with two JButton components.

Object-Oriented Programme 8
Note of the sample code
 In lines 41 and 43
 the constructor ImageIcon() receives the name of the
image file and a string with a description of the image.
 In lines 51 to 54
 setHorizontalTextPosition() modify the horizontal position
of the text relative to the image
 setVerticalTextPosition() modify the vertical position of
the text relative to the image.
 In lines 57 to 60
 setBackground() modify the background color of the
component.
 setForeground() modify the text color of the component.
 In line 63
 setEnabled() disables the Down button.

Object-Oriented Programme 9
other JButton methods
 void setText(String).
 Modifies the text of the component.
 String getText().
 Obtains the text of the component.
 void setIcon(Icon).
 Modifies the image of the component.
 Icon getIcon().
 Obtains the image of the component.
 void setFont(Font).
 Modifies the font of the component.

 See API document for more

Object-Oriented Programme 10
Component JRadioButton
 JRadioButton can be
 selected or deselected by the user.
 If JRadioButton components are grouped, by
means of the class ButtonGroup, only one button
at a time can be selected.

 ClassJRadioButtonDemo
(JRadioButtonDemo.java)
 creates a window with three JRadioButton
components
 creates a groups including them.
Object-Oriented Programme 11
Notes on sample code
 In line 41
 the constructor JRadioButton(String text, boolean
selected) receives a string with the text of the button and
a Boolean value indicating that the button should be
selected.
 In lines 46 to 49
 the JRadioButton components are added to a
ButtonGroup object.
 Only one radio button in a button group can be selected
at a time.
 In lines 52 to 54
 setBackground() modifies the background color of the
radio buttons.

Object-Oriented Programme 12
other JRadioButton methods
 void setText(String).
 Modifies the text of the component.
 String getText().
 Obtains the text of the component.
 void setFont(Font).
 Modifies the font of the component.
 void setSelected(boolean b).
 Modifies the button state. The value true changes the
state to selected while the value false changes the state
to deselected.
 boolean isSelected().
 Obtains the button state.

Object-Oriented Programme 13
Component JTextField
 JTextField
 letthe user enter (or edit) a small quantity of text
 Also be used to display small amounts of text

 Class JTextFieldDemo(JTextFieldDemo.java)
creates a window with two JLabel components and
JTextField components.

Object-Oriented Programme 14
Note of sample code
 In lines 44 and 46
 the constructor JTextField(String text, int columns) creates a text
field, ten columns wide, that contains a string. The JTextField class
also contains the constructor JTextField(int columns), which creates
an empty text field.
 In lines 49 and 50
 setBackground() and setForeground() modify the background color
and text color.
 In line 56
 setEditable() makes the text field is un-editable.
 In lines 59 to 71
 two panels are created.
 A label and a text field are added to each panel and then the panels
are added to the frame.
 Note that the default layout of a panel is flow layout.
 In flow layout, each component assumes its preferred size.

Object-Oriented Programme 15
other JTextField methods
 void setText(String).
 Modifies the text of the component.
 String getText().
 Obtains the text of the component.
 void setFont(Font).
 Modifies the font of the component.

 See API document for more

Object-Oriented Programme 16
Component JTextArea
 JTextArea
 let the user enter (or edit) multiple lines of text.
 These components are also used to display blocks of
text.
 Note:
 A JTextArea component does not have scroll bars.
 If scroll bars are needed, the JTextArea is wrapped in a
JScrollPane, which provides the scroll bars.

 Class JTextAreaDemo(JTextAreaDemo.java) creates a


window with two JTextArea components.

Object-Oriented Programme 17
Note of sample code
 In lines 42 and 43
 the constructor JTextArea(String text, int rows, int
columns) creates a 7-by-10 text area that contains a
string.
 In lines 46 to 49
 setBackground() and setForeground() modify the
background color and text color.
 In line 52
 setEditable() makes the text area is un-editable.
 In lines 55 to 60
 each text area is added to a scroll pane and
 the scroll panes are added to the frame.

Object-Oriented Programme 18
When need the scrollbars?
 The constructor JScrollPane(Component view, int
vsbPolicy, int hsbPolicy) creates a pane that
displays the text area.
 The constructor's second and third parameters
indicate if vertical and horizontal scroll bars are
needed.

Object-Oriented Programme 19
Static variables in class JScrollPane
The vertical scroll bar should
VERTICAL_SCROLLBAR_AS_NEEDED only appear if the text does not
fit vertically.
The horizontal scroll bar should
HORIZONTAL_SCROLLBAR_AS_NEEDED only appear if the text does not
fit horizontally.
The vertical scroll bar should
VERTICAL_SCROLLBAR_ALWAYS appear.

The horizontal scroll bar should


HORIZONTAL_SCROLLBAR_ALWAYS appear.

The vertical scroll bar should


VERTICAL_SCROLLBAR_NEVER not appear.

The horizontal scroll bar should


HORIZONTAL_SCROLLBAR_NEVER not appear.
Object-Oriented Programme 20
other JTextArea methods
 void setText(String).
 Modifies the text of the component.
 void append(String).
 Adds the string to the end of the text.
 String getText().
 Obtains the text of the component.
 void setFont(Font).
 Modifies the font of the component.

 See API document for more


Object-Oriented Programme 21
Component JList
 JList
 let the user select one or more elements from a
list.
 Note:
 JList component does not have scroll bars.
 If scroll bars are needed, the JList is wrapped in
a JScrollPane, which provides the scroll bars.

 ClassJListDemo(JListDemo.java ) creates a
window with two JList components.

Object-Oriented Programme 22
Note of sample code
 In lines 43 and 44
 a JList constructor creates a list that displays the elements of the
specified array.
 The class JList also provides a one-argument constructor that takes
an array as the input parameter.
 In lines 47 and 48
 setVisibleRowCount() indicates the number of elements in the JList
that will be visible at any one time.
 In lines 49 and 51
 setSelectionMode() indicates what type of element selection will be
provided to the user.
 SINGLE_SELECTION
 Only one element can be selected at a time.
 SINGLE_INTERVAL_SELECTION
 One contiguous interval of elements can be selected at a time.
 MULTIPLE_INTERVAL_SELECTION
 Multiple intervals of elements can be selected at a time.

Object-Oriented Programme 23
Note of sample code
 In lines 53 to 56
 setFixedCellHeight() and setFixedCellWidth() define the
width and height of the elements.
 In lines 59 to 62
 setBackground() and setForeground() modify the
background color and text color.
 In lines 65 to 70
 each list is added to a scroll pane and then the scroll
panes are added to the frame.
 The constructor JScrollPane(Component view, int
vsbPolicy, int hsbPolicy) creates a pane that displays the
list.
 The constructor's second and third parameters indicate if
vertical and horizontal scroll bars are needed:
Object-Oriented Programme 24
other JList methods
 Object getSelectedValue().
 Obtains the selected element.
 Object[] getSelectedValues().
 Obtains an array of the selected elements.
 int getSelectedIndex().
 Obtains the index of the selected element.
 int[] getSelectedIndices().
 Obtains an array with the indices of the selected elements.
 void clearSelection().
 Clears the user's selection.
 boolean isSelectedIndex(int index).
 Checks if the element at the specified index is selected.
 boolean isSelectionEmpty().
 Returns true if no element is selected.

 See API document for more


Object-Oriented Programme 25
3.2.2 Swing Event Handling
 Class ButtonEventsDemo
 Class FruitListDemo

Object-Oriented Programme 26
Sample code
 Class ButtonEventsDemo(ButtonEventsDemo.java)
 contains three JRadioButtons and a JLabel.
 When a user clicks one of the radio buttons, the
text in the label is updated.
 Only one radio button can be selected at a time
because the radio buttons are grouped.

Object-Oriented Programme 27
inner classes
 In this application, the code that handles the radio
button clicks is separated into three named inner
classes.
 Each inner class implements the interface
ActionListener
 each inner class has a actionPerformed() that
responds to a radio button click.

Object-Oriented Programme 28
Note of sample code:
 In lines 61 to 63
 the method addActionListener registers the listeners for
the radio buttons.
 In lines 84 to 95
 The inner class ListenerOne handles events associated
with buttonOne.
 lines 101 to 112
 The inner class ListenerTwo handles events associated
with buttonTwo.
 lines 118 to 129
 The inner class ListenerThree handles events associated
with buttonThree.

Object-Oriented Programme 29
Sample code
 Class FruitListDemo(FruitListDemo.java) uses three
components: a JList, a JTextArea, and a JButton.
 The JList contains a list of fruits and the JTextArea is initially
empty.
 Usage:
 The user can move a fruit from the list to the text area.
 When the user selects a fruit, the application removes the
selected fruit from the list and adds it to the end of the
text area.
 When the user clicks the button, the application restores
the original list of fruits and clears the text area.

Object-Oriented Programme 30
Note of sample code
 Inner class ButtonListener
 implements the interface ActionListener
 defines an actionPerformed() that responds to a
button click.
 Inner class FruitListListener
 implements the interface ListSelectionListener
 defines a valueChanged() that responds to a list
selection.

Object-Oriented Programme 31
Note of sample code
 In this application, many list-selection events are generated
when a user selects an element in the list:
 one when the user presses the mouse,
 one each time the user drag the mouse
 select another element in the list, and another when the
user releases the mouse.
 getValueIsAdjusting() is used to discern the events:
 it returns true when the mouse is pressed or dragged,
 false when the mouse is released.
 When finished making a selection
 getValueIsAdjusting returns false, method valueChanged
moves the selected fruit from the list to the text area.

Object-Oriented Programme 32
Note of sample code
 In line 47
 a JList constructor creates a list that displays the elements in the
fruitArrayList collection.
 In line 61
 addListSelectionListener() registers the listener for the list.
 In line 64
 addActionListener() registers the listener for the button.
 in lines 109 to 127
 The inner class FruitListListener handles events associated with the
list:
 In line 118
 JList.getSelectedIndex() obtains the index of the fruit the user has
selected.
 In line 120
 the if-statement checks if the user has finished selecting a fruit in the
list.
 In line 121
 JList.getSelectedValue() obtains the name of the selected fruit
 method TextArea.append adds the name to the end of the text area.
Object-Oriented Programme
Object-Oriented Programme 33
Note of sample code
 In line 123
 ArrayList.remove() removes the selected fruit from fruitArrayList.
 In line 124
 JList.setListData() updates the list with the elements in the
fruitArrayList collection, which now contains one less fruit.
 In lines 132 to 146
 The inner class ResetButtonListener handles events associated with
the button.
 In line 141
 setupFruitArrayList() restores the fruitArrayList collection to its
original state.
 In line 142
 JList.setListData() updates the list with the elements in the
fruitArrayList collection, which now contains ten fruits.
 In line 143
 JTextArea.setText() removes all text from the text area.

Object-Oriented Programme 34
3.2.3 Class JFileChooser
 sample application
 uses a file chooser, a dialog box that lets a user browse
the file system
 select a file (or directory) from a list or type in the name
of a file (or directory).
 The class JFileChooser provides this functionality in the
package Swing.
 The dialog box created by JFileChooser is modal( 模态 ).
 When an application opens a modal dialog box, the rest
of the application stops responding to the user so the
user is forced to respond to the dialog box.

Object-Oriented Programme 35
JFileChooser
AJFileChooser can create dialog box for
 opening a file
the open dialog box allows the user to locate a file
 saving a file
save dialog box lets the user specify the directory
where the file will be saved and the name of the saved
file

Object-Oriented Programme 36
Its function
 Class TextEditor lets a user open a text file, edit it, and save
the changed file.
 To open a file
 the user clicks the Open button, which brings up a file chooser
for opening a file. When the user selects a file, the file chooser
closes and the application displays the contents of the file in the
text area.
 The user can edit the text in the text area
 add lines, delete lines, change words, and so on.
 To save the changes
 the user clicks the Save button which brings up another file
chooser, this one for saving a file. When the user specifies a
directory and a name, the file chooser closes and the application
creates a new file that contains the text in the text area.

Object-Oriented Programme 37
Note of the sample code:
 In line 57
 the constructor JFileChooser creates a instance that will present the
contents of the user's default directory when a dialog box is opened.
 In line 58
 setFileSelectionMode() modifies the file chooser so that the user can
only select files.
 In line 83
 showOpenDialog() opens a file chooser for opening a file.
 The argument null indicates that the dialog box should be
displayed in the center of the window.
 If the argument passed to this method is a component, the dialog
box is centered over the specified component.
 showOpenDialog() returns the following values:
 JFileChooser.CANCEL_OPTION if the user clicks the Cancel
button or the Close button in the title bar
 JFileChooser.APPROVE_OPTION if the user selects a file
and clicks the Open button
 JFileChooser.ERROR_OPTION
Object-Oriented Programmeif an error occurs 38
Note of the sample code:
 In line 119
 showSaveDialog() opens a file chooser for saving a file, returns the
following values:
 JFileChooser.CANCEL_OPTION if the user clicks the Cancel
button or the Close button in the title bar
 JFileChooser.APPROVE_OPTION if the user specifies a file
name and clicks the Save button
 JFileChooser.ERROR_OPTION if an error occurs
 In lines 89 and 125
 getSelectedFile() returns a File object with the description of the
specified file.
 The FileReader constructor that takes a File object is used in line 91
to open the file (if the file does not exist, it will be created).
 In lines 89 to 99
 the application creates a BufferedReader, reads the specified file,
and displays the file's contents in the text area.
 In lines 125 to 130
 the application creates a PrintWriter and writes the contents of the
text area to a file with the specified name.
Object-Oriented Programme 39