May 12, 1998 CS102-01 Lecture 7-3

Building GUIs in Java I

CS 102-01

Lecture 7-3

A picture's worth a thousand words

May 12, 1998 CS102-01 Lecture 7-3

Agenda

• User interface design

• GUIs in Java

• Labels

• Buttons

• Text

May 12, 1998 CS102-01 Lecture 7-3

Building UIs

• Part art, part science– Users: appealing,intuitive and easy-to-use– Developers: Easy to build, easy to maintain

and easy to build on

May 12, 1998 CS102-01 Lecture 7-3

Components Can Barely Contain Themselves

• Components are the building blocks of GUIs (aka widgets or UI widgets)

• Components can’t just be left lying around– Containers are objects which can hold

components– A Container is-a Component which is-a

Object

May 12, 1998 CS102-01 Lecture 7-3

Components in a Nutshell

• Details on Component– public abstract class Component extends Object implements ImageObserver, MenuContainer, Serializable

– super class of: Button, Canvas, Checkbox, Choice, Container, Label, List, Scrollbar, TextComponent

May 12, 1998 CS102-01 Lecture 7-3

Components Capture A Lot

• Track event listeners

• Peer communication

• Popup menus

• Layout features– Sizing– Placement

Check out the Component class documentation

May 12, 1998 CS102-01 Lecture 7-3

Contain Yourself

• Containers hold Componentspublic abstract class Container extends

Component

• Super class of: Panel, ScrollPane, Window

• Remember: An Applet’s a Panel

May 12, 1998 CS102-01 Lecture 7-3

Add It Up

• Components are added to Containers– Components added to a container are

tracked in a list

– Order of the list will define the components' front-to-back stacking order (aka Z-order) within the container

May 12, 1998 CS102-01 Lecture 7-3

Adding Components

add

public Component add(Component comp)Adds the specified component to the end of this container.

Label buttonLabel = new Label(“Nice Button”);

Button pressMe = new Button(“Click here!”);

// Add the components to a container

add(buttonLabel);

add(pressMe);

May 12, 1998 CS102-01 Lecture 7-3

Labeling

• Labels make it easy to put read-only text on the screen– Just one line of text

• Better than drawString()– No pixel values to calculate– Choose alignment (LEFT, CENTER,

RIGHT)– Set fonts for each label– Reusable

May 12, 1998 CS102-01 Lecture 7-3

Building Labels• Label()

– Constructs an empty label.

• Label(String)– Constructs a new label with the specified

string of text, left justified.

• Label(String, int)– Constructs a new label that presents the

specified string of text with the specified alignment.

May 12, 1998 CS102-01 Lecture 7-3

Handy Label Methods• getAlignment()

Gets the current alignment of this label. • getText()

Gets the text of this label.• paramString()

Returns the parameter string representing the state of this label.

• setAlignment(int)

Sets the alignment for this label to the specified alignment.

• setText(String)

Sets the text for this label to the specified text.

May 12, 1998 CS102-01 Lecture 7-3

Read-Only for Whom?

• Users can’t edit text, but you can

• setText() lets you change the text within your program

May 12, 1998 CS102-01 Lecture 7-3

Don’t Forget to Add

• The pattern is:– Build a component

buttonLabel = new Label(“Nice Button”);

– Add it to the containeradd(buttonLabel);

– Paint the container and components (usually automatic)

Someone calls paint()

May 12, 1998 CS102-01 Lecture 7-3

Bad Adding

• Build a component, but don’t add it– Never appears

• Add a component to a non-existent container– Not a problem for us, because we add to

the Applet we’re building

• Adding a not-yet-constructed Component to a Container is bad

May 12, 1998 CS102-01 Lecture 7-3

Button Up!

• Push buttons are handy for clicking– Similar to Submit buttons in HTML forms

• Button is two things:– A label (“Click here”, “Erase disk”)– An event generator

• Use event handling to tie buttons to “the rest of the program”

May 12, 1998 CS102-01 Lecture 7-3

Button Housekeeping

• Java takes care of drawing the button as the user clicks on it

May 12, 1998 CS102-01 Lecture 7-3

public class MyButtons extends Applet { private Button pushButton1, pushButton2;

public void init() { // create buttons pushButton1 = new Button( "Button 1" ); pushButton1.addActionListener( new Button1Handler( this ) ); add( pushButton1 );

pushButton2 = new Button( "Button 2" ); pushButton2.addActionListener( new Button2Handler( this ) ); add( pushButton2 ); }}

Button Events

May 12, 1998 CS102-01 Lecture 7-3

Handling Button1

class Button1Handler implements ActionListener { Applet applet; public Button1Handler( Applet a ) { applet = a; }

public void actionPerformed( ActionEvent e ) { applet.showStatus( "You pressed: " + e.getActionCommand() ); }}

May 12, 1998 CS102-01 Lecture 7-3

Handling Button2

class Button2Handler implements ActionListener { Applet applet;

public Button2Handler( Applet a ) { applet = a; }

public void actionPerformed( ActionEvent e ) { applet.showStatus( "You pressed: " + e.paramString() ); }}

May 12, 1998 CS102-01 Lecture 7-3

TextFields

• Display text– Users can edit, if you let them

• Use setEditable(boolean) to decide whether users can edit

– Still just one line

• A TextField is-a TextComponent, which is-a ___________

May 12, 1998 CS102-01 Lecture 7-3

A Few Good Methods

• Echo characters– echoCharIsSet()– getEchoChar()– setEchoChar(char)

• Columns– setColumns(int) – getColumns()

• Rows?