Začínáme s Flash MX 2004 – 26. díl – ovládání pohybu autíčka

V dnešním díle si vyzkoušíme velmi častou, ale neméně zajímavou ukázku v ovládání pohybu objektu, v našem přídě se bude jednat o jízdu autem ve vymezeném prostoru.

Pro dnešek budeme mít za úkol připravit si základ ke hře, kterou bude jízda autíčkem po vytyčené dráze.

Od autíčka budeme chtít, aby jej bylo možné ovládat pomocí šipek na klávesnici, přičemž chceme, aby nám, při stisknuté šipce nahoru, autíčko zrychlovalo vpřed a při stisknuté šipce dolů zrychlovalo vzad. Autíčko bude mít také tu vlastnost, že pokud nebudeme zrychlovat, samo od sebe se po chvíli zastaví.

Dále bude levá a pravá šipka měnit směr pohybu a na konec si přidáme do cesty překážky. Bude se jednat o objekty, na které když autíčko najede, zpomalí se jeho pohyb. V našem případě tak mohou reprezentovat vymezenou dráhu pro jízdu.

Zadání je tedy jasné, pustíme se do práce.

Objekt autíčka

Otevřeme si nový dokument a nejdříve vytvoříme objekt, který bude představovat autíčko. Ti šikovnější si jej mohou nakreslit, my ostatní můžeme importovat již vytvořený obrázek:

 

Klepněte pro větší obrázek

 

Pomocí „File – Import – Import to Stage“ vložíme příslušný obrázek na hlavní scénu. Objekt můžeme zmenšit zhruba na 40% své původní velikosti a poté jej otočíme přední částí vzhůru.

Klikneme pravým tlačítkem myši na vložený obrázek, zvolíme „Convert to Symbol“ a z obrázku vytvoříme MC, který pojmenujeme „auticko“. V okně pro pojmenování a určení druhu objektu nezapomeneme umístit registrační bod (střed vytvářeného objektu) na prostředek.

Klepněte pro větší obrázek

Nezapomeneme na panelu vlastností pojmenovat instanci nově vytvořeného MC, její název bude stejný, tedy „auticko“.

Druhým objektem bude okraj, který nám vymezí oblast, ve které budeme moct s autíčkem jezdit. Vytvoříme si proto na scéně novou vrstvu, kterou přesuneme pod stávající vrstvu s autíčkem a do této nové vrstvy nakreslíme obdélník, jehož střed bude prázdný a bude reprezentovat místo pro pohyb auta.

Klikneme pravým tlačítkem myši na nakreslený obdélník a z menu zvolíme opět „Convert to Symbol“. Nový MC pojmenujeme „okraj“. Znovu nezapomeneme pojmenovat na panelu vlastností tento objekt, zvolíme opět stejný jako MC, tedy „okraj“.

 

Klepněte pro větší obrázek

 

Tímto jsme skončili s kreslením a můžeme se podívat na AS

AS ovládání auta

Klikneme na objekt auta , otevřeme si panel akcí a napíšeme prvních pár řádků:

onClipEvent (load) {
 rychlost = 0;
}

onClipEvent (keyUp) {
 zpomalit = true;
}
onClipEvent (keyDown) {
 zpomalit = false;
}

V prvním případě si ihned po načtení objektu nastavíme proměnnou rychlost na hodnotu „0“. Dále následují dvě události, které nám detekují právě stisknuté a uvolněné tlačítko. Proměnná, kterou tímto měníme, nám poslouží pro automatické zpomalování auta při uvolněné klávese.

Následuje nejdůležitější část skriptu:

onClipEvent (enterFrame) {
 if (Key.isDown(Key.UP)) {
  rychlost += 2;
 }
 if (Key.isDown(Key.DOWN)) {
  rychlost -= 2;
 }
 if (Key.isDown(Key.LEFT) && Math.abs(rychlost)>0.2) {
  this._rotation -= 10;
 }
 if (Key.isDown(Key.RIGHT) && Math.abs(rychlost)>0.2) {
  this._rotation += 10;
 }
 if (zpomalit) {
  rychlost = rychlost/1.5;
 }
 xpozice = Math.sin(_rotation*(Math.PI/180))*rychlost;
 ypozice = Math.cos(_rotation*(Math.PI/180))*rychlost*-1;
 if (this._parent.okraj.hitTest(this._x+xpozice, this._y+ypozice, true)) {
  rychlost = rychlost/20;
 }
 this._x = this._x+Math.sin(_rotation*(Math.PI/180))*rychlost;
 this._y = this._y+Math.cos(_rotation*(Math.PI/180))*rychlost*(-1);
}

