25
SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OOD Computer Science & Engineering Carl Alphonce [email protected] A Progression of Events

SIGCSE’11 - Workshop #3Pedagogical Progressions for Teaching OOD Computer Science & Engineering Carl Alphonce [email protected] A Progression of Events

Embed Size (px)

Citation preview

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Carl [email protected]

A Progression of Events

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Course

• CS1• Objects-first• Java-based• Design patterns introduced

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Background(what students have been taught)

• object• type (class/interface)• reference• variable– assignment

• method– parameters– return type

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Experience(what students know how to do)

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

EVENT HANDLING

• Objective: be able to apply observer pattern for event handling– start with specific case

(JButton/ActionListener)– broaden perspective to additional

implementations of pattern– goal: students can apply pattern to a

novel instantiation of it

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Lesson: Observer Pattern

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Lesson:Observer Pattern

• Event handling & Observer pattern progressionA. show concrete example (fix: observable, observer, update)B. vary the update (same observable, observer)C. vary the concrete observable (the subject)D. vary the concrete observer

Observer Subject

ActionListener MouseListener KeyListener

JButton 1, 2 4

Timer 3

JPanel 5 6

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Worked Example

• Problem statement– build a button which reacts to a click by

printing “Stop that!”

• Procedure for solving problem1. create button, add to container2. create event handler (class implementing

ActionListener)3. override actionPerformed method to print

“Stop that!”4. attach event handler to button

• Walk through prototype solution• Give similar problem

Low E

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Worked Example:Container Code

package sigcse2011;import javax.swing.JButton;import javax.swing.JFrame;

public class GUI {

public GUI() {JFrame _mainWindow = new JFrame("A simple application");

_mainWindow.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

_mainWindow.pack();_mainWindow.setVisible(true);

}

}In course, code to create a JFrameis familiar from previous examples

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Worked Example:Container Code

package sigcse2011;import javax.swing.JButton;import javax.swing.JFrame;

public class GUI {

public GUI() {JFrame _mainWindow = new JFrame("A simple application");

_mainWindow.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);JButton _button = new JButton("Some text on a button");

_mainWindow.pack();_mainWindow.setVisible(true);

}

}Step #1

Create button, add to container

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Worked Example:Container Code

package sigcse2011;import javax.swing.JButton;import javax.swing.JFrame;

public class GUI {

public GUI() {JFrame _mainWindow = new JFrame("A simple application");

_mainWindow.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);JButton _button = new JButton("Some text on a button");

_mainWindow.getContentPane().add(_button);_mainWindow.pack();_mainWindow.setVisible(true);

}

}Step #1

Create button, add to container

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Worked Example:Event-Handler Code

package sigcse2011;import java.awt.event.ActionEvent;import java.awt.event.ActionListener;

public class ButtonEventHandler implements ActionListener {

public ButtonEventHandler() {}

@Overridepublic void actionPerformed(ActionEvent _) {

}}

Step #2create event handler

(class implementing ActionListener)

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Worked Example:Event-Handler Code

package sigcse2011;import java.awt.event.ActionEvent;import java.awt.event.ActionListener;

public class ButtonEventHandler implements ActionListener {

public ButtonEventHandler() {}

@Overridepublic void actionPerformed(ActionEvent _) {

System.out.println("Stop that!");}

}

Step #3override actionPerformed method

to print message

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Worked Example:Container Code

package sigcse2011;import javax.swing.JButton;import javax.swing.JFrame;

public class GUI {

public GUI() {JFrame _mainWindow = new JFrame("A simple application");

_mainWindow.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);JButton _button = new JButton("Some text on a button");_button.addActionListener(new ButtonEventHandler());_mainWindow.getContentPane().add(_button);_mainWindow.pack();_mainWindow.setVisible(true);

}

}Step #4

attach event handler to button

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

First problem for students

• Problem statement– build a button which reacts to a click by

printing a different message, “That tickles!”

• Procedure for solving problem1. create button, add to container2. create event handler (class implementing

ActionListener)3. override actionPerformed method to print

“That tickles!”4. attach event handler to button

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Worked Example:Event-Handler Code

package sigcse2011;import java.awt.event.ActionEvent;import java.awt.event.ActionListener;

public class ButtonEventHandler implements ActionListener {

public ButtonEventHandler() {}

@Overridepublic void actionPerformed(ActionEvent _) {

System.out.println(”That tickles!");}

}

Step #3override actionPerformed method

to print message

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Second problem for students

• Problem statement– build a button which alternates between the two messages

• More involved example– instance variables– constructor– actionPerformed

• Procedure for solving problem1. create button, add to container2. create event handler (class implementing ActionListener)3. solution steps

a) declare instance variables for two messages,b) define constructor to initialize the variablesc) override actionPerformed method to alternate between two messages

(“swap” code, familiar to students from earlier)

4. attach event handler to button

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

package sigcse2011;// imports not shown to save space

public class Swapper implements ActionListener {private String _current;private String _next;public Swapper(String a, String b) {

_current = a;_next = b;

}@Override public void actionPerformed(ActionEvent e) {

System.out.println(_current);String tmp = _current;_current = _next;_next = tmp;

}}

Still low E: Swap code

done earlier in course too.

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Third problem for students

• Problem statement– build a button which changes title of JFrame (alternating between two

different titles)

• More involved example– instance variables– constructor– actionPerformed– call setTitle on JFrame

• Procedure for solving problem1. create button, add to container2. create event handler (class implementing ActionListener)3. solution steps

a) declare needed instance variablesb) define constructor to initialize instance variablesc) override actionPerformed method to alternate between two titles (call setTitle on

JFrame object)

4. attach event handler to button

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Observing more broadly

• Vary subject with ActionListener– Timer / ActionListener

• Vary observer– Timer w/ActionListener– JButton w/MouseListener– JPanel w/MouseListener– JPanel w/KeyListener– etc.

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Summary: “Faded guidance”

• Worked example• Almost identical exercise (a partially-

worked exercise)• Similar exercise (less guidance, but same

basic framework)• Examples of later exercises

– Timer w/ActionListener– JButton w/MouseListener– JPanel w/MouseListener– JPanel w/KeyListener

• Students eventually integrate in larger project

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Schedule

7:00 Introduction and Background (Michael)

7:20 Example 1: Presentation and Discussion (Carl)

7:40 Group work: Discuss/work out example in small groups

8:10 Present/Discuss a group work example

8:30 Refreshment break

8:50 Example 2: Presentation and Discussion (Dale)

9:10 Group work: Discuss/work out example in small groups

9:40 Present/Discuss a group work example

10:00 Wrap up

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Possible exercise:

• Objective: be able to correctly choose between inheritance and composition

• Assumptions:– inheritance – extension– composition – restriction

• Case study: java.util.Stack

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Possible exercise:

• Objective: be able to apply iterator pattern to process elements of a Collection– use existing iterator of Collection

SIGCSE’11 - Workshop #3 Pedagogical Progressions for Teaching OODC

om

pu

ter

Scie

nce &

En

gin

eeri

ng

Possible exercise:

• Objective: be able to apply iterator pattern to in new situation– implement the iterator pattern for some

novel use– example: define an iterator to read

characters from a file