Unity 5とJavaScriptを使用してWebGLゲームを作成します-jsチュートリアル-php.cn

Unity 5とJavaScriptを使用してWebGLゲームを作成するための簡単なガイド

コアポイント：

このチュートリアルは、プロジェクトのセットアップ、プラットフォームで跳ね返るヒーローキャラクターの作成、没入型ゲーム体験のための一人称視点を追加するJavaScript（UnityScript）を使用して、Unityでシンプルなゲームを作成する方法をガイドします。
Unityのスクリプトは、プログラマティックプラットフォームの生成や、マウス入力が使用するレスポンシブコントロールなど、ゲームのヒーローに影響を与える動的なゲームの動作を可能にします。
ゲームを完了するための重要な手順には、ゲームメニューにスタートボタンを備えたユーザーインターフェイスを追加すること、WebGL対応ブラウザで再生できるようにプロジェクトをWebGLアプリケーションとしてエクスポートするようにビルド設定を構成することが含まれます。
この記事は、ニルソン・ジャック・コリンズ、マーク・トウラー、マット・バーネットによって査読されました。 SetePointコンテンツを最高に獲得してくれたSetePointのすべてのピアレビューアに感謝します！

Unityは、PC、ゲームコンソール、モバイルデバイス、Webサイトのビデオゲームを開発するために使用されるクロスプラットフォームゲームエンジンです。最新バージョン（UNITY 5）にはWebGL Exporterが付属しています。つまり、開発者はゲームを簡単にWebに公開できます。名前が示すように、WebGLエクスポートはWebGL（インタラクティブ3Dコンピューターグラフィックスのレンダリング用のJavaScript API）およびASM.JS（Mozillaが開発したJavaScriptのサブセットが「Webのアセンブリ言語」と宣伝されています）を使用します。 ASM.JSとWebGLの詳細については、UnityとUnreal Engineの詳細をご覧ください。

このチュートリアルでは、統一を始める方法を紹介します。また、JavaScriptを使用してUnityで簡単なゲームを作成する方法と、ゲームをWebにエクスポートする方法も紹介します。ここで完成したゲームを表示することができます（WebGLをサポートするデスクトップブラウザが必要です）、またはGitHubリポジトリからゲームファイルとプロジェクトファイルをダウンロードできます。

始めましょう...

UnityのJavaScriptに関する

指示

UnityのJavaScriptについて話すとき、私たちは実際にunityScriptについて話しています。これはJS方言の一種です。 Unity自体はしばしばこのJavaScriptに言及していますが、より冷笑的なオブザーバーは、「Unityを使用するJavaScript」がマーケティング戦略であると信じています。いずれにせよ、UnityScriptがECMAScriptの仕様に準拠していないことを明確にする必要があります。また、そうしようとしませんでした。ここで違いの概要を見つけることができます。

Unityのインストール

このチュートリアルを開始するには、ここからダウンロードできるUnityバージョンを実行する必要があります。 Unityには、WindowsとMac OS X用のインストーラーがあります。 Linuxユーザーはワインを介して団結を実行できますが、結果は異なる場合があります。

Creating a WebGL Game with Unity 5 and JavaScript

インストールが完了したら、開始できます！団結を開いて、新しい3Dプロジェクトを作成しましょう。

Creating a WebGL Game with Unity 5 and JavaScript

プロジェクトの設定

統一が最初に開かれた後、メインウィンドウを理解するために時間をかける必要があります：

Creating a WebGL Game with Unity 5 and JavaScript

左端のパネルは要素と方向ライト要素があるはずです。真ん中は
ビューです。これは、3Dスペースのカメラとライトをアイコンの形で示しています。シーンタブの隣には、プレイヤーが見るように、ゲーム自体を表示するタブがあります。これは、エディターでゲームをテストするように設計されています。
右側には、要素の設定を変更できる検査官パネルがあります。試してみましょう。階層の方向ライトをクリックしてください。これで、この光に関する多くの情報を確認し、