V první sadě podmínek testujeme, která tlačítka klávesnice byla stisknutá.  Pokud se jedná o šipku nahoru nebo dolů, zvýšíme hodnotu rychlosti o „2“. Pokud tedy budeme mít stále stisknuté jedno tlačítko, bude nám auto neustále zrychlovat vpřed, nebo vzad. 

Další dvě podmínky testují levou a pravou šipku klávesnice. Navíc zde máme ještě připojenou podmínku, která nám zaručuje, že pokud je hodnota proměnné „rychlost“ větší než „0,2“ můžeme s autem zatáčet. Pokud to obrátíme, nestane se nám tak, že auto stojí a my jej můžeme pomocí šipek otáčet. Podobný styl jízdy auta je velmi nepravděpodobný, nepočítáme-li smyk.

Za podmínkami, které testují stisknuté klávesy, následuje již zmiňovaná funkce pro zpomalení pohybu. Pokud je tedy některá z kláves stisknutá, auto může zrychlovat, jakmile klávesu pustíme, auto začne automaticky zpomalovat.

Následuje část, ve které vypočítáváme nové souřadnice objektu. Pomocí funkcí sinus a cosinus zjistíme aktuální polohu v jednotlivých souřadnicích v závislosti na rychlosti. Protože ale chceme, aby se auto pohybovalo jen ve vymezeném prostoru, musíme zjistit, zda se jeho nové souřadnice nedotýkají objektu „okraj“.

Pokud se tak stane, snížíme výrazně hodnotu rychlosti a zpomalíme tak výsledný pohyb auta. Dále už jen následuje nastavení nové polohy objektu auta a máme hotovo.

Pokud budeme chtít vytvořit složitější dráhu, stačí v objektu „okraj“ dokreslit překážky a můžeme se pustit do jejich zdolávání.

Klepněte pro větší obrázek

V příštím díle ozvučíme naše autíčko, aby zvuk odpovídal ději na ploše, a přidáme si několik vylepšení ohledně opotřebení auta při neopatrné jízdě.

Dnešní ukázku si můžete prohlédnout zde.
Zdrojový soubor je k dispozici zde.

Diskuze (7) Další článek: Ke stažení: betaverze nového Firefoxu, nový BitComet a další

Témata článku: Software, Programování, Pohyb, Flash, Vložený obrázek, Výsledné dílo, Stage, Convert, Pravé tlačítko, Auto, Rychlost, Nové auto, Vytvořený obrázek, Dráha, Zdolávání, Díl, Výsledný pohyb, Levý panel, Sinus, Smyk


Určitě si přečtěte

Modelářský zázrak: Maketa raketoplánu Columbia, která létá jako skutečná raketa

Modelářský zázrak: Maketa raketoplánu Columbia, která létá jako skutečná raketa

** Model raketoplánu Columbia od českého konstruktéra umí i létat ** Obdivuhodný model si vzal 1600 hodin práce ** Podívejte se na fotografie ze stavby a prvního letu

Karel Jeřábek | 25

Při tragické nehodě Tesly Model 3 byl zapnutý autopilot. Neudělal nic, ukázalo vyšetřování

Při tragické nehodě Tesly Model 3 byl zapnutý autopilot. Neudělal nic, ukázalo vyšetřování

** V březnu došlo k tragické nehodě Tesly Model 3 ** NTSB vydala předběžnou vyšetřovací zprávu ** V okamžiku havárie jel vůz v režimu Autopilota

Karel Kilián | 120



Aktuální číslo časopisu Computer

Velký test Wi-Fi mesh

Nejlepší hodinky pro všechny aktivity

Důležité aplikace na cesty

Jak streamovat video na Twitch