Creating User Interfaces

Chapter 13CSCI 1302

CSCI 1302 – Creating User Interfaces 2

Outline• Introduction• Common Features of Swing GUI

Components• Buttons

– Icons– Alignments– Text Positions

• Check Boxes• Radio Buttons

CSCI 1302 – Creating User Interfaces 3

Outline• Labels• Text Fields• Text Areas• Combo Boxes• Lists• Scroll Bars• Sliders• Creating Multiple Windows

CSCI 1302 – Creating User Interfaces 4

Introduction• GUI components make up the user

interfaces that you see and use• Java provides many components that

provide a wide variety of functionality

CSCI 1302 – Creating User Interfaces 5

Common Features• All but a few components are

subclasses of JComponent• They share a lot of the same features

and methods, making it easy to learn and use these items

• See Figure 13.2 for a list of common features

• See TestSwingCommonFeatures.java

CSCI 1302 – Creating User Interfaces 6

Buttons• Triggers an action event when clicked• Includes regular buttons, toggle

buttons, check box buttons, and radio buttons

• Common button features are represented in the parent class javax.swing.AbstractButton

• Regular buttons are JButtons

CSCI 1302 – Creating User Interfaces 7

Icons• Small, fixed-size pictures used to

decorate components• Use the ImageIcon class to create icons

from image files:Icon i = new ImageIcon(“photo.gif”);

• Three button icon states: default, pressed, and rollover

• See TestButtonIcons.java

CSCI 1302 – Creating User Interfaces 8

Alignments• Horizontal alignment specifies

horizontally placement on the button• Use setHorizontalAlignment(int) with

the constants LEADING, LEFT, CENTER, RIGHT, TRAILING

• Vertical alignment specifies vertical placement on the button

• Use setVerticalAlignment(int) with the constants TOP, CENTER, BOTTOM

• See Figures 13.7 and 13.8

CSCI 1302 – Creating User Interfaces 9

Text Positions• Specifies text position relative to the

icon• Use setHorizontalTextPosition(int)

with the constants LEADING, LEFT, CENTER, RIGHT, TRAILING

• Use setVerticalTextPosition(int) with the constants TOP, CENTER, BOTTOM

• See note about SwingConstants • See Figures 13.9 and 13.10 and ButtonDemo.java

CSCI 1302 – Creating User Interfaces 10

Check Boxes• Toggle button is a two-state button like

a light switch• Often used to toggle choices on or off• Many options available through

constructors, see Figure 13.14• Fires ItemEvents• Use isSelected() to query selected

state• See CheckBoxDemo.java

CSCI 1302 – Creating User Interfaces 11

Radio Buttons• Enable the user to choose a single

choice out of a group of choices• Must use a ButtonGroup to create groups

of individual radio buttons• Fires ItemEvent, then an ActionEvent • Use isSelected() to query selected

state• See RadioButtonDemo.java

CSCI 1302 – Creating User Interfaces 12

Labels• Display area for short text, images, or

both• See Figure 13.18 for constructors and

methods• Already used in TVFrame.java

CSCI 1302 – Creating User Interfaces 13

Text Fields• Can be used to enter or display a string• Like other components, has many

properties that can be set• Can be editable or not• See TextFieldDemo.java

CSCI 1302 – Creating User Interfaces 14

Text Areas• Used to enter multiple lines of text as

opposed to using multiple text fields• See Figure 13.22 for constructors and

methods• Does not scroll automatically, but can

be contained in a JScrollPane• See TextAreaDemo.java

CSCI 1302 – Creating User Interfaces 15

Combo Boxes• Known as choice or drop-down lists• A list of items from which the user can

choose• Limit’s range of choices, helps input

validation• See Figure 13.25 for constructors and

methods• Can generate ActionEvent and ItemEvent• See ComboBoxDemo.java

CSCI 1302 – Creating User Interfaces 16

Lists• Performs same functions as a combo

box, but enables the user to select both single and multiple values

• See Figure 13.27 for constructors and methods

• Three selection modes: Single, single-interval, and multiple-interval

• Do not scroll automatically• Fires ListSelectionEvent

CSCI 1302 – Creating User Interfaces 17

Scroll Bars

Bubble

Unit increment

Block decrement Block increment

Minimal value Maximal value

Unit decrement

CSCI 1302 – Creating User Interfaces 18

Scroll Bars• orientation – describes if the scroll bar

is displayed horizontally or vertically• maximum – maximum value • minimum – minimum value• visibleAmount (extent) – Relative width

of the scroll bar’s bubble• value – current value of scroll bar• blockIncrement – used in block areas• unitIncrement – used in unit areas

CSCI 1302 – Creating User Interfaces 19

Scroll Bars• When value is changed, fires an AdjustmentEvent to all registered listeners

• Objects notified of changes to the scroll bar’s value must implement the adjustmentValueChanged method in the AdjustmentListener interface

• See ScrollBarDemo.java

CSCI 1302 – Creating User Interfaces 20

Sliders• Similar to scrollbar but more versatile• See Figure 13.33 for constructors and

methods• User can graphically select a value by

sliding a knob within a bounded interval• Fires a ChangeEvent which is passed to

registered listeners who must implement stateChanged in ChangeListener interface

• See SliderBarDemo.java

CSCI 1302 – Creating User Interfaces 21

Creating Multiple Windows• Subwindows can be opened during the

lifetime of a “main” window• Can create an instance of a new

window and make it visible• See MultipleWindowsDemo.java