SequentieDiagrammen

Sequence diagram

Een sequentiediagram geeft weer hoe objecten elkaar boodschappen (messages) sturen en op basis daarvan opdrachten uitvoeren om zo samen een taak te volbrengen.

Meestal gebruik je een sequentiediagram om te helpen bij het bepalen in welke klasse een bepaalde methode moet komen, of, op een hoger abstractieniveau, in welk component een bepaalde functionaliteit.

Om te leren hoe een sequentiediagram werkt maken we in dit voorbeeld een diagram van bestaande code. Vaak maak je echter eerst verschillende diagrammen.

We gebruiken als het voorbeeld de code van de digitale klok uit week 1:

Hieronder zie je het klassendiagram van een KlokDisplay die de tijd in uren en minuten kan weergeven en de tijd met een minuut vooruit kan laten lopen aan de hand van de methode tikTijd. De methode updateDisplay laat de tijd zien in de vorm van uren:minuten.

PlantUML broncode voor "Klassendiagram klok"

@startuml

left to right direction
skinparam linetype ortho
skinparam classAttributeIconSize 0
hide circle

class KlokDisplay {
    - display: String
    + tikTijd(): void
    + updateDisplay(): void
}

class NummerDisplay {
    - limiet: int
    - waarde: int
    + increment():void
    + getWaarde(): int
    + getDisplayWaarde(): String
}

KlokDisplay "1" ---> "1 -minuten" NummerDisplay
KlokDisplay "1" ---> "1 -uren" NummerDisplay

@enduml

Klassendiagram met 2 klasse(n) en 2 relatie(s).

Klassen:

• Klasse KlokDisplay met:
  • publieke methode 'tikTijd', zonder parameters, return type void
  • publieke methode 'updateDisplay', zonder parameters, return type void
  • private attribuut 'display' van type String
• Klasse NummerDisplay met:
  • publieke methode 'increment', zonder parameters, return type void
  • publieke methode 'getWaarde', zonder parameters, return type int
  • publieke methode 'getDisplayWaarde', zonder parameters, return type String
  • private attribuut 'limiet' van type int
  • private attribuut 'waarde' van type int

Relaties:

• KlokDisplay heeft een associatie-relatie met naam '1 -minuten' met NummerDisplay
• KlokDisplay heeft een associatie-relatie met naam '1 -uren' met NummerDisplay

Hieronder is de code te zien van de klasse KlokDisplay. De complete code is te vinden in je persoonlijke repository.

public class KlokDisplay {

    private NummerDisplay uren;
    private NummerDisplay minuten;
    private String display;

    public KlokDisplay() {
        uren = new NummerDisplay(24);
        minuten = new NummerDisplay(60);
    }

    public void tikTijd() {
        minuten.increment();
        if (minuten.getWaarde() == 0) {
            uren.increment();
        }
        updateDisplay();
    }

    public void updateDisplay() {
        display =  uren.getDisplay() + ":" + minuten.getDisplay();
    }
}

PlantUML sequentiediagram als Kroki-codeblok

PlantUML broncode voor "Sequentiediagram klok tikTijd"

@startuml
hide footbox
autonumber

participant "klok:\nKlokDisplay" as klok
participant "minuten:\nNummerDisplay" as minuten
participant "uren:\nNummerDisplay" as uren

[-> klok: tikTijd()
klok -> minuten: increment()
klok -> minuten: waarde = getWaarde()

opt waarde == 0
    klok -> uren: increment()
end

klok -> klok: updateDisplay()
klok -> minuten: getDisplayWaarde()
klok -> uren: getDisplayWaarde()
@enduml

Sequentiediagram met 3 deelnemers: klok van het type KlokDisplay, minuten van het type NummerDisplay en uren van het type NummerDisplay.

Interacties:

1. klok ontvangt tikTijd()
2. klok roept minuten.increment() aan
3. klok roept minuten.waarde = getWaarde() aan
4. klok roept uren.increment() aan
5. klok roept klok.updateDisplay() aan
6. klok roept minuten.getDisplayWaarde() aan
7. klok roept uren.getDisplayWaarde() aan

In het onderstaande sequentiediagram zie je het object klok van het type KlokDisplay en de objecten minuten en uren van het type NummerDisplay. Het object klok maakt gebruikt van minuten en uren. Onder elk van deze blokken met de objecten zie je een verticale stippellijn, dat is de life line van het betreffende object.

Het sequence diagram toont wat er gebeurt wanneer je bij het object klok de methode tikTijd aanroept. Bekijk de code en het diagram om de overeenkomsten te zien tussen de objecten, methoden en de volgorde van de calls.

---

Wat gebeurt er in het sequentiediagram bij het aanroepen van tikTijd?

Iets of iemand roept de methode tikTijd aan bij het object klok. Typisch 'iemand', namelijk een (eind)gebruiker, maar het kan ook een (geautomatiseerde) test zijn, een extern systeem via een (REST) API of een ander object binnen het huidige project. De pijl aan de linkerkant van het diagram toont deze message call met de methodenaam erbij. Vervolgens roept klok de methode increment aan bij het object minuten. Daarna roept klok de methode getWaarde aan bij het object minuten en slaat de returnwaarde op in de variabele waarde. klok controleert of waarde gelijk is aan 0. Zo ja, dan roept klok de methode increment aan bij het object uren. Het diagram toont dit met een opt-frame (keuzeopdracht). Vervolgens roept klok bij zichzelf de methode updateDisplay aan. Dit heet een self message call. Tot slot haalt klok de displaywaarden op van minuten en uren.

Bekijk de code en het diagram om de overeenkomsten te zien tussen de objecten, methoden en de volgorde van de calls.

TOELICHTEN = uitLICHTEN + TOEvoegen

Bovenstaande beschrijving is bewust geschreven als een lopende alinea in natuurlijke taal, niet als bullet lijst. Als je zelf een sequence diagram gebruikt in documentatie moet je altijd een toelichting er bij geven. Een plaatje zegt meer dan duizend woorden, zegt men, maar het roept daarmee mogelijk ook nieuwe vragen op. Deze mag je wel (kort) beantwoorden. Dat doe je NIET door alleen te herhalen wat in het diagram staat. En wat ChatGPT of een A11Y plugin bijvoorbeeld al automatisch kan genereren. Een goede toelichting licht onderdelen uit en geeft hier en voegt context toe.