Department of Computer Science, York University Object Oriented Software Construction 16/09/2015...

Department of Computer Science, York University Object Oriented Software Construction 23-04-19 16:03 1

COSC3311 – Software Design

Decorator Pattern


Text, Scrollbars & Borders

Department of Computer Science, York University

Non-software analogy

Paintings can be hung on the wall with or without frames

Framing or matting are decorations for a painting

Frame, matting and painting form a single visual component that can be hung on the wall


Scrollbar example (cont.)

The motivating example of the Decorator pattern is a graphical user interface toolkit, that lets you add properties like borders or behaviors like scrolling to any user interface component by enclosing the component in another objects that add the border or the scroll capability.


A first design – static inheritance

TEXT_VIEW

TEXT_WITH_SCROLLBAR TEXT_WITH_BORDER

TEXT_SCROLL_AND_BORDER


A first design – proliferation problems

TEXT_VIEW

TEXT_WITH_SCROLLBAR TEXT_WITH_BORDER

TEXT_SCROLL_AND_BORDER

OTHER_DECORATIONS……..


Key insight

Static inheritance requires creating a new class for each additional decorator

We want decorations to be lightweight – i.e. we want to be able to attach and detach decorators at run-time.

“pay as you go” approach – define a simple class (TEXT_VIEW) and add decorations incrementally.


BORDER

draw

Key idea

Object Oriented Software Construction 23-04-19 16:03 8

SCROLL_BAR

draw

TEXT_VIEW

draw


Decorator Pattern

“Attach additional responsibilities to an object dynamically”.

The enclosing object is called a decorator. The decorator conforms to the interface of the

component it decorates so that its presence is transparent to the component's clients. The decorator forwards requests to the component and may perform additional actions (such as drawing a border) before or after forwarding. Transparency allows you to nest decorators recursively, thereby allowing an unlimited number of added responsibilities.


Decorator Pattern


draw*

draw_scroll

draw_border

border_width:REAL

draw+draw+-- component.draw


ROOT_CLASS

class ROOT_CLASS createmake

featurecontents: VISUAL_COMPONENT

-- The component to be drawnmake

localt : TEXT_VIEWs : SCROLL_DECORATORb : BORDER_DECORATOR

docreate t.make("Here is a text")create s.make(t)create b.make(s,1)contents := bcontents.draw -- Display text with decorations

end – makeend -- MAIN



Decorator – Example

Compose a border decorator with a scroll decorator for text view.

a_border_decorator

component a_scroll_decorator

component a_text_view


BON dynamic diagram

1. Create a text view: ROOT_CLASS.make

2. Create a scroll bar: s.make(t)3. s.component := t

3. Create a border decorator: b.make(s,1)

5. decorator_make(s)6. b.component := s

7. b.width := 18. contents := b9. Draw the text view with decorators:

contents.draw10. b.component.draw

11. s.component.draw12. print text

13. draw_scroll_bar14.draw_border


:ROOT_CLASS

contents:VISUAL_COMPONENT

t:TEXT_VIEW

s:SCROLL_BAR

component:VISUAL_COMPONENT

b: BORDER_DECORATOR

component:VISUAL_COMPONENT

width: REAL

text: STRING

1

3,9

2

5, 14

10

11

12

13


Decorator – Example Diagram

VISUAL_COMPONENT *

draw *

TEXT_VIEW +

drawDECORATOR *

component : VISUAL_COMPONENT

SCROLL_DECORATOR +

drawdraw_scroll_bar

BORDER_DECORATOR +

drawborder_widthdraw_border


Decorator – General Structure

COMPONENT *

method *

CONCRETE_COMPONENT +

method

DECORATOR *

component : COMPONENT

CONCRETE_DECORATOR_ A +

method

other_feature

CONCRETE_DECORATOR_B +

method

another_feature


Decorator – Implementation

deferred class COMPONENT feature method deferred end

class CONCRETE_COMP feature method do... end

deferred class DECORATOR feature component : COMPONENT end

class CONCRETE_DECORATOR feature method do pre_actions

component.method post_actions end

Recursively do methodfor next in chain


UML class Diagram


Department of Computer Science, York University Trygve Reenskaug: Semantics of UML Collaboration04/19/23 Slide 18

UML Message Sequence Diagram

:ROOT :TEXT :DECORATOR

create()

fileStarted()

run()

read()

readDone()

write()

writeDone()

runCompleted()

stop()

fileStopped()


Consequences – Advantages

More flexibility than static inheritance – responsibilities can be added and removed at run-time

Easy to add a property twice – e.g. to give a TEXT_VIEW a double border, simply attach two BORDER_DECORATOR.

Avoids feature-laden classes high up the hierarchy. Instead of supporting all forseeable features in a complex class, functionality can be added in a lightweight way – pay as you go.


Consequences – Disadvantages

A decorator and its component are not identical – so cannot compare to the decorator which is just a transparent enclosure.

Changing the skin vs. changing the gutso Use strategy pattern if you need to change the guts.


Demo

Demo decorator.zip

Department of Computer Science, York University Object Oriented Software Construction 16/09/2015...

Documents

Transcript of Department of Computer Science, York University Object Oriented Software Construction 16/09/2015...