Gombok. Interaktivitás hozzáadása és haladó animáció. Egy gomb elkészítése

Átírás

1 Gombok Interaktivitás hozzáadása és haladó animáció Az interaktivitás legegyszer bben gombok segítségével valósítható meg Ha a felhasználónak kedve támad, akkor egyszer en rákattint a gombra, amivel beavatkozhat. Egy gomb elkészítése 1

2 Egy egyszer gomb állapotainak elkészítése A gomb fölött az egérkurzor alakja megváltozik Felengedett Érintési Lenyomott Találati 2

3 A gomb találati területének (hit) megadása Egy összetett alakzat esetén a gombhoz tartozó érzékelési területet tudjuk helyettesíteni egy egyszer bb alakzattal. Gomb készítése különösen nagy találati területtel 3

4 Többállapotú gomb ismételt elkészítése, minden állapotban szimbólummal 4

5 5

6 Animált gombok 6

7 7

8 8

9 9

10 Gombok nyomkövetési módjai Az érintési állapotban hangot adó gomb elkészítése Gombként viselkedik Menüként viselkedik 10

11 Folyamatos hangot adó gomb készítése 11

12 Láthatatlan gomb készítése Edit > Cut, Edit > Paste in Center 12

13 Az ActionScript használata A Flash saját programnyelve Olyan utasításokat adunk meg, amelyeket a filmünk követni fog Ebben a leckében csak az alapokkal ismerkedünk meg, a részletes ismertetés jóval kés bb fog megtörténni. Window > Action Eszköztár Keresés és csere Kódtipp mutatása Hibakeresés beállításai Beállítások Utasítás hozzáadása Nyelvtan ellen rzése Elérési út beszúrása Automatikus formázás Kódnavigátor Aktuális kód Kódrészlet kit zése Toolbox (Eszköztár) : Az összes telepített m veletet megtaláljuk, mappákba rendezve Script (Kód) : A m veletek a végrehajtási sorrendjükben jelennek meg. Navigator (Navigátor) : A filmünk összes kódját megtaláljuk Current script (Aktuális kód) : Megmutatja, hogy éppen melyik kódrészletet szerkesztjük Pin Script (Kódrészlet kit zése) : Saját lapot hozhatunk létre egy adott kódrészlethez, hogy ne kelljen mindig kiválasztani az adott objektumot, vagy réteget Options (Beállítások) : További lehet ségek, például bet típus beállítása Reference (Kézikönyv) : A kiválasztott kóddal kapcsolatban kaphatunk segítséget 13

14 Options Add Statement (Utasítás hozzáadása) : "plusz gomb". Ugyanazokat a kódelemeket tartalmazza, mint az eszköztár Find and Find and Replace (Keresés, Keresés és Csere) : Ezekkel a gombokkal kereshetünk ki kódrészleteket, éppen úgy mint egy szövegszerkeszt ben Options Insert Target Path (Elérési út beszúrása) : Egy adott objektumot címezhetünk meg Check Syntax (Nyelvtan ellen rzése) : Megnézhetjük, hogy a kódunk szintaktikailag hibátlen-e. Auto Format (Automatikus formázás) : A kódot áttekinthet bbé teszi Options Show Code Hint (Kódtipp mutatása) : A kódkiegészít segéd bekapcsolása Debug Options (Hibakeresés beállításai) : Töréspontok adhatók meg azokon a helyeken, ahol meg szeretnénk állítani a kód futását View Options (Nézetbeállítások) : szabályozhatjuk a kód megjelenítését Filmrészlet folyamatos ismétlését végz velet elkészítése Edit > Cut, Edit > Paste in Center 14

15 15

16 A képkocka címkéjének átadása a gotoandplay m veletnek 16

17 Gombok hozzáadása egy animációhoz, amelyekkel a lejátszás megállítható és folytatható 17

