現在、プログラミングの非常に有望な方向は、クロスプラットフォーム開発です。 さまざまな手段（Appcelerator Titanium、PhoneGap、moSync）に慣れてきたにもかかわらず、私はAppcelerator Titaniumを優先しています。
Titaniumでは、JavaScriptでAndroidおよびiOSアプリケーションを作成できます。 現在、公式Webサイトでは、このプラットフォームの開発者数は300,000人に達しています。
興味深い点は、Titaniumではアプリケーションだけでなく、モバイルデバイス向けの本格的なゲームも作成できることです。
Titanium Mobileの2次元ゲームエンジンモジュール-AndroidおよびiOSの開発を現在サポートしているOpenGL ESベースのQuickTiGame2dに注目したいと思います。 この記事では、インストールプロセスと、このエンジンの主要なポイントを検討し、次は、小さなクロスプラットフォームゲームの作成について直接説明します。
まず最初に、最新のライブラリを
ここからダウンロードする必要があります。1つはAndroid用、もう1つはiOS用です。 この記事の執筆時点では、最新版はバージョン1.2（最近リリースされた1.3）でした。
これらのライブラリを接続するには、適切なディレクトリに配置します。 Mac OSでは、次のようになります。
/Users/username/Library/Application Support/Titanium/modules/
ここには、android、iphoneという2つのフォルダーがあります。 すべてが非常に簡単です。対応するライブラリをそれぞれにコピーする必要があります。
次に、新しいプロジェクトを作成します。 tiapp.xmlを開き、適切なコードを追加します。
<modules> <module platform="iphone" version="1.2">com.googlecode.quicktigame2d</module> <module platform="android" version="1.2">com.googlecode.quicktigame2d</module> </modules>
次のように書かれた例に会いました。
<module version="1.2">com.googlecode.quicktigame2d</module>
私の経験では、ライブラリを接続するこの方法は機能しませんでした。
これで準備完了です。 この作業に役立つ基本的な要素を見てみましょう。 最初のステップは、「ウィンドウ」を作成してQuickTiGame2dを接続し、ゲーム画面を作成することです。 すべて順：
var window = Ti.UI.createWindow({ backgroundColor : 'black' }); var quicktigame2d = require('com.googlecode.quicktigame2d'); var game = quicktigame2d.createGameView();
プロジェクトに必要なJsファイルは、次のように接続されます。
Ti.include('loadingScene.js');
重要な要素は、ゲーム中の画面の場所です。 この場所を説明するには、各プラットフォームを個別に参照する必要があります。
if (Titanium.Platform.osname === 'android') { game.orientation = Ti.UI.LANDSCAPE_LEFT; window.orientationModes = [Titanium.UI.LANDSCAPE_LEFT]; }else { game.orientation = Ti.UI.LANDSCAPE_RIGHT; window.orientationModes = [Titanium.UI.LANDSCAPE_RIGHT]; }
画面の色を変更できます：
game.color(0, 0, 0);
イベントハンドラーを追加します。次に例を示します。
game.addEventListener('onload', function(e) { ... LoadingScene.init(); game.pushScene(LoadingScene.scene); game.start(); });
シーンのイベントをさらに詳しく見てみましょう。 次のようなメインハンドラーを強調表示できます。
this.scene.addEventListener('activated', activated); this.scene.addEventListener('deactivated', deactivated); this.scene.addEventListener('onloadsprite', onloadsprite);
たとえば、アクティブにすると、次のようになります。
var activated = (function(self) { return function(e) { ... }; })(this);
私の意見では、コードはそれ自体を説明しています。シーンがアクティブ化、非アクティブ化されたとき、およびスプライトをシーンにロードしたときに発生するイベントを規定します。
非常に便利な画面タップイベント：
game.addEventListener('touchstart', touchstart); game.addEventListener('touchend', touchend);
続けましょう。
すべての要素と同様にゲーム画面を追加し、ゲームウィンドウを開く必要があることを忘れないでください。
window.add(game); window.open({fullscreen:true, navBarHidden:true});
ステージ上のグラフィック要素とテキスト要素の検討に移りましょう。
手始めに、テキスト要素を追加する簡単な例：
var scoreTextSprite = quicktigame2d.createTextSprite({ text : score, fontSize : 64 }); scoreTextSprite.color(1, 0, 0); scoreTextSprite.x = game.screen.width*0.4; self.scene.add(scoreTextSprite);
ここで、スプライトテキストが作成され、フォントサイズ、色、およびx軸に沿ったその位置が設定されます。
グラフィックスプライトの作成は次のとおりです。
var sprite = quicktigame2d.createSprite({image:'images/sprite.png'});
スプライトを使用してさまざまな操作を行うことができます。
1.非表示および表示
sprite.hide(); sprite.show();
2.回転
sprite.rotate(180);
3.移動
sprite.move(300, 500);
4.スケールを変更します（2つの軸を同時に、それぞれ別々に）
sprite.scale(5); sprite.scaleBy(2, 3);
スプライトを互いの上に配置するには、特別な値z = 0..99があります。
sprite.z = 1; newSprite.z = 2;
まあ、それはスタートに十分だと思います。 この記事がクロスプラットフォームのゲーム開発への熱意を呼び起こし、これらの努力に役立つことを願っています。 この段階ではまだゲームはありませんが、次の記事ではその作成について説明します。