Programování flash her – 3 – Vytvoření prvního projektu

25.11.2012 by: Aimia

Dnes si nastavíme si všechny potřebné nástroje pro tvorbu flash her. A vytvoříme náš první projekt. Je toho trochu víc, ale zas tak složité to není. Pokud už umíte používat Flash Develop, můžete tenhle díl klidně přeskočit.

Instalace a nastavení nástrojů

Flex SDK
Takže si stáhněte FlexSDK(http://www.adobe.com/devnet/flex/flex-sdk-download.html), a nakopírujte jej někde na disk(pro příklady budu uvádět c:/utils/flexSDK).

Flash Develop
Dále si stáhněte a nainstalujte Flash Develop(http://www.flashdevelop.org/). Spustěte jej, a v Menu Tools-Program Settings-AS3 Content klikněte na „Installed Flex SDKs“. Kliknutím na přidat přidáte stažené FlexSDK(nastavíte path na c:/utils/FlexSDK). Viz obrázek.
Nastavení Flex SDK

Flash Player
Teď máte nastaveno prostředí Flash Developu pro vývoj. Pro snadnější spouštění projektů si ještě stáhněte nejnovější flash player (http://www.adobe.com/support/flashplayer/downloads.html). ActiveX a Plugin verzi si nainstalujte, debugger nakopírujte někde kde si jej nesmažete, třeba do Program Files.

Flash Player Debugger
Poslední věc kterou teď uděláme je, že nastavíme Flash Debugger jako defaultní spouštěč flash .swf souborů. Budeme to potřebovat, aby se nám hra spouštěla z Flash Developu ve vlastním okně(projektoru), a dala se debugovat. Stačí si kliknout pravým myšítkem na nějaký .swf soubor, v kontext menu zvolit Otevřít v programu-Zvolit výchozí program. Klikněte na procházet a najdětě místo kam jste debugger uložili, klikněte na něj, dejte Otevřít a OK.

Pokud nemáte žádný .swf soubor, stáhněte si tenhle raketa

Teď bysme měli mít nastaveno úplně vše. Doufám že jsem na nic nezapomněl, u sebe už mám prostředí nainstalované dlouho. Kdyby přece jenom, napište do komentářů, a já návod doplním

//

Vytvoření prvního projektu
Teď už přichází ta veselá část. Otevřete Flash develop, klikněte v menu na Project-New project.

Actionscript 2 je už starý, tím se zabývat vůbec nebudeme. Přejdeme rovnou k ActionScript3. Zobrazí se několik typů projektů, pročtěte si je. Jak vidíte můžete s pomocí flash tvořit i mobilní(Mobile AIR) aplikace, desktopové(AIR projector) nebo klasické webové(AS3 Project).

My si vytvořím AS Project with Preloader. Preloader zatím neuvidíme, ten bude důležitý až při nahrávání hry na webu. Ale je dobré ho mít už připravený.

Napište jméno projektu HelloWorld. Pak si nastavte, kde chcete mít projekt vytvořený. Do Package napište něco ve smyslu com.test.helloworld. Package nejsou důležité pro webový projekt, ale pokud byste chtěli hru migrovat na mobilní zařízení, je už důležitá. Klasicky se package pojmenovává podle výrobce(takže něco ve smyslu cz.aimia.hra)

Nakonec zaškrtněte Create Directory for project. A klikněte na OK.

Nový Flash Develop projekt

Projekt je vytvořený, vidíte 3 adresáře:
bin – obsahuje zkompilovanou hru. Po zkompilování se vytvoří ještě adresář obj. Tyhle adresáře jsou generované, do nich nebudeme nic vkládat.
lib – do ní se vkládají cizí knihovny, zatím je prázdná.
src – obsahuje váš kód.

Zatím máme v projektu 2 třídy – Main.as a Preloader.as. Main je hlavní třída, ta se spouští po načtení celé hry do počítače. Musí to být potomek tříd Sprite nebo MovieClip.

Trošku odbočím. Pokud bychom nepoužili preloader, Main se spustí úplně první. Ale když si všimnete kódu v Main.as [Frame(factoryClass=“com.test.helloworld.Preloader“)] tak ten značí že první třída je Preloader. Zatím ji necháme na pokoji, ale obecně dělá to, že načítá flash soubor, dokáže zobrazit jeho průběh a na konci vytvoří Main třídu a spustí váš projekt. Teď nic neuvidíte, protože se flash soubor načte okamžitě. Preloader uvidíte až při načítání hry z webu.

Zatím vás nebudu zbytečně trápit, zkrátka vám stačí, že takto vytvořený projekt spustí po načtení celé flash hry metodu Main.init(). Tohle je náš startovní bod, kde vždy začneme tvořit náš projekt.

Teď už jen připíšeme krátký kód, který nám zobrazí text. Uvádím celou init třídu, ať víte kde přesně jej zapsat. Zbytek kódu jsem neměnil.

1
2
3
4
5
6
7
8
9
10
11
private function init(e:Event = null):void 
{
	removeEventListener(Event.ADDED_TO_STAGE, init);
	// entry point
 
	var tf:TextField = new TextField();
	tf.x = 200;
	tf.y = 200;
	tf.text = "Hello world"
	addChild(tf);
}

Teď už stačí projekt spustit. Stiskněte F5 nebo klikněte na modrou šipku nahoře(vedle textu Debug nebo Release). Pokud máte vše dobře nastaveno, objeví se okno s nápisem Hello world.

Přikládám ještě zazipované zdrojové kódy dnešního dílu. Stačí je rozbalit a kliknout na .as3proj soubor(nebo ve Flash Develop v menu kliknout na Project-Open Project)

Zdrojové kódy: Stáhnout

Comments

28 komentářů to “Programování flash her – 3 – Vytvoření prvního projektu”
  1. bildo napsal:

    Super, tesim se na serial.

  2. Matěj napsal:

    Ahoj,
    z nejakeho duvodu mi funguje vse krome toho ze se mi na konci ne a ne nacist ten napis prosim porad nevim co jsem udelal spatne jestli jsem ten kod mel prepsat protoze ja ho jen zkopiroval.
    Dekuji Matěj

    • Aimia napsal:

      Zkopírovat stačí, nejspíš jsi něco zapomněl nastavit. Stáhni si celý projekt(odkaz viz výš), rozbal a otevři ve Flash Developu, ten funguje. Můžeš porovnat co máš špatně. A nebo mi pošli svůj projekt na info@aimia.cz

      • goly_alpha napsal:

        Ahoj,
        mám problém s tím že když dám F5 nebo tu modrou šipku tak mi to hlásí error na řádku 25 zkopíroval jsem to a asi třikát udělal novej balíček ale pokaždý se mi objevilo to samý a ne tvůj projekt jsem ješťe neskoušel.

  3. Tom napsal:

    Nějak mi to nefunguje, můj i stažený projekt dává hlášku:

    C:\Documents and Settings\Administrator\Dokumenty\FlashDevelop AS3 Project\HelloWorld\src\com\test\helloworld\Main.as(25): col: 27 Error: Call to a possibly undefined method TextField.
    var tf:TextField = new TextField();
    ^
    Build halted with errors (fcsh).
    (fcsh)

    • Aimia napsal:

      Divná chyba, s tou jsem se ještě nesetkal. Zkus si to vygooglit, píšou tam nějaké rady že nějak špatně funguje FlashDevelop parser, někomu to zmizelo po přeuložení souboru… Zkus, kdyby nešlo pošli zdrojáky

    • Agaga napsal:

      Pokud ti ještě nekomu pise chybu col: 27 Error: Call to a possibly undefined method TextField.
      tak chybi na zacatku za package tento import

      import flash.text.TextField;

  4. goly_alpha napsal:

    Ale ten tvůj funguje

    • Aimia napsal:

      Napiš co to píše za error hlášku. Pokud můj případ funguje, porovnej si soubory(třeba v Total Commanderu – Soubor/Porovnat podle obsahu).

  5. Martin napsal:

    Ahoj
    mě nejde spustit ani ten tvůj soubor. Hlásí mi to chybu :Build halted with errors (fcsh). Done(1).
    Poradíš čím to je?
    Díky Martin

    • Aimia napsal:

      Uff, tak to nevím. Zkoušel jsem vygooglit, ale chyb může být víc. Zkus vygooglit a prohledat, třeba tam bude něco k tématu. A víc k té chybě to nevypsalo? Nemáš špatně nastavené Flex SDK? Příklad jsem teď zkoušel a mě to jede. Kdyžtak zkus popsat víc.

  6. Kristián napsal:

    Ahoj, prosím poraď mi píše mi to nějakou chybovou hlášku Patch not found c:/utils/FlexSDK nevím co mám dělat předem díky… Mimochodem skvělý seriál :)).

    • Aimia napsal:

      Ahoj, je to cesta k FlexSDK. Já jej mám nainstalovaný v c:/utils. Změníš to tak, že otevřeš FlashBuilder projekt, klikneš v menu na Project-Properties, záložka SDK, Manage a do instaled SDK přidáš cestu ke svému Flex SDK(to stáhneš zdarma zde http://www.adobe.com/devnet/flex/flex-sdk-download.html).

      • Kristián napsal:

        No díky ale mám windows XP a c:/utils sem na Cčku nikde nenašel a když sem si našel místo propojení tak mi to s červenalo a nešlo to….? Předem díky…

        • Aimia napsal:

          Odpovím, kdyby měl někdo podobný problém. C:/utils je moje složka, kde jsem nakopíroval Flex SDK. Pokud jej máš nainstalovaný jinde, musíš změnit cestu.

  7. Kristián napsal:

    Promiň že tě takhle obtěžuju ale už sem na to přišel ale prozměnu mi to vypisuje chybovou hlášku:Running process: C:\Program Files\FlashDevelop\Tools\fdbuild\fdbuild.exe „C:\Documents and Settings\ChnappiCZ\Plocha\PROGRAMOVÁNÍ\PROGRAMOVÁNÍ – Flash\HelloWorld\HelloWorld.as3proj“ -ipc 04d82992-0459-48f4-8b64-42be19dd2667 -version „4.6.0; 3.1“ -compiler „C:\Documents and Settings\ChnappiCZ\Plocha\PROGRAMOVÁNÍ\PROGRAMOVÁNÍ – Flash\Základní\Flex sdk 4.6\flex_sdk_4.6“ -library „C:\Program Files\FlashDevelop\Library“
    Exception: Could not locate lib\fcsh.jar in Flex SDK.
    Done(1)

  8. Kristián napsal:

    Promiň ale i na toto už sem po dlouhé době přišel od teďka si to pořádně nastuduji než se tě zeptám :))

    • Aimia napsal:

      To je dobrý nápad 🙂 Nic se neděje, tohle jsou klasické krkolomné začátky, než to člověk dostane trochu do ruky. Držím palce ať tím projdeš co nejrychleji 🙂

  9. Kristián napsal:

    Ok, díky docela mě začalo bavit řešit ty problémy a zdá se mi trochu nudné když něco vyzkouším a jde to hnedka 😀 ale má to i svojí dobrou stránku nezabere to tolik času, kterého tolik nemám :). Už jsem u GameLoop a tak mě napadlo že si stím trochu pohraju tak sem chtěl přidat ovládání všemi šipkami. To se mi povedlo, dokonce i změnit směr, ale ať sem zmáčkl jakoukoliv klávesu letělo to stejým směrem je nějaký příkaz aby se mi to pohlo jiným směrem? A taky šli mi nastavit jen 3 směry y,x a y a x. Jsi vážně skvělí učitel :). Předem děkuji.

  10. Kristián napsal:

    Myslel sem to tak, že když zmáčknu šipku nahoru tak aby to letělo nahoru…

  11. ofugy napsal:

    Aby se mohl použít TextField (nehodilo to chybu při kompilaci) musí se přidat u importu na začátku: import flash.text.TextField;

  12. Kuba napsal:

    Nevím kde najít a nainstalovat ten debugger . prosim pomoc . diky

  13. Kuba napsal:

    Nefunguje v okně se pak nic neukáže

Leave a Reply