CPSC 210

D5: Observer Pattern

🍄 🐘 🦆 🐟 🐍 🦋 🐸 🦖🌳 🌸 🍓 🥒 🍎 🥜🌿

Learning Goals

  • To apply the Observer Design Pattern to a given problem

An interesting thing tells interested objects that something cool happened.

 

SO much coupling!

Strategies?

Interesting
Thing

Interested
Class2

Interested
Class3

Interested
Class1

1

*

1

*

1

*

We make mistakes

We identify our mistakes

We learn from our mistakes

We prevent mistakes

We Evolve Design Patterns

Lessons Learned!

Design Patterns
to the Rescue?

Observer: Motivation

I want arbitrarily many objects to know about a state without knowing anything about these objects.

I want that these objects can be added and removed as they desire.

Intent: To define a one-to-many dependency between objects so that when one object changes state, all its dependents are notified and updated automatically.

The observer pattern allows us to achieve the notification without introducing coupling between the subject and its dependents.

The Observer Pattern

Observer: Motivation (2)

Either the customer wastes time checking product availability or the store wastes resources notifying the wrong customers.

Customer waiting for new product

Observer: Motivation (3)

Would you want to be notified about ALL tweets?

Twitter

You have already used it

  • ...without knowing it
  • Any GUI click is part of the observer pattern 
private class DrawingMouseListener extends MouseAdapter {
  public void mousePressed(MouseEvent e) {
    handleMousePressed(translateEvent(e));
  }
  public void mouseReleased(MouseEvent e) {
    handleMouseReleased(translateEvent(e));
  }
  public void mouseClicked(MouseEvent e) {
    handleMouseClicked(translateEvent(e));
  }
  public void mouseDragged(MouseEvent e) {
    handleMouseDragged(translateEvent(e));
  }
  private MouseEvent translateEvent(MouseEvent e) {
    return SwingUtilities.convertMouseEvent(
        e.getComponent(), e, currentDrawing);
  }
}

Observer

an Observer

An Observer Metaphor

Newspaper kid delivers you the newspapers. Why?

Because you registered!

Newspaper reaches the shop => newspaper boy delivers it to all registered customers

Imagine you don't like this newspaper anymore

You unregister!

Newspaper kid doesn't come anymore

  • Observable: Shop
  • Observer: Customer

Observer Terminology

Observers register with Observable/Subject for getting information about the occurrences of events

Roles: the observer pattern requires us to identify:

  • The observable (or subject): when this object changes state, we want all its dependents to be notified
  • The observer(s): these are the dependents that are to be notified when the observable changes state
  • Kiosk app where users can vote for their fav. color
  • Goal: update pie chart and panel showing number of votes for the fav. color

Example: Color Kiosk

FavoriteColorData

void setData(Color c, int numVotes)

PieChart

void update(Color c, int numVotes)
JFreeChart getChart()

MaxVotesPanel

void update(Color c, int numVotes)

Example: Color Kiosk (2)

Refactoring

0..*

FavoriteColorData

void setData(Color c, int numVotes)
void addObserver(Observer o)
void notifyObservers(Color c, int numVotes)

Observer

void update(Color c, int numVotes)

<<interface>>

MaxVotesPanel

void update(Color c, int numVotes)

PieChart

void update(Color c, int numVotes)
JFreeChart getChart()

Example: Color Kiosk (3)

Refactoring - Part 2

0..*

Observable

void addObserver(Observer o)
void notifyObservers(Color c, int numVotes)

FavoriteColorData

void setData(Color c, int numVotes)

Observer

void update(Color c, int numVotes)

<<interface>>

MaxVotesPanel

void update(Color c, int numVotes)

PieChart

void update(Color c, int numVotes)
JFreeChart getChart()

Lecture Ticket 

Lecture Ticket

  • System with classes from the Composite Lecture Ticket (Leaf, Branch and Offshoot)
  • Now you want to add observation to this system
  • Each time a leaf changes color, you want a MessagePrinter class to print a corresponding message to the console

Observable

MessagePrinter

Observer

addObserver(Observer o)

notifyObservers()

update()

Lecture Ticket (2)

Observable

Lecture Lab

Lecture Lab (1)

Observer

Observer

Observable

Event

(Nothing)

Lecture Lab (2)

Observer

Observer

Observable

0..*

D5: Observer Pattern

The End - Thank You!

Recommended Additional Reading:
https://refactoring.guru/design-patterns/observer

Made with Slides.com