18 A Lejátszás gomb utasításai on(press){ play(); 18

19 velet hozzáadása egy filmklip példányához A Filmklip parancsai onclipevent (load) { stop(); onclipevent (mousedown) { play(); onclipevent (mouseup) { stop(); 19

20 Viselkedések használata Window > Behaviors Viselkedés beszúrása Viselkedés törlése Objektum neve Beállítások El rébb visz / hátrébb visz velet / viselkedés neve Eseménylista Add Behavior (Viselkedés beszúrása) : A viselkedés kiválasztására szolgál Delete Behavior (Viselkedés törlése) : Eltávolítja a kijelölt viselkedést Event (Esemény) : A viselkedést kiváltó esemény kiválasztása Action (M velet) : A viselkedés nevére duplán kattintva, azt újra beállíthatjuk Weblaphoz kapcsolódó gomb készítése 20

21 Automatikusan legenerálódott a következ kód on (release) { //Goto Webpage Behavior geturl(" "); //End Behavior 21

22 Beágyazott példányok megcímzése 22

23 23

24 24

25 A Leallitas gomb scriptje on (press) { stop(); Játsszuk le A kocsi leáll, de a kerekek tovább forognak. A kód kiegészítése on (press) { stop(); this.kocsi1.elsokerek.stop(); this.kocsi1.hatsokerek.stop(); A Lejatszas gomb scriptje on (press) { play(); this.kocsi1.elsokerek.play(); this.kocsi1.hatsokerek.play(); Egyszer húzható objektum elkészítése 25

26 on (press) { startdrag(this); on (release) { stopdrag(); A Doboz scriptje A húzás területének behatárolása A téglalapot ne lehessen lehúzni a színpadról. on (press) { A téglalap scriptje startdrag(this, true, 0+this._width/2, 0+this._height/2, 550-this._width/2, 400- this._height/2); on (release) { stopdrag(); 26

27 Ellen rizzük, hogy hová esik az objektum Hozzunk létre egy másik, nagyobb objektumot, a téglalapot csak ebben lehessen elengedni. A Doboz scriptje on (press) { startdrag(this, true, 0+this._width/2, 0+this._height/2, 550-this._width/2, 400-this._height/2); on (release) { stopdrag(); if (this.hittest(_parent.keret1)) { trace("rendben"); else{ trace("hiba!"); Módosítás Mivel a szöveg a weblapon nem íródik ki, a téglalapot rossz pozíció esetén ugrasszuk vissza a bal fels sarokba, jó pozíció esetén a keret közepébe. 27

28 A Doboz scriptje on (press) { startdrag(this, true, 0+this._width/2, 0+this._height/2, 550- this._width/2, 400-this._height/2); on (release) { stopdrag(); if (this.hittest(_parent.keret1)) { this._x = _parent.keret1._x; this._y = _parent.keret1._y; else { this._x = this._width/2; this._y = this._height/2; A felhasználó nevének beolvasása változó segítségével NE LEGYEN KIPIPÁLVA!!! A Gomb scriptje on (press) { nextframe(); on (keypress "<Enter>") { nextframe(); 28

29 A Layer 1:1 scriptje stop(); A Layer 1:2 scriptje uzenet.text = "Szia "+fhnev; Változó értékének növelése 29

30 on (press) { szamlalo++; A Gomb scriptje A változó anélkül is változhat, hogy látnánk a színpadon Távolítsuk el a számláló mez t a színpadról! Helyezzünk el egy másik, üzenet nev mez t! on (press) { szamlalo++; A Gomb scriptje uzenet.text = "A kattintások száma: "+szamlalo; Filmklip áttetsz ségének módosítása 30

31 on (press) { klip._alpha = 50; A Gomb scriptje Egy klip áttetsz ségének értékét növel és csökkent gombok elkészítése 31

32 Csökkent gomb on(press){ klip._alpha = klip._alpha-10 Növel gomb on(press){ klip._alpha = klip._alpha+10 Egyedi tulajdonságok létrehozása és módosítása egy filmklipben 32

33 A Labda scriptje onclipevent (enterframe) { this._x += this.speed; Az el re gomb scriptje on(press){ labda1.speed = 5; A hátra gomb scriptje on (press) { labda1.speed = -5; A leállító gomb scriptje on (press) { labda1.speed = 0; A ComboBox összetev kézi feltöltése adatokkal Window > Components 33

34 A ComboBox összetev adatainak megadása ActionScript segítségével A Layer 1:1 scriptje Lista.removeAll(); Lista.addItem("Iskola", " Lista.addItem("Linux", " Lista.addItem("GMail", " ActionScript kód futtatása a ComboBox összetev segítségével A Lista scriptje on (change) { geturl(this.selecteditem.data, "_self"); 34

35 A RadioButton összetev használata 35

36 stop(); A Layer 1:1 scriptje Tovabb.onPress = function() { szoveg = "A továbbított adat: "+radiogroup.selecteddata; nextframe(); A Layer 1:2 scriptje uzenet.text = szoveg; VÉGE 36