1. A picture's worth a thousand words
Building GUIs in Java I
A picture's worth a thousand words CS
Lecture 7-3 1

2. Agenda
User interface design
GUIs in Java
Labels
Buttons
Text

3. Building UIs Part art, part science Eye for design
Users: appealing,intuitive and easy-to-use
Developers: Easy to build, easy to maintain and easy to build on
Eye for design
Donald Norman’s The Design of Everyday Things
HCI

4. 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

5. 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

6. Components Capture A Lot
Track event listeners
Peer communication
Popup menus
Layout features
Sizing
Placement
Check out the Component class documentation

7. Contain Yourself Containers hold Components
public abstract class Container extends Component
Super class of: Panel, ScrollPane, Window
Remember: An Applet’s a Panel

8. 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

9. 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);

10. 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

11. Building Labels Label() Label(String) Label(String, int)
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.

12. 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.

13. Read-Only for Whom? Users can’t edit text, but you can
setText() lets you change the text within your program

14. Don’t Forget to Add The pattern is: Build a component
buttonLabel = new Label(“Nice Button”);
Add it to the container
add(buttonLabel);
Paint the container and components (usually automatic)
Someone calls paint()

15. 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

16. Button Up! Push buttons are handy for clicking Button is two things:
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”

17. Button Housekeeping
Java takes care of drawing the button as the user clicks on it

18. Button Events 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 ); }

19. 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() ); }

20. 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() ); }

21. 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 ___________

22. A Few Good Methods Echo characters Columns Rows? echoCharIsSet()
getEchoChar()
setEchoChar(char)
Columns
setColumns(int)
getColumns()
Rows?