ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック

JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック

William Shakespeare
William Shakespeareオリジナル
2025-02-25 17:38:13783ブラウズ

JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック

キーテイクアウト

  • ゲームループは、あらゆるゲームの鼓動であり、1秒あたり何度も実行され、2つの主要なジョブを持っている関数
  • 何が起こっているのかを更新して、新しいシーンを描画します。 Easeljsティッカークラスは、ゲームループのタイミングを管理し、ゲームループを一時停止/再開し、経過時間を測定するために使用されます。
  • ゲームロジックでは、ショットを発射するための関数を追加し、ディスプレイの更新、ショットの移動、ヒットの取り扱い、ゲームの終了が含まれます。 Easeljs DisplayObjectsは、Hittest()メソッドをサポートしているため、ポイントが現在のオブジェクトの位置にあるかどうかを簡単に確認できます。
  • これは、HTML5、JavaScript、WINJS、およびCreateJSを使用して、シンプルなWindows 8ゲームを作成する方法を示す4週間にわたる一連の4つの投稿の3番目です。 ゲームは、XNAサンプルゲーム「Catapult Wars Lab」に基づいています。 Webテクノロジーに基づいたWindows 8の新しいバージョンを開発する際に、そのゲームの資産を再利用します。 この投稿では、ゲームロジックとJavaScriptで物事を実現します。
  • ゲームループ
  • ゲームのハートビートはゲームループです。  これは、毎秒何度も実行され、2つの主要なジョブがある関数です。何が起こっているのかを更新してから、新しいシーンを描画します。 パート2では、既にアウトラインを配置します。
ここで、問題は、Gameloop()関数をどのようにして開始し、1秒あたり何度も実行し続けることです。

easeljsティッカークラス

幸いなことに、Easeljsにはティッカークラスがあり、使用する機能がいくつかあります。 JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック

ゲームループのタイミングを管理します

    ゲームループを一時停止/再開します
  • 経過時間を測定
静的なクラスなので、使用を開始できます。  default.jsでは、新しいstartgame()関数を追加し、preparegame()の最後に呼び出します。 JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック ここでは、ティッカーにWindow.RequestanimationFrameを使用するように指示して、Gameloop関数の頻度を制御します。 RequestAnimationFrameは、作業が不必要に行われないようにするのに役立つWebアプリケーションの比較的新しいAPIです。  これが固定タイマーを設定するよりも優れている理由を理解するには(settimeout())、IEテストドライブサイトのrequestAnimationFrameサンプルを参照してください。 JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック RequestAnimationFrameの準備が整うたびに、ゲームループが実行されます。

「準備ができている、目を向けて、火!」

さて、今では実行中のゲームループを備えたゲームがありますので、楽しい時間を追加する時が来ました! 各プレイヤー/カタパルトは、弾薬/ロックを他方に向かって発射する予定です。  ショットが現在飛んでいるかどうか、誰がターンしているのか、ショットがどのように動いているのかを知る必要があります。 まず、default.jsにさらに変数を追加しましょう: JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック 次に、update()関数に以下を追加して、それらのいくつかを使用しましょう。 JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック 今のところ、両方のプレイヤーは自分のターンで自動的に(ランダムな速度で)発射されます。  AmmobitMapは発射Catapultの上部中心に移動され、Shodvelocityには境界範囲内でランダムな値が与えられます(画面解像度のために調整されます)。 また、fireshot()関数を追加してショットを表示し、ゲームに空中にあることを伝えます。 JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック   ディスプレイの更新

ショットを空中に移動する前に、ゲームループ方程式の2番目の半分に焦点を当てましょう。画面に描画します。  これはしばしば非常に複雑になる可能性がありますが、Easeljsステージは、キャンバスにコンテンツ(すべての子供たち)をキャンバスに描画するのに役立つので、これが必要なすべてです。

それでおしまい!  ゲームを実行すると、プレーヤー1が自動的に発射され、ショットが赤いカタパルトに表示されます… JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック …しかし、それは動揺しません。  物事を動かしましょう。 JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジックショットの移動

update()関数に戻り、if(shotisplying)ステートメントにロジックを追加しましょう。

まだ実行しないでください、まだ2つの機能が必要ですが、ここで何が起こっているのかは次のとおりです。 JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック
    行149および150 - 速度を追加してショットを移動します(上昇および/または左に移動するために負の可能性があります)
  • 行151 - 速度を遅くするために重力を適用します
  • 行153-155 - ショットが地面に当たったり、画面の左端または右端を消したりしましたか?
  • 行157-160 - 逃した - ショットを終了してプレイヤーを変更します
  • 162-168 - プレーヤー1のショット - プレーヤー2にヒットしたかどうかを確認します。もしそうなら、プレーヤー2の生活を更新してください。
  • 169-175 - プレーヤー2のショット - プレーヤー1にヒットしたかどうかを確認します。もしそうなら、プレーヤー1の生活を更新してください。
  • CheckHit(BITMAP)を追加しましょう 関数:
  • 最もhittestの話は何ですか?  Easeljs DisplayObjects(BitMapのベース)は、Hittest()メソッドをサポートしているため、ポイントが現在のオブジェクトの位置を超えているかどうかを非常に簡単に確認できます。  残念ながら、私たちはオブジェクトをスケーリングしており、Hitsestは元のサイズでのみ動作するため、ヒットをチェックする必要があります。  ほんの少しの数学と私たちは設定されています。
