Curs Flash

Conceptul OOP (Object Oriented Programming) [Programare orientata pe obiecte] are la baza impartirea codului programului in obiecte separate, care pot fi si grupate, formand astfel un alt obiect. De exemplu, rotile, cadrul, ghidonul unei biciclete sunt obiecte separate, dar unite formeaza o bicicleta, care si ea poate fi considerata un obiect. La fel si in programarea ActionScript in Flash, textul, figura geometrica, symbolul movie clip, etc., sunt considerate obiecte.
Obiectele sunt definite folosind doi identificatori primari: proprietati si metode
• Proprietatile unui obiect ii definesc caracteristicile acestuia, iar metodele sunt functii (actiuni) aplicate obiectului printr-o anumita proprietate.
De exemplu, obiectul poate fi o "casa", iar "culoare", "ferestre", "usi" pot fi considerate proprietati, si "deschidere", "inchidere" sunt metode. Aplicarea unei metode la un obiect printr-o proprietate s-ar putea traduce prin "deschidere fereastra la casa".

• In programare, "metoda()" este o functie care face parte din definitia unei clase, de aceea se foloseste cu paranteze rotunde.
• Legatura intre obiecte, proprietati si metode se face prin caracterul punct (.).
• Liniile de cod trebuie sa se termine cu un caracter punct-si-virgula (;).
Astfel, exemplul dat anterior (deschidere fereastra la casa) s-ar scrie "casa.fereastra.deschidere();".

Caracteristicile unui obiect se schimba prin proprietatile si metodele pe care le poate avea.
Atribuirea (setarea) unei valori la proprietatea unui obiect se face comform sintaxei:
          obiect.proprietate = valoare;
Aplicarea unei metode se face dupa sintaxa:
          obiect.proprietate.metoda();
De exemplu:
          patrat.width = 100;
- Obiectul este "patrat", proprietatea lui e "width" iar "100" este valoarea care i-se da.
          patrat.graphics.beginFill(0x08fe08);
- Metoda "beginFill()" este aplicata obiectului "patrat" prin proprietatea acestuia "graphics", acestea fiind unite prin caracter punct (.).
- "metoda()" fiind o functie, poate avea unul sau mai multi parametri, care se adauga intre parantezele rotunde.

Unele metode pot fi aplicate direct unui obiect, fara intermediul vreunei proprietati
    De ex.: myClip.gotoAndStop(9);
- "gotoAndStop(9)" muta cadru curent din animatia "myClip" la cadrul 9 si opreste.

• Pe langa obiecte, proprietati si metode; in OOP sunt si elemente cunoscute ca "events" (evenimente). Acestea sunt actiuni care declanjeaza executia unei functii.
De exemplu, apasarea unui buton, sau trecerea cu mouse-ul deasupra unui obiect, sunt evenimente prin care se poate porni executia unei functii.


Pe scurt, in OOP (Programarea Orientata pe Obiecte) se folosesc urmatoarele elemente:
Iata un exemplu practic, in care vor fi folosite elementele prezentate in acest tutorial. Prin apasarea unui buton se va schimba lungimea si pozitia unui patrat.
- Observati cum sunt folosite elementele OOP: obiect, proprietate, eveniment; si cum se face legatura intre obiecte din Scena si script.
1. Deschideti un document Flash nou (ActionScript 3.0) si desenati in scena un patrat.
2 Transformati patratul in Symbol Movie Clip (din meniul Modify -> Convert to Symbol, la Type puneti Movie Clip), apoi dati instantei acestui Movie Clip (patratul din Scena) numele patrat.
  - Numele unei instante se da (se scrie) in panoul Properties, in casuta din partea de sus, unde este "<Instance Name>".
Numele dat astfel unui obiect din Scena este unealta prin care se poate face legatura dintre el si codul ActionScript. Acel nume va reprezenta in script obiectul respectiv.
3 Langa patrat desenati si un cerc (dupa cum se vede in imaginea de mai jos) pe care-l transformati in Buton (din meniul Modify -> Convert to Symbol, la Type alegeti Button), apoi dati-i ca nume de instanta buton (ca la patrat, in casuta din Properties apartinand instantei cerc).
Exemplu intelegere OOP
4. Dati click-dreapta pe primul Cadru din Timeline (la care sunt de fapt create cele 2 obiecte din Scena) si alegeti Actions.
5. In fereastra care se deschide (pt. scriere cod ActionScript) adaugati urmatorul cod AS3:
// Comanda pt. apelarea functiei "setWidth()" cand e apasat (CLICK) obiectul "buton"
buton.addEventListener(MouseEvent.CLICK, setWidth);

