1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
|
\documentclass{handout}
\csname endofdump\endcsname
\usepackage{minted}
\usepackage{hyperref}
\usepackage[ngerman]{babel}
\usepackage{hyperref}
\geometry{margin=2cm}
\title{Snake Arbeitsauftrag 1}
\setcounter{section}{1}
\begin{document}
\thispagestyle{empty}
\subsection{\faIcon{pencil-alt} Modellierung}
\begin{tabularx}{\textwidth}{p{0.5\textwidth} p{0.4\textwidth}}
\vspace{-5cm}
\begin{itemize}
\item Erstelle ein Klassendiagramm mit allen \textbf{Klassen}, die du im linken Screenshot ausmachen kannst.
\item Notiere die \textbf{Attribute}, die du sehen kannst und die, die Klassen haben müssen.
\item Notiere die \textbf{Methoden}, die die Klassen vermutlich haben.
\item Zeichne und beschrifte die Beziehungen zwischen den Klassen.
\end{itemize}
&
\includegraphics[keepaspectratio, width=0.4\textwidth]{img/snake.png} \\
\end{tabularx}
\begin{defbox}{Minimal Version der ``offensichtliche'' Klassen}
\begin{center}
\begin{tikzpicture}
\begin{class}[text width=4cm]{Schlange}{0,0}
\attribute{richtung}
\attribute{koerperteile}
\operation{bewegen()}
\operation{wachse()}
\end{class}
\begin{class}[text width=4cm]{Essen}{5,0}
\attribute{Position}
\end{class}
\end{tikzpicture}
\end{center}
\end{defbox}
\subsection{\faIcon{desktop} Erste Klassen}
\begin{itemize}
\item Kopiere die \textbf{Snake} BlueJ-Projekt Vorlage aus dem Vorlagen-Verzeichnis.
\item Erzeuge Objekte der bereits vorhandenen Klassen und untersuche ihre Methoden.
\item Erstelle eine neue Klasse \texttt{Schlange}:
\begin{itemize}
\item Ergänze die Klasse Schlange um das Attribut \mintinline{java}{String richtung}.
\item Ergänze die Klasse Schlange um ein Attribut \texttt{kopf} vom Typ \texttt{Rechteck}.
\item Implementiere den \textit{Konstruktor} der Klasse \texttt{Schlange}:
\begin{itemize}
\item Es soll die Position übergeben werden.
\item Die Startrichtung soll \mintinline{java}{"runter"} sein.
\item Erzeuge einen neuen grünen Kopf an der richtigen Position mit der Größe 20x20.
\end{itemize}
\end{itemize}
\end{itemize}
\subsection{\faIcon{desktop} Bewegung der Schlange}
\begin{itemize}
\item Implementiere die Methode \texttt{bewegen} der Schlange.
\item Je nach ihrer Richtung soll sich der Kopf der Schlange um 20 Pixel bewegen. \\
\textbf{Tipp}: Verwende die Methode \mintinline{java}{Verschieben(int deltaX, int deltaY)} der Klasse \texttt{Rechteck}.
\item Erzeuge ein \texttt{Schlangen}-Objekt und verschiebe es über den Bildschirm.
\end{itemize}
\subsection{\faIcon{lightbulb} Wer ruft die Methoden der Klasse Schlange auf?}
Eine Klasse verwaltet das gesamte Spiel, indem sie auf Nutzereingaben reagiert und die richtigen Methoden der anderen Objekte ausführt.
\textbf{Welche Attribute hat diese Klasse?}
\subsection{\faIcon{desktop} Die Spiele Klasse}
\begin{itemize}
\item Erstelle eine neue Klasse \texttt{Snake}:
\begin{itemize}
\item Ergänze die Klasse \texttt{Snake} um ein \textbf{Referenzattribut} \texttt{schlange}.
\item Initialisiere das Attribut \texttt{schlange} im \texttt{Snake} Konstruktor an der Position (380, 280).
\end{itemize}
\end{itemize}
\subsection{\faIcon{desktop} Nutzereingabe}
\begin{defbox}{Nutzereingabe}
\begin{tabularx}{\textwidth}{p{0.65\textwidth} p{0.05\textwidth} p{0.3\textwidth}}
\vspace{1.3cm}
Eine \boldred{Spiel-Engine} nimmt uns die meiste Arbeit ab, indem sie in einer Schleife die Nutzereingabe entgegen nimmt und an unser Spiel zur Verarbeitung weiterleitet. \\[-3cm]
Unser Spiel übernimmt die Verarbeitung und teilt der Spiel-Engine die Veränderungen auf dem Bildschirm mit damit eine neue Ausgabe erzeugt werden kann.
&&
\vspace{-0.5cm}
\begin{tikzpicture}
\node[line width=1pt, draw, minimum width=3cm, rounded corners=5pt] (e) {Eingabe};
\node[line width=1pt, draw, minimum width=3cm, rounded corners=5pt, below=of e] (v) {Verarbeitung};
\node[line width=1pt, draw, minimum width=3cm, rounded corners=5pt, below=of v] (a) {Ausgabe};
\draw[-{Triangle}, line width=1pt] (e) to (v);
\draw[-{Triangle}, line width=1pt] (v) to (a);
\draw[-{Triangle}, line width=1pt, dashed]
(a.east) --
($(a.east) + (0.5, 0)$) --
($(e.east) + (0.5, 0)$) --
(e.east);
\end{tikzpicture} \\[0.5cm]
\end{tabularx}
\end{defbox}
\begin{defbox}{Schnittstelle}
\begin{tabularx}{\textwidth}{p{0.65\textwidth} p{0.05\textwidth} p{0.3\textwidth}}
\vspace{-2cm}
Um in die Schleife integriert zu werden, muss unsere Spiel-Klasse \underline{alle vier} durch das \boldred{Interface} \texttt{Zeichenfenster.AktionsEmpfaenger} vorgegebenen Methoden implementieren. &&
\begin{tikzpicture}
\node[line width=1pt, draw, minimum height=1cm, minimum width=3cm, rounded corners=5pt] (v) {Verarbeitung};
\node[fill=white, line width=1pt, minimum height=1cm, minimum width=3cm, rounded corners=5pt, above=-0.1cm of v] (e) {Eingabe};
\draw[line width=1pt, rounded corners=5pt] ($(v.north west) + (0, 1cm)$) --
($(v.north east) + (0, 1cm)$) --
(v.north east) {[sharp corners] --
($(v.north east) - (0.625cm, 0)$) --
($(v.north east) - (0.6cm, 0.2cm)$) --
($(v.north east) - (0.8cm, 0.2cm)$) --
($(v.north east) - (0.775cm, 0)$) --
($(v.north east) - (1.525cm, 0)$) --
($(v.north east) - (1.5cm, 0.2cm)$) --
($(v.north east) - (1.7cm, 0.2cm)$) --
($(v.north east) - (1.675cm, 0)$) --
($(v.north east) - (2.425cm, 0)$) --
($(v.north east) - (2.4cm, 0.2cm)$) --
($(v.north east) - (2.6cm, 0.2cm)$) --
($(v.north east) - (2.575cm, 0)$)} --
(v.north west) --
($(v.north west) + (0, 1cm)$);
\draw[line width=1pt, red] ($(v.north east) + (0.1cm, 0.2cm)$) --
($(v.north east) - (-0.1cm, 0.3cm)$) --
($(v.north west) - (0.1cm, 0.3cm)$) --
($(v.north west) + (-0.1cm, 0.2cm)$) --
($(v.north east) + (0.1cm, 0.2cm)$);
\node[rotate=90] at ($(v.north west) - (0.3cm, 0.0cm)$) {\boldred{interface}};
\end{tikzpicture} \\
\end{tabularx}
\end{defbox}
\begin{itemize}
\item Ergänze die Klasse \texttt{Snake} um die 4 Methoden des \texttt{AktionsEmpfaenger} Interfaces.
\begin{minted}{java}
public void Ausführen()
public void Taste(char taste)
public void SonderTaste(int taste)
public void Geklickt(int x, int y, int anzahl)
\end{minted}
\item Definiere, dass die Klasse \texttt{Snake} das Interface \texttt{AktionsEmpfaenger} erfüllt.
\begin{minted}{java}
class Snake implements Zeichenfenster.AktionsEmpfaenger
\end{minted}
\item Registriere neue \texttt{Snake}-Objekte als \texttt{AktionsEmpfanger}, indem du den Konstruktor um den Aufruf \mintinline{java}{Zeichenfenster.AktionsEmpfängerEintragen(this);} erweiterst.
\end{itemize}
\subsection{\faIcon{desktop} Steuerung mit der Tastatur}
\begin{itemize}
\item Implementiere die Methode \mintinline{java}{Taste(char taste)}, sodass die Richtung der Schlange angepasst wird.
\begin{itemize}
\item 'W': rauf
\item 'S': runter
\item 'A': links
\item 'D': rechts
\end{itemize}
\item Rufe \mintinline{java}{schlange.bewegen()} in der \texttt{Ausführen}-Methode auf.
\item Teste dein Spiel, indem du ein neues \texttt{Snake}-Objekt erzeugst.
\item \textbf{Für Schnelle:} Implementiert die Schlangensteuerung mit den Pfeiltasten und der Methode \texttt{Sondertaste} (Tipp: die Klasse \href{https://docs.oracle.com/javase/8/docs/api/java/awt/event/KeyEvent.html}{java.awt.event.KeyEvent} hilft).
\end{itemize}
\vfill
Dieses Werk ist lizenziert unter einer \href{https://creativecommons.org/licenses/by-sa/4.0/}{CC BY-SA 4.0} Lizenz \faCreativeCommons\ \faCreativeCommonsBy\ \faCreativeCommonsSa.
\end{document}
|
