Last modified by dvd48 on 2020/10/22 11:16
Show last authors
1 (% class="row" %)
2 (((
3 (% class="col-xs-12 col-sm-6" style="text-align:center" %)
4 (((
5 (% style="text-align:center" %)
6 [[image:r14_DasSpiel.gif||alt="Spiel.gif" class="img-rounded"]]
7 )))
8
9 (% class="col-xs-12 col-sm-6" %)
10 (((
11 {{box title="**Inhalt**"}}
12 {{toc /}}
13 {{/box}}
14 )))
15
16 (% class="box infomessage" %)
17 (((
18 Hier lernst du, wie du dein erstes eigenes Spiel programmieren kannst. Tippe auf die Fische und vermeide die Monster.
19 )))
20
21 (% class="row" %)
22 (((
23 (% class="col-xs-12 col-sm-6" %)
24 (((
25 (% class="box" %)
26 (((
27 = 1. Ein neues Projekt erstellen =
28
29 Nachdem du Pocket Code aus dem [[App-Store>>https://apps.apple.com/at/app/pocket-code/id1117935892]] heruntergeladen und installiert hast, erstelle zuerst ein neues Projekt:
30
31 (% style="text-align:center" %)
32 [[image:r01_NeuesProjekt.gif||alt="NeuesProjekt.gif" class="img-rounded"]]
33
34 Vergib einen passenden Namen für dein Projekt und klicke auf OK. Du hast ein neues Projekt erstellt. Das Projekt hat noch keine Figuren oder Hintergründe.
35 )))
36 )))
37
38 (% class="col-xs-12 col-sm-6" %)
39 (((
40 (% class="box" %)
41 (((
42 = 2. Neue Objekte hinzufügen =
43
44 Objekte sind wie deine Figuren bei einem Schauspiel. Hole dir die Bilder aus der **Medienbibliothek**, erstelle sie selbst mit **Pocket** **Paint**, lade sie von deinem **Handy** oder nimm selbst ein **Foto** auf.
45
46 (% style="text-align:center" %)
47 [[image:r02_NeuesObjekt.gif||alt="neues-objekt.gif" class="img-rounded"]]
48
49 Zuerst holen wir uns die **Wellen** aus der Medienbibliothek:
50
51 (% style="text-align:center" %)
52 [[image:Wellen.PNG||alt="wellen.png"]]
53
54 Als nächstes brauchen wir noch einen **Fisch**. Füge ihn aus der Medienbibliothek hinzu.
55
56 Nun solltest du folgendes sehen:
57
58 (% style="text-align:center" %)
59 [[image:FigurenObjekte.PNG||width="300"]]
60 )))
61 )))
62 )))
63
64 (% class="row" %)
65 (((
66 (% class="col-xs-12 col-sm-6" %)
67 (((
68 (% class="box" %)
69 (((
70 = 3. Reihenfolge der Figuren ändern =
71
72 Startest du das Projekt, siehst du, dass sich der Fisch **vor **den Wellen befindet. Das kannst du ändern, in dem du die **Reihenfolge der Figuren **änderst.
73
74 (% style="text-align:center" %)
75 [[image:r03_FigurObjektVerschieben.gif||alt="figuren-verschieben.gif" class="img-rounded"]]
76 )))
77 )))
78
79 (% class="col-xs-12 col-sm-6" %)
80 (((
81 (% class="box" %)
82 (((
83 = 4. Objekt positionieren =
84
85 Nun kannst du dein Objekt programmieren. Wir starten mit der Positionierung deines Objektes.
86
87 (% style="text-align:center" %)
88 [[image:r04_Positionieren.gif||alt="positionierung-objekt.gif" class="img-rounded"]]
89
90 Um die Koordinaten herauszufinden, blende die Achsen ein!
91 Tippe nun auf die Zahl 100 und der Formeleditor öffnet sich. Wähle hier die passenden Koordinaten deiner Figur.
92
93 (% class="box warningmessage" %)
94 (((
95 **Achtung:** Der Mittelpunkt deiner Figur wird an die entsprechende Position gesetzt.
96 )))
97 )))
98 )))
99 )))
100
101 (% class="row" %)
102 (((
103 (% class="col-xs-12 col-sm-6" %)
104 (((
105 (% class="box" %)
106 (((
107 = 5. Mein erstes Skript =
108
109 Skripte sagen deiner Figur, was sie machen soll. Sie bestehen aus einzelnen Bausteinen.
110 Um ein Skript hinzuzufügen, klicke auf die **Figur**, dann auf **Skripte** und dann auf **Plus.**
111
112 (% style="text-align:center" %)
113 [[image:r15_ErstesSkript.gif||alt="15_ErstesSkript.gif"]]
114
115 (% class="box warningmessage" %)
116 (((
117 **Achtung: **Achte auch auf die einzelnen **Werte **und **Einstellungen **in den Bausteinen. Verändere die
118
119 Werte falls die Größe oder Positionierung auf deinem Gerät nicht passend erscheint.
120 [[Hier>>doc:Documentation.BrickDocumentation.WebHome]] bekommst du mehr Informationen zu den einzelnen Bausteinen!
121
122 Starte zwischendurch deine Szene (tippe auf den Play-Button rechts unten), um zu sehen was sich verändert hat!
123 )))
124 )))
125 )))
126
127 (% class="col-xs-12 col-sm-6" %)
128 (((
129 (% class="box" %)
130 (((
131 = 6. Einen Baustein verschieben =
132
133 Um einen Baustein zu **verschieben**, tippe und halte so lange den Baustein, bis dieser etwas größer wird. Nun kannst du ihn an die entsprechende Stelle verschieben:
134
135 (% style="text-align:center" %)
136 [[image:r05_BrickVerschieben.gif||alt="baustein-verschieben.gif"]]
137 )))
138 )))
139 )))
140
141 (% class="row" %)
142 (((
143 (% class="col-xs-12 col-sm-6" %)
144 (((
145 (% class="box" %)
146 (((
147 = 7. Einen Baustein löschen =
148
149 Um einen Baustein zu löschen oder zu kopieren, tippe auf ihn und wähle den entsprechenden Menüpunkt.
150
151 (% style="text-align:center" %)
152 [[image:r06_BrickLoeschen.gif||alt="Baustein-löschen"]]
153 )))
154 )))
155
156 (% class="col-xs-12 col-sm-6" %)
157 (((
158 (% class="box" %)
159 (((
160 = 8. Fisch springt aus dem Wasser =
161
162 Erstelle nun folgendes Skript, um den Fisch aus dem Wasser springen zu lassen:
163
164 (% style="text-align:center" %)
165 [[image:Skript_Fisch.png||alt="Skript-fisch" height="410" width="247"]]
166
167 (% class="box warningmessage" %)
168 (((
169 **Achtung: **Passe die Werte nach deinen Wünschen an!
170
171 Bei **Warte ~_~_ Sekunden** wird zwischen 0,5 und 2 Sekunden gewartet //(siehe Zufallswert).//
172
173 Da der Fisch immer wieder aus dem Wasser springen soll, wurden die entsprechenden Bausteine in eine **Schleife** getan.
174 )))
175
176 Wieder ausprobieren!
177 )))
178 )))
179 )))
180
181 (% class="row" %)
182 (((
183 (% class="col-xs-12 col-sm-6" %)
184 (((
185 (% class="box" %)
186 (((
187 = 9. Fisch wird angetippt und ändert das Aussehen =
188
189 Wir wollen nun, dass der Fisch sein Aussehen ändert, wenn er angetippt wird. Er soll zu einer Explosion werden und sich danach wieder zurück verwandeln.
190
191 (% style="text-align:center" %)
192 [[image:r08_AendereAussehen.gif||alt="Aussehen-ändern.gif"]]
193 )))
194 )))
195
196 (% class="col-xs-12 col-sm-6" %)
197 (((
198 (% class="box" %)
199 (((
200 = 10. Zufallszahl =
201
202 Manchmal will man keinen fixen Wert eingeben, sondern eine beliebige Zahl aus einem definierten Bereich bekommen. Das funktioniert mit der Zufallszahl (random)
203
204 (% style="text-align:center" %)
205 [[image:r07_Zufallszahl.gif||alt="Zufallswert.gif"]]
206
207 (% class="box warningmessage" %)
208 (((
209 **Achtung: **Schreibe die Funktion NICHT rein sondern wähle sie im Formeleditor unter **Mathematik**.
210 )))
211 )))
212 )))
213 )))
214
215 (% class="box successmessage" %)
216 (((
217 **FERTIG! Du hast mit wenigen Bausteinen ein Minispiel erzeugt.**
218
219 Das Spiel ist allerdings noch etwas öd, daher findest du hier mögliche Erweiterungen. Sei einfach kreativ und programmiere drauf los 😀
220 )))
221
222 (% class="row" %)
223 (((
224 (% class="col-xs-12 col-sm-6" %)
225 (((
226 (% class="box" %)
227 (((
228 = Hintergundbild einfügen =
229
230 So fügst du ein Hintergrundbild ein. Du kannst im Hintergrund auch Skripte programmieren, beispielsweise mit einem "Setze Größe auf"-Baustein.
231
232 (% style="text-align:center" %)
233 [[image:r09_Hintergrund.gif||alt="hintergrund.gif" class="img-rounded"]]
234 )))
235 )))
236
237 (% class="col-xs-12 col-sm-6" %)
238 (((
239 (% class="box" %)
240 (((
241 = Monster taucht an Zufallsposition auf =
242
243 Füge ein Monster hinzu. Dieses Monster darf man nicht berühren.
244 So könnte das Skript eines Monsters aussehen, welches aus dem Wasser auftaucht.
245
246 (% style="text-align:center" %)
247 [[image:MOnster.png||alt="skriptMonster.png" height="410" width="206"]]
248
249 (% class="box warningmessage" %)
250 (((
251 **Achtung**: Das Monster taucht auf einer zufälligen x-Position auf. Da es an der gleichen x-Position nach oben und wieder in das Wasser hüpfen soll, brauchen wir hier die Variable **x pos Monster.**
252 )))
253 )))
254 )))
255 )))
256
257 (% class="row" %)
258 (((
259 (% class="col-xs-12 col-sm-6" %)
260 (((
261 (% class="box" %)
262 (((
263 = Score erstellen =
264
265 Wir wollen nun einen Score erstellen. Der Score soll sich bei tippen auf den Fisch um 1 erhöhen und beim antippen des Monsters um 3 verringern.
266
267 (% style="text-align:center" %)
268 [[image:r10_VariableErstellen.gif||alt="Variable erstellen" class="img-rounded"]]
269
270 (% class="box warningmessage" %)
271 (((
272 **Achtung: **Erstelle eine **neue Variable** indem du auf **"neu" tippst** und benenne sie sinnvoll. Die Variable wird von den Figuren geändert, daher muss es eine globale Variable sein. Diese ist **für alle Akteure und Objekte.**
273 )))
274 )))
275 )))
276
277 (% class="col-xs-12 col-sm-6" %)
278 (((
279 (% class="box" %)
280 (((
281 = Score erhöhen und verringern =
282
283 (% style="text-align:center" %)
284 Hier siehst du, wie du den Score beim antippen des Fisches erhöhen kannst:[[image:r11_VariableErhoehen.gif||alt="Variable-erhöhen"]]
285
286 (% class="box warningmessage" %)
287 (((
288 Falls du den Score verringern willst, so wähle bei **Ändere Variable Score um ~_~_** eine entsprechende negative Zahl (z.B. -3)
289 )))
290 )))
291 )))
292 )))
293
294 (% class="row" %)
295 (((
296 (% class="col-xs-12 col-sm-6" %)
297 (((
298 (% class="box" %)
299 (((
300 = Score anzeigen =
301
302 Die Variable soll nun noch angezeigt werden. Dies können wir direkt im Hintergrund einstellen.
303
304 (% style="text-align:center" %)
305 [[image:r13_ZeigeVariable.gif||alt="Zeige-Variable"]]
306 )))
307 )))
308
309 (% class="col-xs-12 col-sm-6" %)
310 (((
311 (% class="box" %)
312 (((
313 = Monster wird angetippt =
314
315 Das Monster soll, wenn es angetippt wird, vor Schadenfreude lachen, größer werden und dir drei Punkte abziehen. Das Skript für das Monster könnte folgendermaßen aussehen:
316
317 (% style="text-align:center" %)
318 [[image:Monster_Antippen.png||alt="skript-monster-antippen" height="400" width="288"]]
319
320 (% class="box warningmessage" %)
321 (((
322 **Achtung: **Erstelle eine **neue Variable** indem du auf **"neu" tippst** und benenne sie sinnvoll. Achte darauf, dass bei beiden Bausteinen dieselbe Variable ausgewählt ist. Du kannst die Anzeige im Baustein vielfältig verändern.
323 )))
324 )))
325 )))
326 )))
327
328 (% class="row" %)
329 (((
330 (% class="col-xs-12 col-sm-6" %)
331 (((
332 (% class="box" %)
333 (((
334 = Weitere Figuren hinzufügen =
335
336 Du kannst nun einen weiteren Fisch hinzufügen, der dir ebenfalls einen Punkt bringen soll, falls er angetippt wird. Das Skript dieses Fisches ist bis auf die Positionierung ident mit dem Skript des ersten Fisches.
337
338 Das Skript könnte so aussehen:
339
340 (% style="text-align:center" %)
341 [[image:Skript_Fisch.png||alt="neue-szene.gif" class="img-rounded" height="400"]]
342
343 (% style="text-align:center" %)
344 [[image:Skript_Fisch2.png||alt="Skript-fisch" height="272" width="241"]]
345 )))
346 )))
347 )))
348 )))