Aici sunt prezentate diferențele dintre versiunile selectate și versiunea curentă a paginii.
Both sides previous revision Previous revision Next revision | Previous revision | ||
module:10-functii-si-rutine:lectie-02 [2014/04/25 14:24] iparaicu |
module:10-functii-si-rutine:lectie-02 [2016/02/27 21:12] (curent) gchelu [Exercițiu] |
||
---|---|---|---|
Linia 15: | Linia 15: | ||
Astfel, pentru a obține comportamentul dorit de la funcția //mouseClicked//, platforma Khan caută această funcție în codul nostru și o apleleaza de fiecare dată când dăm click. Astfel de funcții sunt și următoarele: //draw//, //mouseMoved//, //mousePressed//, //keyPressed// etc. | Astfel, pentru a obține comportamentul dorit de la funcția //mouseClicked//, platforma Khan caută această funcție în codul nostru și o apleleaza de fiecare dată când dăm click. Astfel de funcții sunt și următoarele: //draw//, //mouseMoved//, //mousePressed//, //keyPressed// etc. | ||
<note important>Dacă scriem greșit numele funcțiilor speciale, platforma Khan nu le va mai apela automat și acestea se vor comporta ca niște funcții normale. </note> | <note important>Dacă scriem greșit numele funcțiilor speciale, platforma Khan nu le va mai apela automat și acestea se vor comporta ca niște funcții normale. </note> | ||
+ | Folosim funcția //draw// și funcții pentru interacțiunile cu mouse-ul și tastatura. | ||
<note> | <note> | ||
- | * În lecția de azi vom folosi funcția //draw// și funcții pentru interacțiunile cu mouse-ul și tastatura. | + | Dacă nu vă amintiți cum se folosesc acestea, uitați-vă în documentația din josul programelor din Khan la categoriile //Mouse// și //Keyboard//. |
- | + | ||
- | * Dacă nu vă amintiți cum se folosesc acestea, uitați-vă în documentația din josul programelor din Khan la categoriile //Mouse// și //Keyboard//. | + | |
- | + | ||
- | * Dacă nu înțelegeți exemplele de acolo, chemați un trainer să vă explice. | + | |
</note> | </note> | ||
Linia 29: | Linia 26: | ||
===== Exemplu ===== | ===== Exemplu ===== | ||
În exemplul de mai jos funcțiile //ellipse// și //mouseClicked// sunt imbricate, pentru că //ellipse// este apelată în corpul funcției //mouseClicked//. | În exemplul de mai jos funcțiile //ellipse// și //mouseClicked// sunt imbricate, pentru că //ellipse// este apelată în corpul funcției //mouseClicked//. | ||
- | <html> | ||
- | <h2><a href="http://www.khanacademy.org/cs/m10_l2_ex1/6307860295188480">M10_L2_ex1</a></h2> <script src="http://www.khanacademy.org/cs/m10_l2_ex1/6307860295188480/embed.js?editor=yes&buttons=yes&author=yes&embed=yes"></script> | ||
- | </html> | ||
+ | {{:module:10-functii-si-rutine:mouseclicked.png?|}} | ||
===== Exercițiu ===== | ===== Exercițiu ===== | ||
- | Modificați programul de mai sus astfel încât atunci când dați click pe jumătatea de sus a ecranului să se deseneze un pătrat galben, iar pe jumătatea de jos un pătrat verde. | + | Creați-vă propriul program în Khan Academy în care să copiați codul din imaginea de mai sus. Apoi modificați programul astfel încât atunci când dați click pe jumătatea de sus a ecranului să se deseneze un pătrat galben, iar pe jumătatea de jos un pătrat verde. |
====== Folosirea funcțiilor imbricate ====== | ====== Folosirea funcțiilor imbricate ====== | ||
Linia 40: | Linia 35: | ||
| | ||
Vrem să scriem un program care desenează pești galbeni, într-un acvariu, când apăsam tasta **G**. | Vrem să scriem un program care desenează pești galbeni, într-un acvariu, când apăsam tasta **G**. | ||
- | * O soluție ar fi următoarea: | + | O soluție ar fi următoarea: |
<code> | <code> | ||
// verificăm că tasta apăsată este G SOLUȚIE GREȘITĂ | // verificăm că tasta apăsată este G SOLUȚIE GREȘITĂ | ||
Linia 50: | Linia 45: | ||
}; | }; | ||
</code> | </code> | ||
- | + | A doua soluție este să folosim funcții imbricate. Astfel, vom construi o funcție //deseneazaPeste// și o vom apela din //keyPressed//. | |
- | * A doua soluție este să folosim funcții imbricate. Astfel, vom construi o funcție //deseneazaPeste// și o vom apela din //keyPressed//. | + | |
<code> | <code> | ||
var deseneazaPeste = function(culoare) { SOLUȚIE CORECTĂ | var deseneazaPeste = function(culoare) { SOLUȚIE CORECTĂ | ||
Linia 74: | Linia 68: | ||
===== Exemplu ===== | ===== Exemplu ===== | ||
Am scris în Khan exemplul analizat mai sus. Programul desenează pești galbeni când apăsam tasta **G** și pești portocalii când dăm **click**. | Am scris în Khan exemplul analizat mai sus. Programul desenează pești galbeni când apăsam tasta **G** și pești portocalii când dăm **click**. | ||
- | <html> | ||
- | <h2><a href="http://www.khanacademy.org/cs/m10_l2_ex2/6291372284837888">M10_L2_ex2</a></h2> <script src="http://www.khanacademy.org/cs/m10_l2_ex2/6291372284837888/embed.js?editor=yes&buttons=yes&author=yes&embed=yes"></script> | ||
- | </html> | ||
+ | {{:module:10-functii-si-rutine:m10_l2_ex2.png?|}} | ||
===== Exercițiu ===== | ===== Exercițiu ===== | ||
- | Completați programul de mai sus astfel încât, pe lângă pești portocalii și galbeni, să deseneze pești roșii când apăsam tasta **R**. | + | După ce ați copiat codul din imaginea de mai sus, completați programul astfel încât, pe lângă pești portocalii și galbeni, să deseneze pești roșii când apăsam tasta **R**. |
====== Task-uri ====== | ====== Task-uri ====== | ||
Linia 91: | Linia 83: | ||
Grădina: | Grădina: | ||
- | * Mergeți în programul creat la recapitulare și copiați funcțiile deseneazaFloare și deseneazaCopac. Lipiți-le în programul de mai jos. (TODO 1) | + | * Mergeți în programul creat la recapitulare și copiați funcțiile //deseneazaFloare// și //deseneazaCopac//. Lipiți-le în programul de mai jos. (TODO 1) |
* În grădină florile cresc la câte 150 de zile și copacii la câte 350 de zile. Simulați creșterea în funcția draw. (TODO 2) | * În grădină florile cresc la câte 150 de zile și copacii la câte 350 de zile. Simulați creșterea în funcția draw. (TODO 2) | ||
* Dorim să putem planta flori când vrem noi, ca să nu mai așteptăm așa multe zile. Completați programul astfel încât când apăsam tasta 'F' să planteze flori, iar când apăsam tasta 'C' să planteze copaci. | * Dorim să putem planta flori când vrem noi, ca să nu mai așteptăm așa multe zile. Completați programul astfel încât când apăsam tasta 'F' să planteze flori, iar când apăsam tasta 'C' să planteze copaci. | ||
Linia 97: | Linia 89: | ||
<h2><a href="http://www.khanacademy.org/cs/m10_l2_ex4/4696938204102656">M10_L2_ex4</a></h2> <script src="http://www.khanacademy.org/cs/m10_l2_ex4/4696938204102656/embed.js?editor=yes&buttons=yes&author=yes&embed=yes"></script> | <h2><a href="http://www.khanacademy.org/cs/m10_l2_ex4/4696938204102656">M10_L2_ex4</a></h2> <script src="http://www.khanacademy.org/cs/m10_l2_ex4/4696938204102656/embed.js?editor=yes&buttons=yes&author=yes&embed=yes"></script> | ||
</html> | </html> | ||
+ | |||
+ | Avioanele: | ||
+ | * Scrieți o funcție //desenAvionD// care apelată desenează un avion orientat spre **dreapta**, pe poziția transmisă prin parametri. | ||
+ | * Scrieți o funcție //desenAvionS// care apelată desenează un avion orientat spre **stânga**, pe poziția transmisă prin parametri. | ||
+ | * Desenați cerul cu trei avioane. Faceți avioanele să zboare pe cer, când vor ajunge la capătul spațiului de desen se vor întoarce și vor zbura în partea cealaltă; vor repeta această mișcare tot timpul. | ||
+ | |||
| | ||
===== Bonus ===== | ===== Bonus ===== | ||
+ | |||
+ | Creați un joc în care un caracter, la alegere, se deplasează într-o cameră unde trebuie să adune puncte. | ||
+ | * Implementați prima oară mișcarea jucătorului (din săgeți). | ||
+ | * Când jucătorul acumulează puncte scorul crește; scrieți scorul pe ecran. | ||
+ | * Scrieți mesajul "Ai câștigat!" pe ecran, după ce jucătorul a adunat toate punctele. | ||
- | ===== Tema ===== | + | ====== Exerciții pentru acasă ====== |
+ | |||
+ | * Terminați exercițiul de la bonus. | ||
+ | * Adăugați in program obstacole și vieți. Vietile scad când jucătorul atinge un obstacol. |