手元にソースがあるので、 OpenFL の基本を学ぶ材料として、PiratePig の実装を見て行こう。
プロジェクトの基本構成
まずプロジェクトディレクトリだが次の構成でプロジェクトは作成されているのが見て取れる。
Assets がアプリ用リソースのディレクトリ、 Source がアプリ用のソースコードを置くディレクトリとなっている。
Pirate Pig.hxproj は FlashDevelop という IDE 用のファイルで、 Haxe ではよくつかわれる IDE だ。
project.xml が OpenFL (というよりもベースにしている lime ) で重要なファイルとなる。
上にあげた各ディレクトリは、このファイルで定義されている (ので、パスや名前を変えることもできる) 。
少々発展的な内容になるが、 OpenFL は lime という、また別の haxe ライブラリに依存している。
lime は haxe でのクロスプラットフォームネイティブアプリ開発基盤となるライブラリで、
前回、大変便利に開発環境が整ったのは、だいたいこのライブラリのおかげだ。
次は、PiratePig の project.xml を見ていこう。
プロジェクト設定ファイル
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?xml version="1.0" encoding="utf-8"?> | |
<project> | |
<meta title="Pirate Pig" package="org.openfl.samples.piratepig" version="1.0.0" company="OpenFL Technologies" /> | |
<app path="Export" file="PiratePig" main="piratepig.PiratePig" /> | |
<window width="800" height="600" if="desktop" /> | |
<window width="0" height="0" if="html5" /> | |
<source path="Source" /> | |
<haxelib name="openfl" /> | |
<haxelib name="actuate" /> | |
<ios binaries="armv7" /> | |
<assets path="Assets/fonts" rename="fonts" include="*.ttf" /> | |
<assets path="Assets/images" rename="images" include="*" exclude="icon.svg" /> | |
<icon path="Assets/images/icon.svg" /> | |
<assets path="Assets/sounds" rename="sounds" if="web"> | |
<sound path="3.mp3" id="sound3" /> | |
<sound path="4.mp3" id="sound4" /> | |
<sound path="5.mp3" id="sound5" /> | |
<music path="theme.mp3" id="soundTheme" /> | |
</assets> | |
<assets path="Assets/sounds" rename="sounds" if="html5" /> | |
<assets path="Assets/sounds" rename="sounds" unless="web"> | |
<sound path="3.wav" id="sound3" /> | |
<sound path="4.wav" id="sound4" /> | |
<sound path="5.wav" id="sound5" /> | |
<music path="theme.ogg" id="soundTheme" /> | |
</assets> | |
<section if="release-sign"> | |
<certificate path="path/to/android.keystore" if="android" /> | |
<certificate path="path/to/author.p12" if="blackberry" /> | |
</section> | |
</project> |
さっそく <meta /> タグと <app /> タグが登場するが、ここはあまり説明しなくても迷わないだろう。
それぞれアプリケーションの情報を表すタグと、アプリケーションの基本となる設定のタグだ。
app タグではアプリケーションのエントリポイントなどが指定できる。
PiratePig では priatepig.PiratePig がエントリポイントとなる main クラスとして指定されているのがわかる。
<windows /> タグはアプリケーション実行時のウィンドウサイズなどが指定できるタグだ。
フルスクリーンで起動する場合や解像度の変更などもここで指定する。
もちろん、スマホアプリをターゲットにする場合は縦持ち・横持ちもここで指定することとなる。
<source /> <haxelib /> <icon /> タグもそのままだ。特に <source /> タグでソースコードディレクトリが指定されている。
念のため記しておくと、 haxe のライブラリとして openfl と actuate が指定されている (lime と openfl は、一応は別の存在である) 。
actuate はアニメーション用のライブラリだ。
<assets /> タグでは各種リソース用のディレクトリが指定できる。
ここで使用するファイルまたはディレクトリを登録しておくことで、ソースコード中から openfl.Assets を用いてアクセス可能となる。
PiratePig においては音声ファイルを、うまくプラットフォームに分けて変えているのがわかると思う。
具体的な assets タグの説明については、後で詳しく述べたい。
PiratePig を元にしたプロジェクトファイルの説明は以上になる。
より詳しくは、公式ドキュメントを読むのがよいだろう。
エントリポイントとメインクラスの説明
project.xml でも指定されているとおり、メインクラスは Source/piratepig/PiratePig.hx で定義される
PiratePig クラスだ。
いろいろと書かれている。
PiratePig のゲーム自体に必要なコードが数多く書かれているわけなのだが、必要最小限はどの程度なのだろう?
実は、OpenFL で必要な最小構成は下記に示したコードだけだ。
意外……と、いうか、あっけないほど必要なコードが少ないのが見て取れる。
何しろ super() だけだ。
本当にこれだけでいいのか確認したい場合は、なんなら空のプロジェクトを
lime create openfl:project SomeProject
などで作ってみるとすぐにわかる。 本当にこれだけだ。
OpenFL はこれだけでアプリの基本部分がすべて動く。
それもマルチプラットフォームでだ。
基本的なところを抑えたので、次回は「どうやって画像を表示するか」「画像をどうやってアニメーションさせるか」「どうやってマウス入力を取り扱っているか」の3点を、同じく PiratePig を元にしてみていきたい。
PiratePig クラスだ。
package piratepig; import flash.display.Bitmap; import flash.display.BitmapData; import flash.display.Sprite; import flash.events.Event; import flash.events.KeyboardEvent; import flash.system.Capabilities; import flash.Lib; import openfl.Assets; class PiratePig extends Sprite { private var Background:Bitmap; private var Footer:Bitmap; private var Game:PiratePigGame; public function new () { super (); initialize (); construct (); resize (stage.stageWidth, stage.stageHeight); stage.addEventListener (Event.RESIZE, stage_onResize); } private function construct ():Void { Footer.smoothing = true; addChild (Background); addChild (Footer); addChild (Game); } private function initialize ():Void { Background = new Bitmap (Assets.getBitmapData ("images/background_tile.png")); Footer = new Bitmap (Assets.getBitmapData ("images/center_bottom.png")); Game = new PiratePigGame (); } private function resize (newWidth:Int, newHeight:Int):Void { Background.width = newWidth; Background.height = newHeight; Game.resize (newWidth, newHeight); Footer.scaleX = Game.currentScale; Footer.scaleY = Game.currentScale; Footer.x = newWidth / 2 - Footer.width / 2; Footer.y = newHeight - Footer.height; } private function stage_onResize (event:Event):Void { resize (stage.stageWidth, stage.stageHeight); } }
いろいろと書かれている。
PiratePig のゲーム自体に必要なコードが数多く書かれているわけなのだが、必要最小限はどの程度なのだろう?
実は、OpenFL で必要な最小構成は下記に示したコードだけだ。
package piratepig; import flash.display.Sprite; class PiratePig extends Sprite { public function new () { super (); } }
意外……と、いうか、あっけないほど必要なコードが少ないのが見て取れる。
何しろ super() だけだ。
本当にこれだけでいいのか確認したい場合は、なんなら空のプロジェクトを
lime create openfl:project SomeProject
などで作ってみるとすぐにわかる。 本当にこれだけだ。
OpenFL はこれだけでアプリの基本部分がすべて動く。
それもマルチプラットフォームでだ。
基本的なところを抑えたので、次回は「どうやって画像を表示するか」「画像をどうやってアニメーションさせるか」「どうやってマウス入力を取り扱っているか」の3点を、同じく PiratePig を元にしてみていきたい。