// Se defineste functia "setWidth()"
function setWidth(evt)
{
  patrat.width = 115;     // Da o valoare proprietatii "width" (lungime) a obiectului "patrat"
  patrat.y = 100;     // Da o valoare proprietatii "y" (distanta Y, fata de marginea de sus) a obiectului "patrat"
}
6. Apasati "Ctrl+Enter" pentru a vedea rezultatul, prezentarea Flash obtinuta.
Va apare ceva asemanator cu prezentarea urmatoare (apasati click pe buton, cercul galben):
Fisierul FLA cu acest exemplu poate fi descarcat de la: Exemplu intelegere OOP.
- Comanda "addEventListener()" este o functie din ActionScript 3 pentru lucru cu evenimente. Aceasta primeste ca parametrii evenimentul (aici "MouseEvent.CLICK") si functia care va fi apelata cand este produs acel eveniment (aici functia "setWidth()"). Conecteaza evenimentul cu functia , si este adaugata la obiectul "buton" (prin caracterul punct "."), care reprezinta cercul din scena (instanta la care s-a dat numele "buton").
- "MouseEvent.CLICK" este o constanta ce precizeaza exact evenimentul la care se apeleaza functia.
- Functia "setWidth()" executa codul scris intre acoladele ei ( {} ) cand este apelata. Aici sunt doua linii de cod.
          - "patrat.width" - defineste (schimba) valoarea proprietatii "width" (lungime) a obiectului "patrat" (acesta fiind instanta din scena la care s-a dat numele "patrat").
          - "patrat.y" - defineste (schimba) valoarea proprietatii "y" (distanta Y, fata de marginea de sus) a obiectului "patrat".
Despre functii veti putea invata mai multe in lectiile urmatoare; aici e folosita doar pentru intelegerea utilizarii evenimentelor.

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Care tag este element de tip bloc?
<div> <img> <span>
<div>Web Programming and Development</div>
Care cod CSS afiseaza textul subliniat?
font-style: italic; text-decoration: underline; font-weight: 500;
h2 {
  text-decoration: underline;
}
Clic pe functia JavaScript care apeleaza o alta functie dupa un anumit timp.
insertBefore() setTimeout() querySelector()
function someFunction() { alert("CoursesWeb.net"); }
setTimeout("someFunction()", 2000);
Clic pe instructiunea care returneaza numarul total de elemente dintr-un array asociativ.
count($array) count($array, 1) strlen()
$food =["fruits" =>["banana", "mar"), "veggie" =>["ceapa", "rosie"));
$nr_food = count($food, 1);
echo $nr_food;       // 6
Indicati Viitorul Perfect la negativ al verbului din paranteze, in propozitia: "The child (to not play) by Sunday".
has't played haven't been playing will haven't played
The child will haven't played by Sunday.
- Copilul nu s-ar fi jucat pana duminica.
Indicati Viitorul Perfect pentru verbul "contar" (a povesti) la forma "Él".
habrá contado va a contar contaba
Él no habrá contado el cuento.
- El nu ar fi spus povestea.
Intelegere OOP - Object Oriented Programming

Last accessed pages

  1. Curs CSS Online Tutoriale CSS3 (91632)
  2. Viitor perfect si Viitorul perfect continuu - Future perfect and Continuous (16981)
  3. Scoala zeilor (4470)
  4. Blog si Cugetari Personale (82880)
  5. Mini vocabular Englez-Roman (5098)

Popular pages this month

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (5620)
  2. Curs HTML gratuit Tutoriale HTML5 (4903)
  3. Curs PHP MySQL, Tutoriale si Scripturi PHP (4042)
  4. Curs si Tutoriale JavaScript (3931)
  5. Curs CSS Online Tutoriale CSS3 (3769)