powered by 
Wie du ein UML-Klassendiagramm in einer .uml-Datei schreibst, wie du das Diagramm liest und was die UML-Werkstatt damit macht. Zum Nachschlagen; ein Feld zum Ausprobieren steht gleich darunter.
UML Distilled, Martin Fowler, 3. Auflage, Addison-Wesley, 2003. Ein dünnes Buch über die Teile der UML, die man wirklich braucht, mit einem langen Kapitel zu Klassendiagrammen; auf Deutsch als »UML konzentriert«.
Schreib ein Diagramm ins Feld; daneben oder darunter erscheint es, während du tippst. Hier wird nichts gespeichert. Für deine eigenen Diagramme nimmst du eine .uml-Datei in VS Code.
Eine .uml-Datei besteht aus Klassen und Assoziationen, in beliebiger Reihenfolge. Was hinter # steht, ist ein Kommentar. Leere Zeilen sind egal.
# Räume einer Schule class School - name: String + School(name: String) class Room - number: String - seats: int + Room(number: String, seats: int) association rooms: School 1 -- 1..* Room
Die Schlüsselwörter sind Englisch: class, extends, abstract, association. Namen beginnen mit einem Buchstaben und enthalten Buchstaben, Ziffern und _, keine Leerzeichen. Klassen schreibst du groß (Room), Attribute und Methoden so, wie sie in deinem Code heißen.
class Name beginnt eine Klasse. Jede eingerückte Zeile darunter ist ein Attribut oder eine Methode, mit einem Zeichen davor, das sagt, wer sie sehen darf:
| Zeile | Bedeutung |
|---|---|
- seats: int |
ein Attribut: name: Typ. - heißt privat: Nur die Klasse selbst kommt heran. |
+ book(hours: int): boolean |
eine Methode: ihre Parameter in Klammern, nach dem Doppelpunkt der Typ dessen, was sie zurückgibt. + heißt öffentlich. |
+ clear(): void |
void: Die Methode gibt nichts zurück. Den Typ musst du immer angeben. |
+ Room(number: String, seats: int) |
der Konstruktor: heißt wie die Klasse und hat keinen Typ |
Ein # für »geschützt« (protected) gibt es hier nicht, denn # beginnt einen Kommentar.
Die Typen schreibst du wie in Java, auch wenn du in einer anderen Sprache programmierst:
| Typ | Bedeutung |
|---|---|
int, long
|
ganze Zahl |
double, float
|
Kommazahl |
boolean |
wahr oder falsch |
String, char
|
Text, ein einzelnes Zeichen |
List<Room>, Set<Room>, Map<String, Room>
|
eine Liste, eine Menge, ein Dictionary oder Hash; auch ArrayList, Queue, Stack und andere |
int[] |
ein Array |
Room |
jede Klasse aus derselben Datei |
Einen anderen Typ unterstreicht die UML-Werkstatt gelb und fragt, ob eine Klasse fehlt oder der Name falsch geschrieben ist.
Im Diagramm stehen die Namen so, wie dein Programm sie schreibt, damit du beides nebeneinander lesen kannst:
| Sprache | Attribut | Methode, die fragt |
|---|---|---|
| Ruby | free_seats |
available? |
| Python | free_seats |
is_available |
| JavaScript, Dart, Java | freeSeats |
isAvailable |
Eine Methode darf, wie in Ruby, auf ? oder ! enden. Die Prüfungen einer Aktivität nehmen isAvailable, is_available und available? als dieselbe Methode.
extends hinter dem Namen sagt, dass eine Klasse alles von einer anderen erbt. Die Unterklasse schreibt nur hin, was neu ist oder was sie anders macht:
class Vehicle - seats: int + Vehicle(seats: int) + seats(): int class Bicycle extends Vehicle + Bicycle() + seats(): int
Steht eine Methode der Oberklasse noch einmal in der Unterklasse, wie seats() in Bicycle, überschreibt die Unterklasse sie: Ein Fahrrad antwortet auf seine Weise.
Eine Klasse, von der es keine eigenen Objekte geben soll, nur Objekte ihrer Unterklassen, ist abstrakt: class Track (abstract). Im Diagramm steht dann «abstract» über ihrem Namen, und der Name ist kursiv.
Eine Assoziation sagt, dass Objekte einer Klasse Objekte einer anderen kennen:
association name: KlasseA mult -- mult KlasseB
Die Multiplizität steht bei der Klasse, deren Anzahl sie angibt. School 1 -- 1..* Room liest du in beide Richtungen: Eine Schule hat einen oder mehrere Räume, ein Raum gehört zu genau einer Schule.
| Multiplizität | Lies |
|---|---|
1 |
genau eins |
0..1 |
keins oder eins |
* oder 0..*
|
beliebig viele, auch keins |
1..* |
mindestens eins |
4, 2..6
|
genau vier, zwei bis sechs |
Mit -> statt -- kennt nur die linke Klasse die rechte, nicht umgekehrt; im Diagramm hat die Linie dann eine Pfeilspitze:
association queue: Counter 1 -> 0..* Ticket
Im Code wird aus einer Assoziation meist ein Attribut: Die Schule hat eine Liste ihrer Räume. Im Diagramm steht dieses Attribut nicht noch einmal in der Klasse; die Linie sagt es schon.
| Im Diagramm | Bedeutung |
|---|---|
| ein Kasten mit drei Fächern | eine Klasse: oben der Name, in der Mitte die Attribute, unten die Methoden |
| «abstract», der Name kursiv | eine abstrakte Klasse |
| eine Linie mit einem leeren Dreieck | Vererbung; das Dreieck zeigt auf die Oberklasse, die immer darüber steht |
| eine Linie ohne Spitze | eine Assoziation; ihr Name steht kursiv in der Mitte, die Multiplizitäten an den Enden |
| eine Linie mit offener Pfeilspitze | eine Assoziation, die nur in eine Richtung bekannt ist |
Beide zeigen Kästen mit Linien, aber sie beschreiben etwas anderes. Ein ER-Modell beschreibt, was in einer Datenbank gespeichert wird und lange bleibt. Ein Klassendiagramm beschreibt die Objekte eines laufenden Programms: was sie wissen und was sie tun. Darum hat ein Klassendiagramm Methoden und ein ER-Modell nicht. Viele Programme haben beides; dazwischen übersetzt oft eine Bibliothek, ein ORM (Object-Relational Mapping), Objekte in Zeilen einer Tabelle und zurück.
Eine Datei mit der Endung .uml öffnet VS Code mit der UML-Werkstatt.
| Was | Wie |
|---|---|
| Fehler | rot unterstrichen, Warnungen gelb, mit Erklärung unter der Maus; alle im Bereich »Probleme« (StrgShiftM) |
| Diagramm anzeigen | »Klassendiagramm anzeigen« oben rechts im Editor, oder StrgK, dann V. Das Diagramm ändert sich beim Tippen; solange ein Fehler in der Datei ist, zeigt es blass den letzten Stand ohne Fehler und darüber die Fehler. Ein Klick auf einen Fehler springt in seine Zeile. |
| Zoomen | −, + und »Einpassen« über dem Diagramm, oder Strg und das Mausrad |
| Diagramm sichern | »Diagramm als SVG speichern« schreibt name.svg neben die Datei, auf weißem Grund. Eine SVG-Datei, die nicht von der UML-Werkstatt stammt, wird nur nach Rückfrage überschrieben. |
Die UML-Werkstatt ist eine JavaScript-Datei, die auch ohne VS Code läuft. Im Workspace liegt sie im Ordner der Erweiterung; die Quelle ist src/vscode-extensions/uml/core/uml-core.js im Repository des Workspaces.
Merke dir den Pfad zuerst in einer Variablen:
UML=$(ls /workspace/.extensions/hackschule.hackschule-uml-*/core/uml-core.js | tail -1)
Dann schreibt node $UML das Diagramm als SVG oder als JSON, mit allen Klassen, Attributen, Methoden und Assoziationen:
node $UML --svg schule.uml > schule.svg node $UML --json schule.uml
Die Schreibweise der .uml-Dateien gehört zur UML-Werkstatt; die Diagramme folgen der UML.