プレイ「マルチプレイヤーオンラインゲームの開発。」パート4:3Dへの移行

Piccy.info-無料の画像ホスティング



パート1:アーキテクチャ

パート2:プロトコル

パート3:クライアントとサーバーの相互作用



最近、例としてAWAY3D 4エンジンを使用して11フラッシュを操作していますが、このエンジンに関する情報はロシア語ではほとんどありません。 それについてのハブでは、実際には何もありません。 そこで、私はこの非常に興味深い製品に関する記事をいくつか書くことにしました。 単純な円や立方体について書くことは、まったく面白くありません。 私は真空中で球形の馬について議論するのは好きではありません。

一般的に、私はあまり現実的でない例でエンジンの説明をすることにしました。 ゲームをトップダウン3Dシューティングゲームに転送します。 そして、開発を続けますが、3Dテクノロジーを使用します。

もちろん、Alternativa3Dエンジンがあることは承知しています。 しかし、私は多くの理由で彼らの製品が好きではありません。 記事ではそれらについては説明しませんが、質問がある場合はkamentyへようこそ。



一般的に、代替案の代替案を作成します...







それで、私たちは何を得たいですか?



2Dマルチプレイヤーゲームを3Dに変換します。



始めましょう。



次のテクノロジーを使用します。



プラットフォームとしてのFlash 11

3DエンジンとしてのAWAY3D 4

開発環境としてのFlashDevelop 4

ゲームオブジェクトおよび世界全体のエディターとしてのBlender 2.61。



なぜAWAY3Dなのか? シンプルで、ソースはGihubで入手できます。 ライブラリは活発に開発されており(コミットは頻繁に行われます)、いつでも修正または補足できます。 さて、ソースに含めるために送信します。 コミュニティはあなたに感謝します。 さらに、ライブラリ自体の十分に大きな機能。 さらに、その上に本があります。



AWAY3D 4とは何ですか? これは11フラッシュの3Dライブラリです。つまり、ビデオカードのGPUを使用してオブジェクトを表示します。 これにより、照明、さまざまなエフェクトなど、複雑なオブジェクトをステージ上で表示することができます。これらすべてを適切な速度で実行できます。

AWAY3DにはFlash10のバージョンがあり、ソフトウェアレンダリングを使用して表示が行われることに注意してください。 この場合、すべての計算がCPUの負担になるため、速度は何度も低下します。 さて、さまざまな効果を出力する能力は大幅に低下します。 ただし、このバージョンは単純なプロジェクトには便利です。 第11回Flashがリリースされたばかりで、誰もがインストールしたわけではありません。 また、すべてのビデオカードがサポートしているわけではありません。

しかし、状況は日々改善されており、進歩の最前線にいる私たちは、11回目のフラッシュに最新バージョンを使用します。

興味のある方は、詳細をここで見つけることができます



プロジェクトのアーキテクチャについては気にしません。 この記事の目的は、プログラミングガイドではなく、テクノロジーの紹介です。 将来、記事が読者からのフィードバックを見つけた場合、アーキテクチャの改善を伴うリファクタリングの形で続けることが可能です...まあ、一般的には、プロジェクトの開発。



問題を回避するには、最新のフラッシュとFlashDevelopがインストールされていることを確認する必要があります。 これにより、ソースコードが正しくコンパイルおよび実行されます。



AWAY3Dベース





FlashDevelopでAS3プロジェクトを作成し、AWAY3Dライブラリをそれに接続します。 エンジンの接続は非常に簡単です。 GitHubプロジェクトからAWAY3Dソースをダウンロードし、プロジェクトのsrcフォルダーにコピーします。 それだけです



AWAY3Dのステージで何が起こっているかをさらに簡単に理解できるように、シーンの空間をナビゲートするのに役立つ写真を提供します。



Piccy.info-無料の画像ホスティング



AWAY3Dエンジンで表示される座標軸を示しています。 つまり デフォルトでは、forwardはZ +、upはY +です。



エンジンを使用する基本的な原理は非常に簡単です。 View3Dシーンを初期化する必要があります。 ステージ上のカメラの位置を示しながら、カメラをセットアップします。 カメラは、シーンのビューを表示するオブジェクトです。 つまり いわば、画面に表示されるもの、目です。

次に、光源を配置する必要があります。 それらは異なり、ポイント、散乱などです。ポイントソースを使用し(1つのポイントから全方向に均一に光が広がります)、太陽を表します。 原則として、それなしでも実行できますが、ステージ上に影はありません。

シーンを計算して表示するには、view.render()コマンドを使用します。 フレームごとに呼び出す必要があります。 その後、ステージ上でオブジェクトを作成して操作できます。



まず、キューブを表示する簡単なプロジェクトを作成しましょう。 これは、一般的にどのように起動して動作するかを理解するために必要です。 まあ、すべてが接続され、正しく動作していることを確認するために。



水コードは、キューブを表示するクラスです。 すべての説明はコード内にあります。 彼はとてもシンプルです。



