Activity diagrams Inleiding
Dit is de eerste versie van een leertekst over activity diagrams en daarom voor verbetering vatbaar. Aarzel niet om uw commentaar te mailen naar de auteur:
[email protected] Activity diagrams vormen een onderdeel van de verzameling technieken die in UML (Unified Modelling Languange) is opgenomen. Voor het tekenen van activity diagrams kunnen veel softwarepakketten worden gebruikt. De diagrammen in deze tekst zijn getekend met MS Visio. In een activity diagram kan in principe het gedrag van een willekeurig object worden gemodelleerd. In deze tekst ligt de nadruk op het gedrag van computerprogramma’s. Een simpel voorbeeld
In een toestandsdiagram wordt altijd een begintoestand (initial state) getekend door middel van een zwarte stip. Vanuit deze begintoestand worden de activiteiten van het object in de meest logische volgorde beschreven. Het is gebruikelijk ook minimaal een eindtoestand (final state) te tekenen om aan te geven dat het object zijn activiteiten heeft gestaakt. Het symbool voor een eindtoestand is de zwarte stip met het witte randje.
ga aan het werk
ga naar huis
Figuur 1
Bij activity diagrams is sprake van action states en (gewone) states. In deze leertekst wordt uitsluitend gebruikt gemaakt van action states. Dit zijn toestanden waarin sprake is van een actieve handeling, dus niet iets als ‘wachten op’. In bovenstaande figuur is het object een medewerker, waarvan twee activiteiten getekend zijn. Bij een tekening als deze wordt geen rekening gehouden de mogelijkheid dat de medewerker onwel zou kunnen worden en niet naar huis maar naar de dokter gaat. Als het object een computerprogramma is, dan worden de handelingen van het computerprogramma weergegeven en daarbij wordt geen rekening gehouden met stroomuitval of het vastlopen van het programma. Instructies voor Visio (I)
Hier volgen de instructies om de bovenstaande figuur te kunnen tekenen, maar allereerst worden er twee instellingen aangepast. • Kies onder Opties voor Geavanceerd en vink Uitvoeren in modus voor ontwikkelaars aan. • Kies onder UML voor Beeld en schakel de Modelverkenner in. • Kies hierna voor Bestand, Nieuw, Software, UML-modeldiagram en UML-activity diagram.
Activity diagrams versie 1.1 september 2006
1
• • • •
• • • • •
Kies bij het tekenblad voor 100% als dat niet de default-waarde is. Sleep een Initial State naar het tekenblad. Sleep een Action State naar het tekenblad. Sleep een Control flow naar het tekenblad. Laat het beginpunt samenvallen met een van de kruisjes op de Initial State. Pak de pijl bij de punt en draai deze zo dat de pijlpunt samenvalt met een van de kruisjes op de State. Zorg dat ook de tweede action state op het scherm komt. Sleep een Final State en een Control flow naar het tekenblad en doe daarmee wat voor de hand ligt. Dubbelklik op de bovenste action state. Vul bij Naam de tekst ‘ga aan het werk’ in. Zorg op soortgelijke wijze voor de andere tekst.
Het keuzeblok
Misschien heb je er nooit bij stilgestaan maar het nemen van een beslissing en het controleren van iets zijn misschien wel de meest voorkomende handelingen die een mens en een computerprogramma uitvoeren. In het volgende voorbeeld is het werk te zien van iemand die kaartjes controleert.
Check: toegangskaart geldig?
weiger bezoeker nee ja
laat bezoeker toe
Figuur 2
In deze figuur is een Decision (keuzeblok) te zien die in dit voorbeeld het antwoord geeft op de vraag of de toegangskaart geldig is of niet. De handelingen na ja en nee spreken uiteraard voor zichzelf. Omdat het niet gebruikelijk is om meer dan een final state te tekenen, is hier gebruik gemaakt van een Transition (Join) om alles in één final state te laten eindigen. • Teken de figuur, maar nog zonder de woorden ja en nee en ook zonder de Transition (Join). • Klik in de werkbalk bovenaan op het symbool met de hoofdletter A. • Ga naar het werkblad en teken nu een tekstblok op een plek naast wat er al staat. • Klik achter de cursor het woord ja. • Markeer het woord ja en kies in plaats van 12pt voor 8 pt. • Klik zodanig op het tekstblok dat het mogelijk wordt het blok te verkleinen zodat het woord ja er nog net in past. • Verplaats het resultaat naar de gewenste positie. Omdat ja’s en nee’s nog veel vaker nodig zijn, is het kopiëren van een eenmaal gemaakte ja vele malen handiger dan het elke keer opnieuw tekenen ervan.
Activity diagrams versie 1.1 september 2006
2
• • •
Kopieer het tekstblokje en zet de kopie op een veilige plek neer. Verander ja in nee en zorg dat het tekstblokje de juiste minimale grootte krijgt. Verplaats het tekstblokje met nee naar de juiste positie.
De Transition (Join) is standaard niet zo breed als hierboven getekend is. • Sleep een Transition (Join) naar het tekenblad. • Klik erop en beweeg de muiswijzer naar een van de uiteinden. Met behulp van het liggende pijltje dat dan zichtbaar wordt, kan de transition uitgerekt worden. Zorg dat de transition de juiste breedte krijgt. • Maak de tekening af. Opmerkingen 1 Het keuzeblok zou ook onder de action state getekend kunnen worden. De ja- en nee-uitgang moeten dan echter schuin getekend worden en dat leidt tot eindeloos gepruts. Het horizontaal en verticaal tekenen zoals hierboven is veel gemakkelijker. Een ander voordeel is dat de tekening volgens deze aanpak minder snel heel erg lang wordt. 2 Er zijn geen algemeen geaccepteerde conventies op dit gebied. Zo zou men het bovenstaande voorbeeld getekend kunnen zien met gewone states na het keuzeblok. In die states staan dan teksten als toegangskaart geldig en toegangskaart ongeldig en ontbreken de woorden ja en nee. Daarna volgen pas de action states waarin de bezoeker toegelaten c.q. geweigerd wordt. Het moge duidelijk zijn dat een tekening daardoor aanzienlijk meer ruimte in beslag neemt dan in het voorbeeld hierboven. Om die reden hanteren wij de conventie zoals in het bovenstaande voorbeeld en maken we alleen gebruik van action states. Herhaling
Bij het programmeren maakt men altijd onderscheid tussen • sequentie: elkaar opvolgende handelingen zoals in figuur 1 • de keuzestructuur, zoals geïllustreerd in figuur 2 • de herhalingsstructuur, waarbij een herhaling wordt weergegeven. Men zou de kaartjescontroleur na elke bezoeker kunnen deactiveren en weer kunnen activeren voor de volgende bezoeker. Als er een rij bezoekers staat, zou het deactiveren ook pas plaats kunnen vinden nadat de rij verwerkt is. Deze aanpak is in de volgende figuur te zien.
check: toegangskaart geldig?
weiger bezoeker nee ja
laat bezoeker toe
check: zijn er nog meer bezoekers? nee ja
Figuur 3
Activity diagrams versie 1.1 september 2006
3
Het is nogal wat gegoochel om de herhaling te tekenen met minder pijltjes erin en op papier vrijwel niet uit te leggen. Experimenteer op een later tijdstip maar eens. Het is wel handig om een file bij de hand te hebben waarin een aantal moeizaam geconstrueerde zaken als een keuzeblok inclusief de drie control flows en de tekstblokjes met ja en nee klaarstaan. De auteur heeft in de bovenstaande figuur het tweede keuzeblok niet opnieuw getekend maar het eerste gekopieerd en op de juiste plek neergezet. Staat zo’n keuzeblok in een aparte file dan klikt men ergens linksboven het keuzeblok en trekt men met ingedrukte muis een rechthoek om het keuzeblok. Na het loslaten van de muis zijn alle onderdelen gemarkeerd en kan het geheel worden gekopieerd en op een andere plek worden geplakt. Heeft men zo’n keuzeblok nog niet in een aparte file staan, dan kunnen de zes (!) onderdelen ook als groep worden gemarkeerd. Door de SHIFT-toets ingedrukt te houden en achtereenvolgens op elk van de zes onderdelen te klikken wordt het geheel gemarkeerd en kan het gekopieerd worden. •
Teken figuur 3 door figuur 2 als uitgangspunt te nemen en maak ook een aparte file aan om daar een standaardkeuzeblok voor toekomstig gebruik in neer te zetten.
Voorbeeld: controle van gebruikersnaam en wachtwoord
Grote delen van programma’s zijn bedoeld om de interactie met een gebruiker af te handelen. Een bekend voorbeeld is de controle op de juistheid van een gebruikersnaam en het bijbehorende wachtwoord. Zodra de gebruiker na het invullen van de username en het wachtwoord op de login-knop gedrukt heeft, gaat het programma aan het werk. Deze activering zetten we in een tekstblok naast de initial state. Het programma voert vervolgens de volgende stappen uit: 1 hij kijkt of de ingevulde gebruikersnaam voorkomt in de lijst met toegestane gebruikersnamen 2a als dat niet het geval is, zet hij een foutmelding (‘Username en/of wachtwoord onjuist’) op het scherm en beëindigt zijn werk 2b als dat wel het geval is, kijkt hij of het ingevulde wachtwoord hoort bij de gebruikersnaam 3a als dat niet het geval is, zet hij de foutmelding op het scherm en beëindigt zijn werk 3b als dat wel het geval is, verleent hij de gebruiker toegang en beëindigt zijn werk. •
Teken de volgende figuur en vul op een compacte manier de benodigde teksten in. (Een voorbeeld van een compacte weergave is display: errormessage.)
Opmerkingen 1 Een truc om al die lijntjes perfect horizontaal en verticaal te krijgen is de schaal vergroten naar 400%. Het is dan heel eenvoudig om kleine correcties uit te voeren. 2 Een truc om action states zonder tekst te krijgen is het intoetsen van | | Diezelfde truc kan gebruikt worden om ervoor te zorgen dat alle action states even breed zijn. 3 Er is in de onderstaande figuur voor gekozen om na de eerste ja de daaropvolgende action state onder de eerste action state te zetten. Deze manier van tekenen is heel handig als er bijvoorbeeld zes dingen gecontroleerd moeten worden waaraan allemaal voldaan moet zijn. 4 Bij de weergave van schermafhandelingen tekenen we alle acties die worden uitgevoerd nadat op een knop is gedrukt en de eindtoestand is de situatie dat de gebruiker weer op een (andere) knop kan drukken.
Activity diagrams versie 1.1 september 2006
4
Login-knop is ingedrukt
|
| nee ja
|
|
nee ja
|
|
|
|
Figuur 4 Voorbeeld: het kiezen uit een aantal menu’s
Het lezen van deze tekeningen is des te eenvoudiger als men zich aan een standaardlayout houdt. Ontwikkelaars maken daarom altijd extra afspraken die in UML zelf niet terug te vinden zijn. Een afspraak die tot nu toe gehanteerd is, is de wijze waarop het keuzeblok getekend wordt: • aan de rechterkant van een action state • met de ja-uitgang naar onderen • en de nee-uitgang naar rechts. Er zijn situaties waarin men de ja- en de nee-uitgang liever een keer zou verwisselen. Om dat te voorkomen kan men de vraag die voorafgaand aan het keuzeblok gesteld wordt ook tegengesteld formuleren. Men moet er dan wel voor waken geen onnatuurlijke vragen te stellen. Zo mag iemand een boek lenen uit een bibliotheek als hij ingeschreven is, geen openstaande boetes heeft, niet het maximaal toegestane aantal boeken in bezit heeft, enzovoort. Bij deze drie voorwaarden zijn er twee die negatief geformuleerd zijn maar wel op de meest natuurlijke manier. De meest voorkomende situatie waarin de neiging om met de regels de hand te lichten doet zich bij het kiezen uit een aantal menu’s. In de volgende figuur is te zien hoe dat het meest elegant weergegeven kan worden. In zo’n situatie kan het moeilijk zijn om alle handelingen uit elk van de menu’s fatsoenlijk getekend te krijgen. Bij andere UML-technieken is soms een symbool aanwezig waarmee kan worden aangegeven dat de (verdere) detaillering elders getekend is. Bij activity diagrams is daarin niet voorzien en daarom is ervoor gekozen de verwijzing in een action state neer te zetten. •
Teken de figuur door zoveel mogelijk en zo handig mogelijk te kopiëren.
Activity diagrams versie 1.1 september 2006
5
menukeuze-knop is ingedrukt
check: menukeuze 1?
ja
Zie figuur 1
nee
check: menukeuze 2?
ja
Zie figuur 2
nee
check: menukeuze 3?
ja
Zie figuur 3
nee
check: menukeuze 4?
ja
nee
Zie figuur 4
Figuur 5 Een gecompliceerd voorbeeld: een dating site
Veel websites vragen de gebruiker eerst om een aantal gegevens of wensen te specificeren. Op de site van een verzekeringsmaatschappij wordt vervolgens wordt op grond van die gegevens de verzekeringspremie uitgerekend die men zou moeten betalen. In andere situaties worden op grond van die gegevens uit de database de aanwezige objecten geselecteerd die aan de opgegeven eisen voldoen. Bekende voorbeelden zijn de sites van kamerbemiddelingsbureaus en makelaars. Ook dating sites werken volgens dit principe. Hieronder wordt de werking beschreven van een gedeelte van een dating site. De gebruiker specificeert wat hij is (man of vrouw) en wat hij zoekt (man of vrouw). Hij kan een ondergrens en een bovengrens voor de leeftijd opgeven en tenslotte ook nog het land waarin de gezochte woont. Na het indrukken van de Zoek-knop worden de members gezocht die aan de opgegeven eisen voldoen. Deze worden op een pagina afgebeeld waarop onderaan al dan niet geactiveerde knoppen Vorige en Volgende te zien zijn. We gaan er vanuit dat er maximaal 20 members op een pagina afgebeeld kunnen worden. Ten aanzien van het resultaat zijn er de volgende mogelijkheden: • er zijn helemaal geen members die aan de opgegeven eisen voldoen; er verschijnt dan een passende mededeling op het scherm en de genoemde knoppen zijn niet actief • er zijn maximaal 20 members die aan de eisen voldoen; deze worden op de pagina gezet en de genoemde knoppen zijn niet actief • er zijn meer dan 20 members die aan de eisen voldoen; dan worden de eerste 20 op het scherm gezet, blijft de Vorige-knop inactief maar is de Volgende-knop wel actief; bij een keuze voor de volgende pagina wordt de Vorige-knop actief en zal de Volgende-knop actief zijn als er nog een pagina zal zijn. In de volgende figuren wordt deze gang van zaken gemodelleerd. Omdat dit voorbeeld al gecompli-
Activity diagrams versie 1.1 september 2006
6
ceerd genoeg is, is de mogelijkheid om op een member te klikken en meer informatie over die persoon te zien te krijgen weggelaten. Zoals te zien is, blijkt dat één pagina niet genoeg is. Zoek-knop ingedrukt
lees: geslacht zoeker
lees: geslacht gezochte
lees: ondergrens leeftijd
lees: bovengrens leeftijd
lees: land
voer query uit
check: zijn er resultaten? nee
display: geen resultaten
deactiveer Vorige en Volgende
display: resultaten
deactiveer Vorige en Volgende
ja
check: meer dan 20? nee ja
display: eerste pagina
deactiveer Vorige
activeer Volgende
Figuur 6
Nu de eindtoestand bereikt is, kan de gebruiker verschillende knoppen indrukken: Vorige (indien van toepassing), Volgende (indien van toepassing) of een heel andere knop waardoor geheel andere acties dan dit zoeken naar members ondernomen moeten worden. Om te achterhalen welke knop ingedrukt is, wordt een figuur getekend zoals figuur 5 en deze wordt hier niet opnieuw getekend. Hierna staan uitsluitend de figuren voor het geval Vorige of Volgende ingedrukt is.
Activity diagrams versie 1.1 september 2006
7
Vorige-knop is ingedrukt
check: vorige pagina is pagina 1? nee
display: pagina
activeer Vorige en Volgende
ja
display: eerste pagina
deactiveer Vorige
activeer Volgende
Figuur 7
•
Teken nu zelf de benodigde figuur voor het geval de Volgende-knop ingedrukt is.
Opgaven Opgave 1
Onderstaande PHP-code (zie de volgende bladzijde) is onderdeel van een "topvijf systeem" waarin je kunt aangeven wat je favoriete muziek is. a Teken het activity diagram voor overzicht.php. b Stel dat het script wordt uitgebreid om verschillende muziekgenres (pop, house, ..) aan te kunnen. Per genre is er dan een topvijf mogelijk. Hoe komt het activity diagram er dan uit te zien? Opgave 2
Teken een activity diagram voor het volgende werkproces in een theater. Als er een bestelling voor kaarten binnen komt (per telefoon, e-mail, …) dan wordt er standaard een orderformulier aangemaakt. Er is verschil tussen een order van een abonnee of een incidentele order. Bij een incidentele order (die altijd maar voor één voorstelling kan gelden) worden de plaatsen toegewezen en wordt de prijs bepaald. Als de voorstelling al is volgeboekt dan krijgt de klant dat teruggemeld en houdt het proces op. Anders wordt het bedrag van de creditcard afgeboekt. Bij een abonnee worden ook de plaatsen toegewezen maar wordt het bedrag van een bekend rekeningnummer afgeboekt. Een abonnee kan voor meerdere voorstellingen tegelijk kaarten aanvragen. Tegelijkertijd krijgt de klant spaarpunten. In beide gevallen wordt daarna een pakket met folders en kaartjes samengesteld en opgestuurd.
Activity diagrams versie 1.1 september 2006
8
-----------------------overzicht.php ----------------------- include("config.php"); ?>
voeg nummer(s) toe aan de top 5 top5 overzicht...
"; if (mysql_num_rows($res) >= 1) { while ($row = mysql_fetch_array($res)) { $row[nr] = substr($row[nr], 0, 5); echo "$row[nr] $row[titel] - $row[artiest] || wijzigen|| verwijderen
"; } } else { echo "Er zis nog geen top 5."; } ?>
top5 overzicht van de ingezonden nummers...
"; if (mysql_num_rows($res) >= 1) { while ($row = mysql_fetch_array($res)) { $row[id] = substr($row[id], 0, 5); echo "$row[id] $row[artiest] met $row[titel] || verwijderen
"; } } else { echo "Er zijn nog geen ingezonden liedjes."; } ?>
Activity diagrams versie 1.1 september 2006
9