sigcse’11 - workshop #3pedagogical progressions for teaching ood computer science &...
TRANSCRIPT
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