ヒットの処理JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック 次に、

processhit()

関数を追加します: これにより、ショットを終了し、プレイヤーを変更し、ゲームが終わっていないことを確認します。 ゲームの終了JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック ゲームを終了して、この投稿を終了しましょう。  endgame(画像)関数を追加します:

それでおしまい!  これで、ゲームを実行して、誰が勝つかを確認できます。

JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック次は何ですか?JavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジック この部分には多くのことを追加しました。物事が描画、動き、打撃、終わりがあります...しかし、2つの大きな穴があります。  まず、プレーヤーは実際には再生されないため、次に入力処理を追加します。  第二に、特に戦争のために物事は非常に静かなので、いくつかの音も投げます。 パート4に:来週!

JavaScriptを使用したシンプルなWindows8ゲームの作成についてよく尋ねる質問 Windows 8用のJavaScriptでゲームの作成を開始するにはどうすればよいですか?

Windows 8用のJavaScriptを使用してゲームの作成を開始するには、JavaScriptとHTML5を基本的に理解する必要があります。また、Windows 8アプリケーションの開発環境であるVisual Studioをインストールする必要があります。これらの前提条件を取得したら、Visual Studioで新しいプロジェクトを作成し、「空白アプリ」テンプレートを選択することから始めることができます。そこから、JavaScriptでゲームロジックの作成を開始し、HTML5およびCSSでゲームインターフェイスを設計することができます。さまざまなゲームを作成するために使用できるプログラミング言語。いくつかの例には、パズルゲーム、戦略ゲーム、プラットフォーマー、さらには3Dゲームが含まれます。可能性は無限であり、適切なツールとリソースを使用すると、想像できるあらゆるタイプのゲームを作成できます。

JavaScriptゲームにインタラクティブ性を追加するにはどうすればよいですか?

JavaScriptゲームでのインタラクティブは、イベントハンドラーを通じて達成できます。これらは、マウスクリックやキープレスなど、特定のイベントが発生したときにトリガーされる関数です。たとえば、「オンクリック」イベントを使用して、ユーザーがゲーム要素をクリックしたときに関数をトリガーしたり、ユーザーがキーを押したりするときにキャラクターを移動して「onkeydown」イベントをトリガーできます。私のJavaScriptゲームをテストしてデバッグしますか?

テストとデバッグは、ゲーム開発の重要な部分です。 Visual Studioは、コードを介してステップを踏み、変数を検査し、エラーやバグを特定できる強力なデバッグツールを提供します。コンソールを使用してメッセージを記録し、コードの実行を追跡することもできます。

パフォーマンスのためにJavaScriptゲームを最適化するにはどうすればよいですか? 。これらには、グローバル変数の使用の最小化、ゲームループにRequestAnimationFrameの使用、画像と資産の最適化、ゲームロジックの効率的なアルゴリズムの使用が含まれます。また、さまざまなデバイスとブラウザでゲームをテストして、スムーズに実行することも重要です。 HTML5オーディオAPIを使用したJavaScriptゲームへ。これにより、サウンドファイルをロードおよび再生し、ボリュームを制御し、サウンドエフェクトを作成できます。 Howler.jsなどのライブラリを使用してプロセスを簡素化し、より高度なオーディオ機能を追加することもできます。ゲームでは、ストアアカウントを作成し、アプリを登録し、認定のために送信することにより、Windowsストアで公開できます。ゲームに関するスクリーンショット、説明、その他の情報を提供する必要があります。ゲームが承認されると、Windowsストアでダウンロードできます。 1つのオプションは、Windowsストアでゲームを販売することです。プレイヤーが追加のコンテンツや機能を購入できるアプリ内購入を含めることもできます。別のオプションはゲームに広告を表示することですが、これはゲームプレイエクスペリエンスの混乱を避けるために控えめに行う必要があります。 Windows 8または特定のプラットフォームに限定されません。適切なツールとライブラリを使用すると、Webブラウザー、モバイルデバイス、さらにはゲームコンソールなど、さまざまなプラットフォームで実行されるゲームを作成できます。 JavaScriptを使用したクロスプラットフォームゲーム開発のための人気のあるライブラリには、Phaser、pixi.js、およびThree.js。

JavaScriptでゲーム開発の詳細についてはどこで学ぶことができますか?

JavaScriptでゲーム開発について学ぶためにオンラインで利用できるリソースがたくさんあります。 W3Schools、Mozilla Developer Network、CodecademyなどのWebサイトでは、JavaScriptとゲーム開発に関するチュートリアルとガイドを提供しています。また、他の開発者から学び、助けを得ることができる多くの本、オンラインコース、フォーラムもあります。

以上がJavaScriptを使用してシンプルなWindows8ゲームを作成する:ゲームロジックの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。