public class Main extends Sprite { //    private var view : View3D; //   public var light: PointLight; //   public var player: ObjectContainer3D; public function Main():void { if (stage) init(); else addEventListener(Event.ADDED_TO_STAGE, init); } private function init(e:Event = null):void { removeEventListener(Event.ADDED_TO_STAGE, init); // entry point //   view = new View3D(); view.camera.y = 140; view.camera.z = -120; view.camera.rotationX = 50; addChild(view); //  addChild(new AwayStats(view)); //     addPlayer(); stage.addEventListener( Event.ENTER_FRAME, onEnterFrame ); } public function addPlayer():void { //   player = new ObjectContainer3D(); //      var bitmapData: BitmapData = new BitmapData(512, 512, false, 0x000000); bitmapData.perlinNoise(64, 64, 5, 0, false, true, BitmapDataChannel.RED); //    var material: BitmapMaterial = new BitmapMaterial(bitmapData); //     var mesh:Mesh = new Cube(material, 50, 50, 50); player.addChild(mesh); view.scene.addChild(player); } public function onEnterFrame( e:Event ):void { player.rotationX += .11; player.rotationY += .15; player.rotationZ += .19; view.render(); } }
      
      







その結果、起動時に次の画像が表示されます。



Piccy.info-無料の画像ホスティング



そうでない場合は、すべてを正しく行ったかどうかを確認してください。 インストールされているFlashおよびFlashDevelopのバージョンを確認します。



プロジェクトが開始されて動作していると確信できたので、おもちゃの2番目の基本的なことを行います。 つまり、ブレンダーで作成されたモデルをゲームにロードします。 プロジェクト全体がこれに基づいて構築されます。

インターネットはブレンダーを操作することで得られる教訓に満ちているので、私たちはそれに集中しません。 ブレンダーを開いて、キューブで構成されるモデルを作成します。 20 x 20 x 20のサイズです。現在、本格的なモデルを作成しても意味がありません。 さらなるレッスンでは、インターネット上でワゴンと小さなカートである既製のモデルを取り上げます。 そして今、すべての環境が正しく機能し、モデルがロードされていることを確認する必要があります。

このプロジェクトでは、3DSモデルの形式を使用します。 モデルを作成したら、3DS形式にエクスポートします。 とりあえず、結果のファイルをプロジェクトのbinフォルダーに入れます。 だから彼にたどり着くのは簡単だろう。



それではインポートを始めましょう。



AWAY3Dでのオブジェクトのロードは非常に簡単です。 必要なのはLoader3Dクラスだけです。 ユニバーサルであり、すべての形式をダウンロードします。 オブジェクトをロードする形式を指定できますが、これは必須ではありません。 Parsers.enableAllBundled()コマンドを使用してパーサーを指定し、すべての形式を受け入れるように指定できます。 Loader3D自体は、出荷内容を正確に理解します。

原則として、モデルのロードに必要なコードは4行のみです。



 Parsers.enableAllBundled(); loader = new Loader3D(); loader.addEventListener(LoaderEvent.RESOURCE_COMPLETE, onResourceComplete); loader.load(new URLRequest("model.3ds"));
      
      







ここでは、すべての形式を受け入れることを示し、Loader3Dオブジェクトを作成し、ダウンロードする必要があるものを正確に伝えました。 イベントLoaderEvent.RESOURCE_COMPLETEは、ダウンロードプロセスが完了し、モデルを操作できることを通知します。

基本バージョンでは、すべてがシンプルです。 ただし、ロード時にエラーが発生したり、モデルのロード時に何らかの処理が必要になります。 一般に、実際のプロジェクトでは、すべてがより複雑です。 そしてこのために、エンジンはそれをすべて備えています。 イベントLoaderEvent.LOAD_ERRORを接続できます。これにより、読み込みエラーがキャッチされます。 または、イベントLoaderEvent.ASSERT_COMPLETEは、モデルの各部分が処理されるときにトリガーされます。 モデルの操作について詳しく説明する際に、これらのニュアンスを次のレッスンで分析します。



モデルをシーンにロードする作業コードは次のとおりです。



 public class PlayerLoad { // 3D private var view:View3D; private var main: Main; // loader private var loader:Loader3D; public function PlayerLoad( view_:View3D, main_: Main ) { main = main_; //     view = view_; // ,      Parsers.enableAllBundled(); loader = new Loader3D(); loader.addEventListener(LoaderEvent.RESOURCE_COMPLETE, onResourceComplete); //    loader.load(new URLRequest("model.3ds")); } private function onResourceComplete(e:Event):void { //     main.player = ObjectContainer3D(e.target); //     view.scene.addChild( main.player ); } }
      
      







また、クラスmainでは、addPlayer()メソッドを次のものに置き換える必要があります。

 public function addPlayer():void { //   var load: PlayerLoad = new PlayerLoad( view, this ); }
      
      







すべてを正しく行った場合、起動時に白い回転キューブが表示されます。



Piccy.info-無料の画像ホスティング



これが紹介です。 プロジェクトを作成し、必要なライブラリを接続し、作業環境をチェックして、すべてが機能することを確認しました。

トピックが興味深い場合は、次のパートで、カメラの操作、オブジェクトの操作、マテリアルの操作について、さらに詳しく説明します。



すべてのソースはGihubで利用可能です



PSまたkamentyでは、あなたが注意を払うべき興味のあるポイントを示すことは有用でしょう。



All Articles