シャドウタイプ：シャドウ
を使用してシャドウをオフにできるようにする必要があります。 下部には、プロジェクトウィンドウがあり、ゲームの開発に必要なファイルビューが表示されます。 unityのインターフェイスに精通しているので、開発を開始する前にもう1つのことがあります。現在のシーンを保存します。 ファイル＆gt;シーンの保存 ascetsという名前のフォルダーを指すダイアログボックスを開きます
ユニティでファイルを整理する一般的な方法の1つは、サブフォルダーを使用することです。したがって、シーンという名前の新しいフォルダーをAssetsフォルダーに追加し、このフォルダーのlevel.unityという名前のシーンを保存します。
ヒーローを作成します
私たちのゲームは、あるプラットフォームから別のプラットフォームにジャンプし、ますます高くジャンプする1つのヒーローで構成されます。それが1つを見逃していて、無に陥ると、ゲームは失敗します。それでは、ヒーローを作成することから始めましょう。プレイヤーは一人称の観点からゲームを見るので、ヒーローの外観は重要ではないので、標準の球体ジオメトリを使用できます。球の利点は、いくつかのステップで作成できることであり、ジャンプする必要がある物理的特性に適合することです。

階層

でを作成し、検査官を使用して次のプロパティを編集します。

再生ボタンを押して、何をするかをテストしましょう。スカイラインの前にある3Dスペースに球体が表示されるはずです。

ヒーローが落ちるためには、重量を追加する必要があります。したがって、インスペクターの対応するボタンをクリックし、rigid bodyを選択して、球体にコンポーネントを追加する必要があります。そして、ヒーローを回転させたくないので、制約をオンにし、回転行のすべての軸を選択することにより、剛体コンポーネントのヒーローをフリーズします。シーンが再び再生されると、ヒーローが落ちるのを見ることができるはずです。

Creating a WebGL Game with Unity 5 and JavaScript

ヒーローをエンドレスフォールズから救うために、プラットフォームとして機能するフラットボックスを作成します。これを行うには、キューブを追加して、スケールを0.1に設定する必要があります。シーンを再生すると、ヒーローがプラットフォームに安全に着陸していることが確認されますが、自然に見えないことを認めなければなりません。では、どのようにヒーローをリバウンドさせるのでしょうか？いくつかの物理的な材料を追加します。

ヒーローをリバウンドにします

最初に、球体が弾力性を発揮するために新しい物理材料を作成する必要があります。これを行うには、Assetsフォルダーにマテリアルと呼ばれる新しいフォルダーを作成し、ここで新しい物理的な素材を作成します。 bouncy_sphereという名前を付けましょう。

インスペクターで調整するために必要な値は次のとおりです。 この素材をSphere Collider

に追加すると、球体が上下に跳ね返りますが、常に同じ高さに達します。バウンスごとに球体がますます高くジャンプするためには、プラットフォームに物理的な素材を追加する必要があります。これを行うには、bouncy_platformという別の素材を作成し、その値を次のように変更します。

<code>位置 { X: 0, Y: 2.5, Z: 0 }
缩放 { X: 0.3, Y: 0.3, Z: 0.3 }</code>

ログイン後にコピー

ここで一貫性を達成するには、

階層でダブルクリックすることにより、キューブ要素をプラットフォームに変更する必要があります。今すぐゲームを開始すると、球体が毎回ますます高くジャンプすることに気付くことができます。また、

プラットフォームと呼ばれる新しい標準素材を作成して、プラットフォームに特定の色を付与します。この素材を作成した後、＃c8ff00を

<code>动态摩擦：10
静态摩擦：10
弹性：1
摩擦组合：最大
弹跳组合：最大</code>

ログイン後にコピー

albedo

color（albedoはUnity UIのラベルです）として使用し、この素材をプラットフォーム要素にドラッグアンドドロップします。今は黄色であるはずです。一人称の視点を追加

一人称の視点を追加するために、カメラをドラッグアンドドロップします（階層）球体に。これにより、カメラがヒーローの子供になり、カメラが動くときにカメラが球体に従うようになります。カメラのプロパティも次のように調整する必要があります

また、球体の2番目の子要素としてスポットライトを作成します。これにより、プレイヤーはヒーローの現在のジャンプ高さのアイデアを与えます。スポットライトの値を次のように調整します

（その後の手順は、スペースの制限のために簡単に説明され、コアロジックとキーコードスニペットが保持されます）

プログラミングコントローラー、プログラマティック作成プラットフォーム、ゲームメニューの追加、ゲームボタンの開始ボタンの追加、WebGLブラウザゲームとしてプロジェクトを公開するなど。元のドキュメントを参照してください。スペースの制限のため、ここで繰り返しません。重要なのは、Unityのスクリプトシステム、ゲームオブジェクト管理、物理エンジン、UIシステムのコア概念を理解し、チュートリアルのコード例と組み合わせてそれらを練習することです。