Haxe dla początkujących/Flash
Tworzenie aplikacji Flashowych z użyciem Haxe jest naprawdę proste. Zobaczmy jak wygląda przykładowy "HelloWorld":
HelloWorld
Poniższy przykład jest prostą prezentacją dostępnych narzędzi.
Test.hx
Zadeklaruj/Stwórz poniższą klasę w nowym pliku o nazwie "Test.hx"
class Test { static function main() { trace("Hello World !"); } }
compile.hxml
Stwórz plik compile.hxml w folderze z pozostałymi plikami projektu.
-swf9 test.swf -main Test
test.swf
W celu skompilowania, wystarczy podwójnie kliknąć na compile.hxml lub opcjonalnie użyć komendy haxe compile.hxml. Jeżeli wystąpią jakieś błędy, zostaną wyświetlone w konsoli.
Jeżeli otrzymujesz błędy w stylu "Standard library not found" lub "Class not found : Test", upewnij się, że Haxe jest w stanie odnaleść:
- biblioteki dostarczone wraz z dystrybucją haxe (Zawartość folderu std)
- nasz plik
Test.hx
Domyślnie Haxe szuka powyższych plików w aktualnym folderze, z którego jest uruchamiany. Oznacza to mniej więcej, że Test.hx i zawartość folderu std muszą być umieszczone wspólnie w miejscu wywołania Haxe.
Istnieje możliwość nadpisania scieżki dostępowej do tych materiałów poprzez ustawienie zmiennej środowiskowej HAXE_LIBRARY_PATH na np. /home/mjs/local/lib/haxe/std:. (zwróć uwage na dwukropek i kropke na końcu scieżki).
Jeżeli dostajesz bład "Invalid class name -swf9 test.swf" zmień kodowanie plików z rozszerzeniami .hxml na ANSI
test.html
Jeżeli wszystko pójdzie bezproblemowo, powinniśmy otrzymać plik wynikowy test.swf. Następnym krokiem będzie stworzenie strony HTML o nazwie test.html,
na której zagnieździmy naszego test.swf. Poniżej można podejrzeć kod przykładowego pliku HTML:
<html> <head><title>Haxe Flash</title></head> <body bgcolor="#dddddd"> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="400" height="300" id="haxe" align="middle"> <param name="movie" value="test.swf"/> <param name="allowScriptAccess" value="always" /> <param name="quality" value="high" /> <param name="scale" value="noscale" /> <param name="salign" value="lt" /> <param name="bgcolor" value="#ffffff"/> <embed src="test.swf" bgcolor="#ffffff" width="400" height="300" name="haxe" quality="high" align="middle" allowScriptAccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> </object> </body> </html>
Po otworzeniu pliku test.html w swojej przeglądarce, powinniśmy otrzymać napis Hello World z informacją o pliku z którego została wywołana komenda oraz
linia w której to nastąpiło.
Rysowanie kwadratu
Jak dotąd używaliśmy jedynie czystego Haxe, bez komend specyficznych dla Flash API. Funkcja trace jest zaimplementowana domyślne do wyświetlania komunikatów na ekranie. Zobaczmy teraz jak stworzyć kwadrat. W tym celu będziemy potrzebowali obszaru do rysowania, który jest nazywany we flashu MovieClip. Zmodyfikuj swój plik Test.hx zgodnie z poniższym kodem :
class Test { static function main() { var mc:flash.display.MovieClip = flash.Lib.current; mc.graphics.beginFill(0xFF0000); mc.graphics.moveTo(50,50); mc.graphics.lineTo(100,50); mc.graphics.lineTo(100,100); mc.graphics.lineTo(50,100); mc.graphics.endFill(); } }
Powyższy kod pobiera aktualny MovieClip i używa Flashowego API do narysowania w nim kwadratu.
Uruchom compile.hxml w celu ponownej kompilacji. Następnie otwórz test.html aby zobaczyć efekt naszej dotychczasowej pracy.
Używanie biblioteki (library)
We flashu swoje materiały (assets: grafika, dźwięki, czcionki ...) przechowujesz wewnątrz abstrakcyjnego kontenera o nazwie "Library". Źródła, które się tam znajdują moga posiadać identyfikator zwany linkage name. Do stworzenia SWF z zawartościa biblioteki można użyć zewnętrznego Flash IDE (np. Flash CS4) lub produktu alternatywnego open source takiego jak SwfMill. W obu przypadkach będziesz w stanie odwołać się z Haxe do poszczególnych obiektów
za pomocą linkage names
Dla przykładu, powiedzmy że masz plik SWF nazwany resource.swf zawierający MovieClip z nazwą linage name button. Zmodyfikuj swój plik Test.hx, w celu wyświetlenia tego zasobu:
class Test { static function main() { var but = flash.Lib.current.attachMovie("button", "but001", 0); but._x = 10; but._y = 20; } }
Powyższy przykład załączy zasób button z naszej biblioteki o głebokości depth 0 i identyfikatorze identifier but001 (może istnieć tylko jeden unikalny obiekt na daną głębokość i identyfikator). Następnie ustalamy pozycję obiektu na ekranie na ._x = 10 oraz ._y = 20. W celu wyświetlenia obiektu potrzebujemy powiedzieć Haxe aby użył resource.swf do przeszukiwania zasobów. Zmodyfikuj plik compile.hxml zgodnie z poniższym kodem:
-swf test.swf -swf-lib resource.swf -main Test
Po całych bolączkach możesz uruchomić compile.hxml aby finalnie skompilować nasz projekt. Plik test.swf utowrzony tym sposobem będzie zawierał całą zawartość resource.swf oraz skompilowany kod Haxe. Możesz przetestować projekt przez otworzenie pliku test.html w dowolnej przeglądarce z zainstalowanym pluginem Flashplayer.
Zwróć uwagę na to że test.swf użyje tych samych parametrów (wysokość, szerokość, kolor tła, wersja flasha, FPS) co użyty resource.swf podczas gdy projekt bez dodatkowych zasobów (w naszym wypadku: resource.swf) użyje domyślnych ustawień Haxe. Jednakże większość tych parametrów (z wyłączeniem FPS i wersji flasha) może być nadpisana w źródłowym kodzie HTML tak jak to zrobiliśmy w nszym pliku test.html.
Zmiana ustawień SWF
Ustawienia SWF mogą być zmienione używająć flagi -swf-header w lini komend. Zmodyfikuj swój plik HXML zgodnie z poniższym kodem:
-swf test.swf -main Test -swf-header 200:300:40:FF0000
Powyższy kod ustawi rozmiar SWF'a na 200x300 pikseli, prędkość na 40 FPS oraz kolor tła na czerwony. Zwróć uwagę na to że rozmiar i kolor tła jest ponownie ustawiany poprzez parametry w HTML.
Możesz również zadeklarować docelową wersje Flash Playera, poprzez użycie flagi -swf-version. Poniżej umieszcono kilka zachowań dla poszczególnych ustawień:
- version 6 : wygeneruje
bytecodedla Flash Playera 6 (wolniejszy ponieważ nie używa rejestru). Pamiętaj o użwaniu klass jedynie dostępnych dla tej wersji Flash Playera. - version 7 : wygeneruje
bytecodedla Flash Playera 7, oraz wyłącze obługę Flash 8 API. - version 8 : wygeneruje
bytecodedla FP8 (taki sam jak dla FP7), jednak włączy obsługę nowego Flash 8 API. - version 9 : użyje Flash Playera 9 wraz z ActionScrip 3 API
Zmiana ustawień bezpieczeństwa sandbox
Jeżeli będziesz chciał aby twój SWF miał dostęp do zasobów sieciowych (nie tych lokalnych/systemowych) możesz ustawić security sandbox dla pliku SWF poprzez dodanie local-with-network
-D network-sandbox
do swojego build.hxml lub lini komend.
Co dalej ?
Jeżeli potrafisz już robić tak proste rzeczy, jedyne co potrzebujesz aby pójść dalej to nauka Flash API (Interfejs Flasha). Haxe jest bardzo konserwatywny jeżeli chodzi o API więc spokojnie możesz korzystać z
domyślnych dokumentacji dla Flash'a
Adobe Livedocs dla Flash 6-8 (zobacz "ActionScript Language Reference") lub Adobe Livedocs dla Flash 9/10 w celu otrzymania pełnej pomocy.
There are some minor differences between Haxe Flash API and ActionScript 2 Flash API, which are listed here :
Istnieją drobne róznice pomiędzy Haxe Flash APi i ActionScript 2 Flash API, które są wymienione poniżej:
- standardowe klasy takie jak
Date,Array,Stringmogą się delikatnie różnić ponieważ w Haxe są one wspólne dla wszystkich platform. Więcej informacji pod linkiem: Haxe API.
- klasy
XMLiXMLNodesą połączone w jedna klase Xml i dostarczają rozszerzone API.
- wszystkie główne klasy Flasha
MovieClip,TextField.. są umieszczone wflashpackage. Musisz więc używaćflash.MovieClipzamiastMovieClip, lub dodajimport flash.MovieClip;na początku swojej klasy.
- używaj
flash.Lib._rootzamiast_root,flash.Lib._globalzamiast_globaliflash.Lib.currentaby mieć dostęp do local root (inny niż_rootjeżeli kod HaXe SWF został załadowany).
Pomimo drobnych różnic pomiędzy platformami, możesz swobodnie używać wszystkich istniejących składowych Flash API (interfejsu Flasha) jeżeli je już znasz.