注意

Mixed Reality Academy チュートリアルは、HoloLens (第1世代) と Mixed Reality イマーシブヘッドセットを念頭に置いて設計されています。The Mixed Reality Academy tutorials were designed with HoloLens (1st gen) and Mixed Reality Immersive Headsets in mind. そのため、これらのデバイスの開発に関するガイダンスをまだ探している開発者には、これらのチュートリアルを残しておくことが重要です。As such, we feel it is important to leave these tutorials in place for developers who are still looking for guidance in developing for those devices. これらのチュートリアルは いない 最新のツールセットや相互作用が使用されている HoloLens 2 で更新されます。These tutorials will not be updated with the latest toolsets or interactions being used for HoloLens 2. サポートされているデバイスでの作業を続行するために管理されます。They will be maintained to continue working on the supported devices. 今後、HoloLens 2 向けの開発方法を示す新しい一連のチュートリアルが掲載されています。There will be a new series of tutorials that will be posted in the future that will demonstrate how to develop for HoloLens 2. この通知は、これらのチュートリアルが投稿されたときのリンクと共に更新されます。This notice will be updated with a link to those tutorials when they are posted.


MR と Azure 305:関数とストレージMR and Azure 305: Functions and storage

最終製品-開始

このコースでは、Azure Functions を作成して使用し、混合の現実アプリケーション内で Azure Storage リソースを使用してデータを格納する方法について説明します。In this course, you will learn how to create and use Azure Functions and store data with an Azure Storage resource, within a mixed reality application.

Azure Functionsは Microsoft のサービスであり、開発者は Azure で小さなコードである "Functions" を実行できます。Azure Functions is a Microsoft service, which allows developers to run small pieces of code, 'functions', in Azure. これにより、ローカルアプリケーションではなく、クラウドに作業を委任することができます。これには多くのメリットがあります。This provides a way to delegate work to the cloud, rather than your local application, which can have many benefits. Azure Functionsは、C#、F#、node.js、Java、PHP など、いくつかの開発言語をサポートしています。Azure Functions supports several development languages, including C#, F#, Node.js, Java, and PHP. 詳細については、 Azure Functionsに関する記事をご覧ください。For more information, visit the Azure Functions article.

Azure Storageは Microsoft のクラウドサービスであり、開発者はデータを格納できます。このサービスは、高可用性、セキュリティ、耐久性、拡張性、および冗長性を備えています。Azure Storage is a Microsoft cloud service, which allows developers to store data, with the insurance that it will be highly available, secure, durable, scalable, and redundant. これは、Microsoft がすべてのメンテナンスと重大な問題を処理することを意味します。This means Microsoft will handle all maintenance, and critical problems for you. 詳細については、 Azure Storageに関する記事をご覧ください。For more information, visit the Azure Storage article.

このコースを完了すると、現実のイマーシブヘッドセットアプリケーションが完成し、次のことができるようになります。Having completed this course, you will have a mixed reality immersive headset application which will be able to do the following:

  1. ユーザーがシーンを見つめていることを許可します。Allow the user to gaze around a scene.
  2. ユーザーが 3D ' ボタン ' で gazes たときにオブジェクトの生成をトリガーします。Trigger the spawning of objects when the user gazes at a 3D 'button'.
  3. 生成されたオブジェクトは、Azure 関数によって選択されます。The spawned objects will be chosen by an Azure Function.
  4. 各オブジェクトが生成されると、アプリケーションはAzure StorageにあるAzure ファイルにオブジェクトの種類を格納します。As each object is spawned, the application will store the object type in an Azure File, located in Azure Storage.
  5. もう一度読み込むと、 Azure ファイルデータが取得され、アプリケーションの前のインスタンスから生成されたアクションの再生に使用されます。Upon loading a second time, the Azure File data will be retrieved, and used to replay the spawning actions from the previous instance of the application.

アプリケーションでは、結果をデザインと統合する方法については、お客様のニーズに合わせてください。In your application, it is up to you as to how you will integrate the results with your design. このコースは、Azure サービスを Unity プロジェクトと統合する方法を説明することを目的としています。This course is designed to teach you how to integrate an Azure Service with your Unity Project. このコースで得られた知識を使用して、mixed reality アプリケーションを強化することができます。It is your job to use the knowledge you gain from this course to enhance your mixed reality Application.

デバイスのサポートDevice support

までCourse HoloLensHoloLens イマーシブ ヘッドセットImmersive headsets
MR と Azure 305:関数とストレージMR and Azure 305: Functions and storage ✔️✔️ ✔️✔️

注意

このコースでは主に Windows Mixed Reality イマーシブ (VR) ヘッドセットに焦点を当てていますが、このコースで学習した内容を Microsoft HoloLens に適用することもできます。While this course primarily focuses on Windows Mixed Reality immersive (VR) headsets, you can also apply what you learn in this course to Microsoft HoloLens. このコースに従うと、HoloLens をサポートするために必要となる可能性のある変更に関する注意事項が表示されます。As you follow along with the course, you will see notes on any changes you might need to employ to support HoloLens.

必須コンポーネントPrerequisites

注意

このチュートリアルは、Unity とC#の基本的な経験を持つ開発者向けに設計されています。This tutorial is designed for developers who have basic experience with Unity and C#. また、このドキュメントに記載されている前提条件と記述に記載されている手順は、作成時にテストおよび検証されたものを表します (2018 年5月)。Please also be aware that the prerequisites and written instructions within this document represent what has been tested and verified at the time of writing (May 2018). ツールのインストール」の記事に記載されているように、最新のソフトウェアを自由に使用できます。ただし、このコースの情報は、以下に記載されているものよりも新しいソフトウェアで見つかったものと完全に一致するとは限りません。You are free to use the latest software, as listed within the install the tools article, though it should not be assumed that the information in this course will perfectly match what you'll find in newer software than what's listed below.

このコースでは、次のハードウェアとソフトウェアをお勧めします。We recommend the following hardware and software for this course:

開始前の準備Before you start

このプロジェクトのビルドで問題が発生しないように、このチュートリアルで説明されているプロジェクトをルートまたはほぼルートフォルダーに作成することを強くお勧めします (長いフォルダーパスはビルド時に問題を引き起こす可能性があります)。To avoid encountering issues building this project, it is strongly suggested that you create the project mentioned in this tutorial in a root or near-root folder (long folder paths can cause issues at build-time).

章 1-Azure PortalChapter 1 - The Azure Portal

Azure Storage サービスを使用するには、Azure portal でストレージアカウントを作成し、構成する必要があります。To use the Azure Storage Service, you will need to create and configure a Storage Account in the Azure portal.

  1. Azure Portalにログインします。Log in to the Azure Portal.

    注意

    まだ Azure アカウントを持っていない場合は、アカウントを作成する必要があります。If you do not already have an Azure account, you will need to create one. このチュートリアルを教室またはラボの状況で行っている場合は、新しいアカウントの設定について、インストラクターまたはそのいずれかの対処を依頼してください。If you are following this tutorial in a classroom or lab situation, ask your instructor or one of the proctors for help setting up your new account.

  2. ログインしたら、左上隅にある [新規] をクリックし、[ストレージアカウント] を検索して、 Enter キーを押します。Once you are logged in, click on New in the top left corner, and search for Storage account, and click Enter.

    azure storage の検索

    注意

    新しいポータルで、 Newという単語がリソースの作成に置き換えられました。The word New may have been replaced with Create a resource, in newer portals.

  3. 新しいページには、 Azure Storage アカウントサービスの説明が表示されます。The new page will provide a description of the Azure Storage account service. このプロンプトの左下にある [作成] ボタンを選択して、このサービスとの関連付けを作成します。At the bottom left of this prompt, select the Create button, to create an association with this service.

    サービスの作成

  4. 作成:Once you have clicked on Create:

    1. アカウントの名前を挿入します。このフィールドには数字と小文字のみを使用できることに注意してください。Insert a Name for your account, be aware this field only accepts numbers, and lowercase letters.

    2. [デプロイモデル] で、[リソースマネージャー] を選択します。For Deployment model, select Resource manager.

    3. [アカウントの種類] で、[ストレージ (汎用 v1) ] を選択します。For Account kind, select Storage (general purpose v1).

    4. リソースグループの場所を決定します (新しいリソースグループを作成している場合)。Determine the Location for your resource group (if you are creating a new Resource Group). この場所は、アプリケーションを実行するリージョンに配置するのが理想的です。The location would ideally be in the region where the application would run. 一部の Azure 資産は、特定のリージョンでのみ利用できます。Some Azure assets are only available in certain regions.

    5. レプリケーションの場合は、[読み取りアクセス-geo 冗長ストレージ (RA-GRS) ] を選択します。For Replication select Read-access-geo-redundant storage (RA-GRS).

    6. [パフォーマンス] で [標準] を選択します。For Performance, select Standard.

    7. 安全な転送は無効のまましておく必要があります。Leave Secure transfer required as Disabled.

    8. サブスクリプションを選択します。Select a Subscription.

    9. リソースグループを選択するか、新しいリソースグループを作成します。Choose a Resource Group or create a new one. リソースグループは、Azure 資産のコレクションの課金を監視、制御する方法を提供します。A resource group provides a way to monitor, control access, provision and manage billing for a collection of Azure assets. 1つのプロジェクトに関連付けられているすべての Azure サービス (たとえば、これらのラボなど) を共通のリソースグループに保持することをお勧めします。It is recommended to keep all the Azure services associated with a single project (e.g. such as these labs) under a common resource group).

      Azure リソースグループの詳細については、リソースグループに関する記事をご覧ください。If you wish to read more about Azure Resource Groups, please visit the resource group article.

    10. また、このサービスに適用されている使用条件を理解していることを確認する必要があります。You will also need to confirm that you have understood the Terms and Conditions applied to this Service.

    11. [作成] を選択します。Select Create.

      入力サービス情報

  5. [作成] をクリックした後、サービスが作成されるまで待機する必要があります。これには1分かかることがあります。Once you have clicked on Create, you will have to wait for the service to be created, this might take a minute.

  6. サービスインスタンスが作成されると、ポータルに通知が表示されます。A notification will appear in the portal once the Service instance is created.

    azure ポータルでの新しい通知

  7. 通知をクリックして、新しいサービスインスタンスを探索します。Click on the notifications to explore your new Service instance.

    リソースにアクセス

  8. 通知の [リソースへのジャンプ] ボタンをクリックして、新しいサービスインスタンスを探索します。Click the Go to resource button in the notification to explore your new Service instance. 新しいストレージアカウントのサービスインスタンスが表示されます。You will be taken to your new Storage account service instance.

    アクセスキー

  9. [アクセスキー] をクリックして、このクラウドサービスのエンドポイントを表示します。Click Access keys, to reveal the endpoints for this cloud service. メモ帳または同様の方法を使用して、後で使用するためにいずれかのキーをコピーします。Use Notepad or similar, to copy one of your keys for use later. また、接続文字列の値もメモしておいてください。これは、後で作成するazureservicesクラスで使用されるためです。Also, note the Connection string value, as it will be used in the AzureServices class, which you will create later.

    接続文字列のコピー

Chapter 2-Azure 関数の設定Chapter 2 - Setting up an Azure Function

次に、azure サービスでazure 関数を作成します。You will now write an Azure Function in the Azure Service.

Azure 関数を使用すると、コード内で従来の関数を使用した場合とほぼ同じ処理を行うことができます。これは、azure アカウントにアクセスするための資格情報を持つ任意のアプリケーションからこの関数にアクセスできるという点です。You can use an Azure Function to do nearly anything that you would do with a classic function in your code, the difference being that this function can be accessed by any application that has credentials to access your Azure Account.

Azure 関数を作成するには、次のようにします。To create an Azure Function:

  1. Azure Portalで、左上隅にある [新規] をクリックし、 Function Appを検索して、 Enter キーを押します。From your Azure Portal, click on New in the top left corner, and search for Function App, and click Enter.

    function app の作成

    注意

    新しいポータルで、 Newという単語がリソースの作成に置き換えられました。The word New may have been replaced with Create a resource, in newer portals.

  2. 新しいページには、 Azure Function Appサービスの説明が表示されます。The new page will provide a description of the Azure Function App service. このプロンプトの左下にある [作成] ボタンを選択して、このサービスとの関連付けを作成します。At the bottom left of this prompt, select the Create button, to create an association with this service.

    関数アプリの情報

  3. 作成:Once you have clicked on Create:

    1. アプリ名を指定します。Provide an App name. ここでは、文字と数字のみを使用できます (大文字または小文字を使用できます)。Only letters and numbers can be used here (either upper or lower case is allowed).

    2. 任意のサブスクリプションを選択します。Select your preferred Subscription.

    3. リソースグループを選択するか、新しいリソースグループを作成します。Choose a Resource Group or create a new one. リソースグループは、Azure 資産のコレクションの課金を監視、制御する方法を提供します。A resource group provides a way to monitor, control access, provision and manage billing for a collection of Azure assets. 1つのプロジェクトに関連付けられているすべての Azure サービス (たとえば、これらのラボなど) を共通のリソースグループに保持することをお勧めします。It is recommended to keep all the Azure services associated with a single project (e.g. such as these labs) under a common resource group).

      Azure リソースグループの詳細については、リソースグループに関する記事をご覧ください。If you wish to read more about Azure Resource Groups, please visit the resource group article.

    4. この演習では、選択したOSとして [ Windows ] を選択します。For this exercise, select Windows as the chosen OS.

    5. ホスティングプラン従量課金プランを選択します。Select Consumption Plan for the Hosting Plan.

    6. リソースグループの場所を決定します (新しいリソースグループを作成している場合)。Determine the Location for your resource group (if you are creating a new Resource Group). この場所は、アプリケーションを実行するリージョンに配置するのが理想的です。The location would ideally be in the region where the application would run. 一部の Azure 資産は、特定のリージョンでのみ利用できます。Some Azure assets are only available in certain regions. 最適なパフォーマンスを得るには、ストレージアカウントと同じリージョンを選択します。For optimal performance, select the same region as the storage account.

    7. [ストレージ] で、[既存のものを使用] を選択し、ドロップダウンメニューを使用して、以前に作成したストレージを検索します。For Storage, select Use existing, and then using the dropdown menu, find your previously created storage.

    8. この演習では、 Application Insightsオフのままにします。Leave Application Insights off for this exercise.

      入力関数アプリの詳細

  4. [作成] をクリックします。Click the Create button.

  5. [作成] をクリックした後、サービスが作成されるまで待機する必要があります。これには1分かかることがあります。Once you have clicked on Create, you will have to wait for the service to be created, this might take a minute.

  6. サービスインスタンスが作成されると、ポータルに通知が表示されます。A notification will appear in the portal once the Service instance is created.

    新しい azure portal の通知

  7. 通知をクリックして、新しいサービスインスタンスを探索します。Click on the notifications to explore your new Service instance.

    リソース関数アプリにアクセス

  8. 通知の [リソースへのジャンプ] ボタンをクリックして、新しいサービスインスタンスを探索します。Click the Go to resource button in the notification to explore your new Service instance. 新しいFunction Appサービスインスタンスが表示されます。You will be taken to your new Function App service instance.

  9. Function Appダッシュボードで、左側のパネルにある関数の上にマウスポインターを置き、プラス記号 (+) をクリックします。On the Function App dashboard, hover your mouse over Functions, found within the panel on the left, and then click the + (plus) symbol.

    新しい関数の作成

  10. 次のページで、[ Webhook + API ] が選択されていることを確認し、[言語の選択] で [ CSharp] を選択します。このチュートリアルで使用する言語です。On the next page, ensure Webhook + API is selected, and for Choose a language, select CSharp, as this will be the language used for this tutorial. 最後に、[この関数を作成] ボタンをクリックします。Lastly, click the Create this function button.

    web フック csharp を選択します

  11. コードページ (csx を実行します) に移動します (ただし、それ以外の場合は、左側のパネル内の [関数] ボックスの一覧で新しく作成した関数をクリックします)。You should be taken to the code page (run.csx), if not though, click on the newly created Function in the Functions list within the panel on the left.

    新しい関数を開く

  12. 関数に次のコードをコピーします。Copy the following code into your function. この関数は、呼び出されたときに、0から2までのランダムな整数を返します。This function will simply return a random integer between 0 and 2 when called. 既存のコードについて心配しないでください。一番上に貼り付けてもかまいません。Do not worry about the existing code, feel free to paste over the top of it.

        using System.Net;
        using System.Threading.Tasks;
    
        public static int Run(CustomObject req, TraceWriter log)
        {
            Random rnd = new Random();
            int randomInt = rnd.Next(0, 3);
            return randomInt;
        }
    
        public class CustomObject
        {
            public String name {get; set;}
        }
    
  13. [保存] を選択します。Select Save.

  14. 結果は次の図のようになります。The result should look like the image below.

  15. [関数の URL の取得] をクリックし、表示されているエンドポイントを書き留めます。Click on Get function URL and take note of the endpoint displayed. このコースの後半で作成するAzureservicesクラスに挿入する必要があります。You will need to insert it into the AzureServices class that you will create later in this course.

    関数エンドポイントを取得する

    関数エンドポイントを取得する

章 3-Unity プロジェクトの設定Chapter 3 - Setting up the Unity project

次に示すのは、Mixed Reality で開発するための一般的な設定です。そのため、他のプロジェクトに適したテンプレートです。The following is a typical set up for developing with Mixed Reality, and as such, is a good template for other projects.

Mixed reality のイマーシブヘッドセットをセットアップしてテストします。Set up and test your mixed reality immersive headset.

注意

このコースでは、モーションコントローラーは必要ありませんYou will not require Motion Controllers for this course. イマーシブヘッドセットの設定をサポートする必要がある場合は、 mixed reality のセットアップに関する記事をご覧ください。If you need support setting up the immersive headset, please visit the mixed reality set up article.

  1. Unity を開き、[新規] をクリックします。Open Unity and click New.

    新しい unity プロジェクトの作成

  2. ここで、Unity プロジェクト名を指定する必要があります。You will now need to provide a Unity Project name. MR_Azure_Functionsを挿入します。Insert MR_Azure_Functions. プロジェクトの種類が3dに設定されていることを確認します。Make sure the project type is set to 3D. 場所を適切な場所に設定します (ルートディレクトリの方が適していることに注意してください)。Set the Location to somewhere appropriate for you (remember, closer to root directories is better). 次に、[プロジェクトの作成] をクリックします。Then, click Create project.

    新しい unity プロジェクトに名前を付ける

  3. 既定値を確認する必要が開いている Unity、 スクリプト エディター に設定されている Visual Studio します。With Unity open, it is worth checking the default Script Editor is set to Visual Studio. [設定編集 > ] に移動し、新しいウィンドウで [外部ツール] に移動します。Go to Edit > Preferences and then from the new window, navigate to External Tools. 変更 External Script EditorVisual Studio 2017 します。Change External Script Editor to Visual Studio 2017. [基本設定] ウィンドウを閉じます。Close the Preferences window.

    visual studio をスクリプトエディターとして設定する

  4. 次に、[ファイル > ] [ビルドの設定] の順に移動し、[プラットフォームの切り替え] ボタンをクリックして、プラットフォームをユニバーサル Windows プラットフォームに切り替えます。Next, go to File > Build Settings and switch the platform to Universal Windows Platform, by clicking on the Switch Platform button.

    プラットフォームを uwp に切り替える

  5. ファイル > のビルド設定にアクセスして、次のことを確認してください。Go to File > Build Settings and make sure that:

    1. ターゲットデバイス、任意のデバイスに設定されます。Target Device is set to Any Device.

      Microsoft HoloLens の場合は、ターゲットデバイスHoloLensに設定します。For Microsoft HoloLens, set Target Device to HoloLens.

    2. ビルドの種類D3Dに設定されていますBuild Type is set to D3D

    3. SDKは最新のインストールに設定されていますSDK is set to Latest installed

    4. Visual Studio のバージョンが、インストールされている最新バージョンに設定されていますVisual Studio Version is set to Latest installed

    5. ビルドと実行ローカルコンピューターに設定されていますBuild and Run is set to Local Machine

    6. シーンを保存し、ビルドに追加します。Save the scene and add it to the build.

      1. これを行うには、[開いているシーンの追加] を選択します。Do this by selecting Add Open Scenes. 保存ウィンドウが表示されます。A save window will appear.

        オープンシーンを追加する

      2. この新しいフォルダーを作成し、今後のシーンに加えて、[新しいフォルダー ] ボタンを選択します。新しいフォルダーを作成するには、名前を「シーン」にします。Create a new folder for this, and any future, scene, then select the New folder button, to create a new folder, name it Scenes.

        シーンフォルダーの作成

      3. 新しく作成された [シーン] フォルダーを開き、[ファイル名: テキスト] フィールドに「[アプリケーション]」と入力し、[保存] をクリックします。Open your newly created Scenes folder, and then in the File name: text field, type FunctionsScene, then press Save.

        関数シーンの保存

  6. それ以外の設定は、[ビルド設定] の [既定] のままにしておきます。The remaining settings, in Build Settings, should be left as default for now.

    関数シーンの保存

  7. [ビルドの設定] ウィンドウで、[プレーヤーの設定] ボタンをクリックします。これにより、インスペクターが配置されている領域の関連パネルが開きます。In the Build Settings window, click on the Player Settings button, this will open the related panel in the space where the Inspector is located.

    インスペクターのプレーヤー設定

  8. このパネルでは、いくつかの設定を確認する必要があります。In this panel, a few settings need to be verified:

    1. [その他の設定] タブで、次のようにします。In the Other Settings tab:

      1. Scripting Runtime のバージョン実験的(.net 4.6 と同等) である必要があります。これにより、エディターを再起動する必要が生じます。Scripting Runtime Version should be Experimental (.NET 4.6 Equivalent), which will trigger a need to restart the Editor.
      2. バックエンド.netである必要がありますScripting Backend should be .NET
      3. API 互換性レベル.net 4.6である必要がありますAPI Compatibility Level should be .NET 4.6
    2. [発行の設定] タブの [機能] で、次の項目を確認します。Within the Publishing Settings tab, under Capabilities, check:

      • InternetClientInternetClient

        機能の設定

    3. パネルの下にある [ XR settings (発行設定] の下にあります) で、[ Virtual Reality がサポートされている] をオンにして、 Windows Mixed reality SDKが追加されていることを確認します。Further down the panel, in XR Settings (found below Publishing Settings), tick Virtual Reality Supported, make sure the Windows Mixed Reality SDK is added.

      XR 設定の設定

  9. ビルド設定に戻るUnity C#プロジェクトはグレーで表示されなくなりました。このの横にあるチェックボックスをオンにします。Back in Build Settings Unity C# Projects is no longer greyed out; tick the checkbox next to this.

    c# プロジェクトの tick

  10. [ビルドの設定] ウィンドウを閉じます。Close the Build Settings window.

  11. シーンとプロジェクトを保存します (ファイル > 保存シーン/ファイル > 保存プロジェクト)。Save your Scene and Project (FILE > SAVE SCENE / FILE > SAVE PROJECT).

第4章-セットアップのメインカメラChapter 4 - Setup Main Camera

重要

このコースの構成要素をスキップして、コードに直接進む場合は、 unitypackage をダウンロードして、カスタムパッケージとしてプロジェクトにインポートしてください。If you wish to skip the Unity Set up components of this course, and continue straight into code, feel free to download this .unitypackage, and import it into your project as a Custom Package. これには、次の章の Dll も含まれます。This will also contain the DLLs from the next Chapter. インポート後、第7章から続行します。After import, continue from Chapter 7.

  1. [階層] パネルには、メインカメラと呼ばれるオブジェクトが表示されます。このオブジェクトは、アプリケーションの "内側" にある "ヘッド" ポイントを表します。In the Hierarchy Panel, you will find an object called Main Camera, this object represents your "head" point of view once you are "inside" your application.

  2. Unity ダッシュボードを前面に表示し、カメラのメインのユーザーオブジェクトを選択します。With the Unity Dashboard in front of you, select the Main Camera GameObject. [インスペクター] パネル(通常はダッシュボード内の右側にあります) には、そのユーザーのオブジェクトのさまざまなコンポーネントが表示されます。これには、上部にある [変換]、[カメラ]、および他のコンポーネントがあります。You will notice that the Inspector Panel (generally found to the right, within the Dashboard) will show the various components of that GameObject, with Transform at the top, followed by Camera, and some other components. メインカメラの変換をリセットして、正しく配置されるようにする必要があります。You will need to reset the Transform of the Main Camera, so it is positioned correctly.

  3. これを行うには、カメラの変換コンポーネントの横にある歯車アイコンを選択し、[リセット] を選択します。To do this, select the Gear icon next to the Camera's Transform component, and select Reset.

    変換のリセット

  4. 次に、変換コンポーネントを次のように更新します。Then update the Transform component to look like:

    変換-位置TRANSFORM - POSITION
    XX 前年Y ZZ
    00 11 00
    変換-回転TRANSFORM - ROTATION
    XX 前年Y ZZ
    00 00 00
    変換-スケールTRANSFORM - SCALE
    XX 前年Y ZZ
    11 11 11

    カメラの変換の設定

章 5-Unity シーンの設定Chapter 5 - Setting up the Unity scene

  1. [階層] パネルの空の領域を右クリックし、[ 3d オブジェクト] の下に平面を追加します。Right-click in an empty area of the Hierarchy Panel, under 3D Object, add a Plane.

    新しい平面の作成

  2. [平面] オブジェクトを選択した状態で、[インスペクター] パネルの次のパラメーターを変更します。With the Plane object selected, change the following parameters in the Inspector Panel:

    変換-位置TRANSFORM - POSITION
    XX 前年Y ZZ
    00 00 44
    変換-スケールTRANSFORM - SCALE
    XX 前年Y ZZ
    1010 11 1010

    平面の位置とスケールの設定

    平面のシーンビュー

  3. [階層] パネルの空の領域を右クリックし、[ 3d オブジェクト] の下にキューブを追加します。Right-click in an empty area of the Hierarchy Panel, under 3D Object, add a Cube.

    1. キューブの名前をGazeButtonに変更します (キューブが選択されている状態で、[F2] を押します)。Rename the Cube to GazeButton (with the Cube selected, press 'F2').

    2. [インスペクター] パネルで、次のパラメーターを変更します。Change the following parameters in the Inspector Panel:

      変換-位置TRANSFORM - POSITION
      XX 前年Y ZZ
      00 33 55

      宝石ボタンの変換の設定

      宝石ボタンシーンビュー

    3. [タグ]ドロップダウンボタンをクリックし、[タグの追加] をクリックして [タグ & レイヤー] ペインを開きます。Click on the Tag drop-down button and click on Add Tag to open the Tags & Layers Pane.

      新しいタグの追加

      プラスを選択

    4. + (正符号) ボタンを選択し、[新しいタグ名] フィールドに「 GazeButton」と入力して、[保存] をクリックします。Select the + (plus) button, and in the New Tag Name field, enter GazeButton, and press Save.

      新しいタグに名前を付ける

    5. 階層パネルGazeButtonオブジェクトをクリックし、[インスペクター] パネルで新しく作成されたGazeButtonタグを割り当てます。Click on the GazeButton object in the Hierarchy Panel, and in the Inspector Panel, assign the newly created GazeButton tag.

      新しいタグを宝石ボタンに割り当てる

  4. [階層] パネルGazeButtonオブジェクトを右クリックし、[のオブジェクト] (オブジェクトとして追加される) を追加します。Right-click on the GazeButton object, in the Hierarchy Panel, and add an Empty GameObject (which will be added as a child object).

  5. 新しいオブジェクトを選択し、名前をShapeSpawnPointに変更します。Select the new object and rename it ShapeSpawnPoint.

    1. [インスペクター] パネルで、次のパラメーターを変更します。Change the following parameters in the Inspector Panel:

      変換-位置TRANSFORM - POSITION
      XX 前年Y ZZ
      00 -1-1 00

      図形生成ポイント変換の更新

      シェイプ生成ポイントシーンビュー

  6. 次に、Azure サービスの状態に関するフィードバックを提供する3D テキストオブジェクトを作成します。Next you will create a 3D Text object to provide feedback on the status of the Azure service.

    階層パネルでGazeButtonをもう一度右クリックし、 3d オブジェクト > 3d テキストオブジェクトをとして追加します。Right click on the GazeButton in the Hierarchy Panel again and add a 3D Object > 3D Text object as a child.

    新しい3D テキストオブジェクトの作成

  7. 3D テキストオブジェクトの名前をAzureStatusTextに変更します。Rename the 3D Text object to AzureStatusText.

  8. AzureStatusTextオブジェクトの変換を次のように変更します。Change the AzureStatusText object Transform as follows:

    変換-位置TRANSFORM - POSITION
    XX 前年Y ZZ
    00 00 -0.6-0.6
    変換-スケールTRANSFORM - SCALE
    XX 前年Y ZZ
    0.10.1 0.10.1 0.10.1

    注意

    次のテキストメッシュコンポーネントが更新されたときに修正されるため、センター外であるように見える場合は心配しないでください。Do not worry if it appears to be off-centre, as this will be fixed when the below Text Mesh component is updated.

  9. 次のようにテキストメッシュコンポーネントを変更します。Change the Text Mesh component to match the below:

    テキストメッシュコンポーネントの設定

    ヒント

    ここで選択した色は、16進数の色です。000000Ffでも、自由に選択できますが、読み取り可能であることを確認してください。The selected color here is Hex color: 000000FF, though feel free to choose your own, just ensure it is readable.

  10. 階層パネルの構造は次のようになります。Your Hierarchy Panel structure should now look like this:

    シーンビューのテキストメッシュ

  11. シーンは次のようになります。Your scene should now look like this:

    シーンビューのテキストメッシュ

Chapter 6-Unity 用の Azure Storage のインポートChapter 6 - Import Azure Storage for Unity

Azure Storage for Unity を使用します (これ自体が .Net SDK for Azure を利用します)。You will be using Azure Storage for Unity (which itself leverages the .Net SDK for Azure). 詳細については、 「Unity の Azure Storage」を参照してください。You can read more about this at the Azure Storage for Unity article.

現在、Unity には、インポート後にプラグインを再構成する必要がある既知の問題があります。There is currently a known issue in Unity which requires plugins to be reconfigured after import. バグが解決された後、これらの手順 (このセクションでは 4-7) は不要になりました。These steps (4 - 7 in this section) will no longer be required after the bug has been resolved.

SDK を独自のプロジェクトにインポートするには、最新の". unitypackage" を GitHub からダウンロードしていることを確認します。To import the SDK into your own project, make sure you have downloaded the latest '.unitypackage' from GitHub. その後、次の手順を実行します。Then, do the following:

  1. [Assets > Import package Custom > package (カスタムパッケージのインポート)] メニューオプションを使用して、unitypackage ファイルを Unity に追加します。Add the .unitypackage file to Unity by using the Assets > Import Package > Custom Package menu option.

  2. ポップアップ表示される [ Unity パッケージのインポート] ボックスで、[プラグイン > ストレージ] の下のすべてを選択できます。In the Import Unity Package box that pops up, you can select everything under Plugin > Storage. このコースでは不要なため、他のすべてをオフにします。Uncheck everything else, as it is not needed for this course.

    パッケージへのインポート

  3. [インポート] ボタンをクリックして、プロジェクトに項目を追加します。Click the Import button to add the items to your project.

  4. [プロジェクト] ビューの [プラグイン] の下にあるストレージフォルダーにアクセスし、次のプラグインのみを選択します。Go to the Storage folder under Plugins, in the Project view, and select the following plugins only:

    • Microsoft.Data.EdmMicrosoft.Data.Edm

    • Microsoft. Data. ODataMicrosoft.Data.OData

    • Windowsazure.servicebusMicrosoft.WindowsAzure.Storage

    • Newtonsoft. JsonNewtonsoft.Json

    • System.SpatialSystem.Spatial

      プラットフォームをすべてオフにする

  5. これらの特定のプラグインを選択した状態で、任意のプラットフォームオフ にし、 [ wsaplayer ]、[適用] の順にクリックします。With these specific plugins selected, uncheck Any Platform and uncheck WSAPlayer then click Apply.

    プラットフォーム dll を適用する

    注意

    これらの特定のプラグインを Unity エディターでのみ使用するようにマークしています。We are marking these particular plugins to only be used in the Unity Editor. これは、プロジェクトが Unity からエクスポートされた後に使用される、WSA フォルダー内に同じプラグインの異なるバージョンがあるためです。This is because there are different versions of the same plugins in the WSA folder that will be used after the project is exported from Unity.

  6. [ストレージプラグイン] フォルダーで、[のみ] を選択します。In the Storage plugin folder, select only:

    • Microsoft. Data. Service. ClientMicrosoft.Data.Services.Client

      dll のプロセスを設定しない

  7. [プラットフォームの設定] の [処理しない] チェックボックスをオンにし、[適用] をクリックします。Check the Don't Process box under Platform Settings and click Apply.

    処理を適用しない

    注意

    Unity アセンブリ patcher がこのプラグインを処理するのが困難であるため、このプラグインを "処理しない" としてマークしています。We are marking this plugin "Don't process" because the Unity assembly patcher has difficulty processing this plugin. このプラグインは、処理されていなくても動作します。The plugin will still work even though it is not processed.

第7章-AzureServices クラスの作成Chapter 7 - Create the AzureServices class

最初に作成するクラスは、 Azureservicesクラスです。The first class you are going to create is the AzureServices class.

Azureservicesクラスは次のことを担当します。The AzureServices class will be responsible for:

  • Azure アカウントの資格情報を保存しています。Storing Azure Account credentials.

  • Azure アプリ関数を呼び出しています。Calling your Azure App Function.

  • Azure クラウドストレージ内のデータファイルのアップロードとダウンロード。The upload and download of the data file in your Azure Cloud Storage.

このクラスを作成するには:To create this Class:

  1. [プロジェクト] パネルの [フォルダー作成 > ] で、アセットフォルダーを右クリックします。Right-click in the Asset Folder, located in the Project Panel, Create > Folder. フォルダーにスクリプトの名前を指定します。Name the folder Scripts.

    新しいフォルダーの作成

    呼び出しフォルダー-スクリプト

  2. 先ほど作成したフォルダーをダブルクリックして開きます。Double click on the folder just created, to open it.

  3. フォルダー内を右クリックし、[ C#スクリプト作成 > ] をクリックします。Right-click inside the folder, Create > C# Script. Azureservicesスクリプトを呼び出します。Call the script AzureServices.

  4. 新しいAzureservicesクラスをダブルクリックして、 Visual Studioで開きます。Double click on the new AzureServices class to open it with Visual Studio.

  5. Azureservicesの先頭に次の名前空間を追加します。Add the following namespaces to the top of the AzureServices:

        using System;
        using System.Threading.Tasks;
        using UnityEngine;
        using Microsoft.WindowsAzure.Storage;
        using Microsoft.WindowsAzure.Storage.File;
        using System.IO;
        using System.Net;
    
  6. Azureservicesクラス内に次のインスペクターフィールドを追加します。Add the following Inspector Fields inside the AzureServices class:

        /// <summary>
        /// Provides Singleton-like behavior to this class.
        /// </summary>
        public static AzureServices instance;
    
        /// <summary>
        /// Reference Target for AzureStatusText Text Mesh object
        /// </summary>
        public TextMesh azureStatusText;
    
  7. 次に、 Azureservicesクラス内に次のメンバー変数を追加します。Then add the following member variables inside the AzureServices class:

        /// <summary>
        /// Holds the Azure Function endpoint - Insert your Azure Function
        /// Connection String here.
        /// </summary>
    
        private readonly string azureFunctionEndpoint = "--Insert here you AzureFunction Endpoint--";
    
        /// <summary>
        /// Holds the Storage Connection String - Insert your Azure Storage
        /// Connection String here.
        /// </summary>
        private readonly string storageConnectionString = "--Insert here you AzureStorage Connection String--";
    
        /// <summary>
        /// Name of the Cloud Share - Hosts directories.
        /// </summary>
        private const string fileShare = "fileshare";
    
        /// <summary>
        /// Name of a Directory within the Share
        /// </summary>
        private const string storageDirectory = "storagedirectory";
    
        /// <summary>
        /// The Cloud File
        /// </summary>
        private CloudFile shapeIndexCloudFile;
    
        /// <summary>
        /// The Linked Storage Account
        /// </summary>
        private CloudStorageAccount storageAccount;
    
        /// <summary>
        /// The Cloud Client
        /// </summary>
        private CloudFileClient fileClient;
    
        /// <summary>
        /// The Cloud Share - Hosts Directories
        /// </summary>
        private CloudFileShare share;
    
        /// <summary>
        /// The Directory in the share that will host the Cloud file
        /// </summary>
        private CloudFileDirectory dir;
    

    重要

    エンドポイント接続文字列の値は、azure Portal の azure storage の値に置き換えてください。Make sure you replace the endpoint and connection string values with the values from your Azure storage, found in the Azure Portal

  8. 起動可能な () メソッドとStart () メソッドのコードを追加する必要があります。Code for Awake() and Start() methods now needs to be added. これらのメソッドは、クラスの初期化時に呼び出されます。These methods will be called when the class initializes:

        private void Awake()
        {
            instance = this;
        }
    
        // Use this for initialization
        private void Start()
        {
            // Set the Status text to loading, whilst attempting connection to Azure.
            azureStatusText.text = "Loading...";
        }
    
        /// <summary>
        /// Call to the Azure Function App to request a Shape.
        /// </summary>
        public async void CallAzureFunctionForNextShape()
        {
    
        }
    

    重要

    CallAzureFunctionForNextShape () のコードについては、今後ので説明します。We will fill in the code for CallAzureFunctionForNextShape() in a future Chapter.

  9. Update () メソッドは、このクラスでは使用されないため、削除します。Delete the Update() method since this class will not use it.

  10. 変更内容を Visual Studio に保存し、Unity に戻ります。Save your changes in Visual Studio, and then return to Unity.

  11. [スクリプト] フォルダーの [ Azureservices ] クラスをクリックし、[階層] パネルの [メインカメラ] オブジェクトにドラッグします。Click and drag the AzureServices class from the Scripts folder to the Main Camera object in the Hierarchy Panel.

  12. メインカメラを選択してから、 GazeButtonオブジェクトの下にあるAzureStatusText子オブジェクトを取得し、それをインスペクターのAzureStatusText reference target フィールドに配置して、 AzureServicesスクリプト。Select the Main Camera, then grab the AzureStatusText child object from beneath the GazeButton object, and place it within the AzureStatusText reference target field, in the Inspector, to provide the reference to the AzureServices script.

    azure 状態テキスト参照ターゲットの割り当て

章 8-図形ファクトリクラスを作成するChapter 8 - Create the ShapeFactory class

次に作成するスクリプトは、図形ファクトリクラスです。The next script to create, is the ShapeFactory class. このクラスの役割は、要求されたときに新しい図形を作成し、図形の履歴リストに作成された図形の履歴を保持することです。The role of this class is to create a new shape, when requested, and keep a history of the shapes created in a Shape History List. 図形が作成されるたびに、 Azureserviceクラスで図形の履歴リストが更新され、 Azure Storageに格納されます。Every time a shape is created, the Shape History list is updated in the AzureService class, and then stored in your Azure Storage. アプリケーションの起動時に、 Azure Storageに格納されているファイルが見つかった場合は、図形の履歴リストが取得され、再生されます。これには、生成された図形がストレージからのものであるか、新しいものであるかを示す3d テキストオブジェクトがあります。When the application starts, if a stored file is found in your Azure Storage, the Shape History list is retrieved and replayed, with the 3D Text object providing whether the generated shape is from storage, or new.

このクラスを作成するには:To create this class:

  1. 前に作成したScriptsフォルダーにアクセスします。Go to the Scripts folder you created previously.

  2. フォルダー内を右クリックし、[ C#スクリプト作成 > ] をクリックします。Right-click inside the folder, Create > C# Script. スクリプト図形ファクトリを呼び出します。Call the script ShapeFactory.

  3. 新しい [図形ファクトリ] スクリプトをダブルクリックして、 Visual Studioで開きます。Double click on the new ShapeFactory script to open it with Visual Studio.

  4. 図形ファクトリクラスに次の名前空間が含まれていることを確認します。Ensure the ShapeFactory class includes the following namespaces:

        using System.Collections.Generic;
        using UnityEngine;
    
  5. 次に示す変数を [図形ファクトリ] クラスに追加し、 Start () 関数と [起動前 ( )] 関数を次の関数に置き換えます。Add the variables shown below to the ShapeFactory class, and replace the Start() and Awake() functions with those below:

        /// <summary>
        /// Provide this class Singleton-like behaviour
        /// </summary>
        [HideInInspector]
        public static ShapeFactory instance;
    
        /// <summary>
        /// Provides an Inspector exposed reference to ShapeSpawnPoint
        /// </summary>
        [SerializeField]
        public Transform spawnPoint;
    
        /// <summary>
        /// Shape History Index
        /// </summary>
        [HideInInspector]
        public List<int> shapeHistoryList;
    
        /// <summary>
        /// Shapes Enum for selecting required shape
        /// </summary>
        private enum Shapes { Cube, Sphere, Cylinder }
    
        private void Awake()
        {
            instance = this;
        }
    
        private void Start()
        {
            shapeHistoryList = new List<int>();
        }
    
  6. CreateShape () メソッドは、指定された整数パラメーターに基づいて、プリミティブ形状を生成します。The CreateShape() method generates the primitive shapes, based upon the provided integer parameter. ブール型パラメーターを使用して、現在作成されている図形がストレージからのものであるか、または新しいものであるかを指定します。The Boolean parameter is used to specify whether the currently created shape is from storage, or new. 次のコードを、前のメソッドの下にある図形ファクトリクラスに配置します。Place the following code in your ShapeFactory class, below the previous methods:

        /// <summary>
        /// Use the Shape Enum to spawn a new Primitive object in the scene
        /// </summary>
        /// <param name="shape">Enumerator Number for Shape</param>
        /// <param name="storageShape">Provides whether this is new or old</param>
        internal void CreateShape(int shape, bool storageSpace)
        {
            Shapes primitive = (Shapes)shape;
            GameObject newObject = null;
            string shapeText = storageSpace == true ? "Storage: " : "New: ";
    
            AzureServices.instance.azureStatusText.text = string.Format("{0}{1}", shapeText, primitive.ToString());
    
            switch (primitive)
            {
                case Shapes.Cube:
                newObject = GameObject.CreatePrimitive(PrimitiveType.Cube);
                break;
    
                case Shapes.Sphere:
                newObject = GameObject.CreatePrimitive(PrimitiveType.Sphere);
                break;
    
                case Shapes.Cylinder:
                newObject = GameObject.CreatePrimitive(PrimitiveType.Cylinder);
                break;
            }
    
            if (newObject != null)
            {
                newObject.transform.position = spawnPoint.position;
    
                newObject.transform.localScale = new Vector3(0.5f, 0.5f, 0.5f);
    
                newObject.AddComponent<Rigidbody>().useGravity = true;
    
                newObject.GetComponent<Renderer>().material.color = UnityEngine.Random.ColorHSV(0f, 1f, 1f, 1f, 0.5f, 1f);
            }
        }
    
  7. Unity に戻る前に、変更内容を Visual Studio に保存してください。Be sure to save your changes in Visual Studio before returning to Unity.

  8. Unity エディターに戻り、[スクリプト] フォルダーの [図形ファクトリ] クラスをクリックして、[階層] パネルの [メインカメラ] オブジェクトにドラッグします。Back in the Unity Editor, click and drag the ShapeFactory class from the Scripts folder to the Main Camera object in the Hierarchy Panel.

  9. メインカメラを選択すると、図形ファクトリスクリプトコンポーネントに生成ポイント参照がありません。With the Main Camera selected you will notice the ShapeFactory script component is missing the Spawn Point reference. この問題を解決するには、 ShapeSpawnPointオブジェクトを [階層] パネルから [生成ポイント参照] ターゲットにドラッグします。To fix it, drag the ShapeSpawnPoint object from the Hierarchy Panel to the Spawn Point reference target.

    図形ファクトリ参照ターゲットの設定

第9章-宝石クラスを作成するChapter 9 - Create the Gaze class

作成する必要がある最後のスクリプトは、宝石クラスです。The last script you need to create is the Gaze class.

このクラスは、ユーザーが参照しているオブジェクトを検出するために、メインカメラから投影されるRaycastを作成します。This class is responsible for creating a Raycast that will be projected forward from the Main Camera, to detect which object the user is looking at. この場合、Raycast は、ユーザーがシーン内のGazeButtonオブジェクトを調べて動作をトリガーするかどうかを識別する必要があります。In this case, the Raycast will need to identify if the user is looking at the GazeButton object in the scene and trigger a behavior.

このクラスを作成するには:To create this Class:

  1. 前に作成したScriptsフォルダーにアクセスします。Go to the Scripts folder you created previously.

  2. [プロジェクト] パネル内を右クリックし、[ C#スクリプト作成 > ] をクリックします。Right-click in the Project Panel, Create > C# Script. スクリプトを見つめて呼び出します。Call the script Gaze.

  3. 新しい宝石のスクリプトをダブルクリックして、 Visual Studio で開きます。Double click on the new Gaze script to open it with Visual Studio.

  4. スクリプトの先頭に次の名前空間が含まれていることを確認します。Ensure the following namespace is included at the top of the script:

        using UnityEngine;
    
  5. 次に、次の変数を、宝石クラス内に追加します。Then add the following variables inside the Gaze class:

        /// <summary>
        /// Provides Singleton-like behavior to this class.
        /// </summary>
        public static Gaze instance;
    
        /// <summary>
        /// The Tag which the Gaze will use to interact with objects. Can also be set in editor.
        /// </summary>
        public string InteractibleTag = "GazeButton";
    
        /// <summary>
        /// The layer which will be detected by the Gaze ('~0' equals everything).
        /// </summary>
        public LayerMask LayerMask = ~0;
    
        /// <summary>
        /// The Max Distance the gaze should travel, if it has not hit anything.
        /// </summary>
        public float GazeMaxDistance = 300;
    
        /// <summary>
        /// The size of the cursor, which will be created.
        /// </summary>
        public Vector3 CursorSize = new Vector3(0.05f, 0.05f, 0.05f);
    
        /// <summary>
        /// The color of the cursor - can be set in editor.
        /// </summary>
        public Color CursorColour = Color.HSVToRGB(0.0223f, 0.7922f, 1.000f);
    
        /// <summary>
        /// Provides when the gaze is ready to start working (based upon whether
        /// Azure connects successfully).
        /// </summary>
        internal bool GazeEnabled = false;
    
        /// <summary>
        /// The currently focused object.
        /// </summary>
        internal GameObject FocusedObject { get; private set; }
    
        /// <summary>
        /// The object which was last focused on.
        /// </summary>
        internal GameObject _oldFocusedObject { get; private set; }
    
        /// <summary>
        /// The info taken from the last hit.
        /// </summary>
        internal RaycastHit HitInfo { get; private set; }
    
        /// <summary>
        /// The cursor object.
        /// </summary>
        internal GameObject Cursor { get; private set; }
    
        /// <summary>
        /// Provides whether the raycast has hit something.
        /// </summary>
        internal bool Hit { get; private set; }
    
        /// <summary>
        /// This will store the position which the ray last hit.
        /// </summary>
        internal Vector3 Position { get; private set; }
    
        /// <summary>
        /// This will store the normal, of the ray from its last hit.
        /// </summary>
        internal Vector3 Normal { get; private set; }
    
        /// <summary>
        /// The start point of the gaze ray cast.
        /// </summary>
        private Vector3 _gazeOrigin;
    
        /// <summary>
        /// The direction in which the gaze should be.
        /// </summary>
        private Vector3 _gazeDirection;
    

重要

これらの変数のいくつかは、エディターで編集できます。Some of these variables will be able to be edited in the Editor.

  1. 起動可能な () メソッドとStart () メソッドのコードを追加する必要があります。Code for the Awake() and Start() methods now needs to be added.

        /// <summary>
        /// The method used after initialization of the scene, though before Start().
        /// </summary>
        private void Awake()
        {
            // Set this class to behave similar to singleton
            instance = this;
        }
    
        /// <summary>
        /// Start method used upon initialization.
        /// </summary>
        private void Start()
        {
            FocusedObject = null;
            Cursor = CreateCursor();
        }
    
  2. 次のコードを追加します。このコードは、start に cursor オブジェクトを作成し、 Update () メソッドを実行します。このメソッドは、Raycast メソッドを実行します。このメソッドは、GazeEnabled ブール値が切り替えられる場所になります。Add the following code, which will create a cursor object at start, along with the Update() method, which will run the Raycast method, along with being where the GazeEnabled boolean is toggled:

        /// <summary>
        /// Method to create a cursor object.
        /// </summary>
        /// <returns></returns>
        private GameObject CreateCursor()
        {
            GameObject newCursor = GameObject.CreatePrimitive(PrimitiveType.Sphere);
            newCursor.SetActive(false);
    
            // Remove the collider, so it doesn't block raycast.
            Destroy(newCursor.GetComponent<SphereCollider>());
            newCursor.transform.localScale = CursorSize;
    
            newCursor.GetComponent<MeshRenderer>().material = new Material(Shader.Find("Diffuse"))
            {
                color = CursorColour
            };
    
            newCursor.name = "Cursor";
    
            newCursor.SetActive(true);
    
            return newCursor;
        }
    
        /// <summary>
        /// Called every frame
        /// </summary>
        private void Update()
        {
            if(GazeEnabled == true)
            {
                _gazeOrigin = Camera.main.transform.position;
    
                _gazeDirection = Camera.main.transform.forward;
    
                UpdateRaycast();
            }
        }
    
  3. 次に、 UpdateRaycast () メソッドを追加します。これにより、Raycast が射影され、ヒットターゲットが検出されます。Next add the UpdateRaycast() method, which will project a Raycast and detect the hit target.

        private void UpdateRaycast()
        {
            // Set the old focused gameobject.
            _oldFocusedObject = FocusedObject;
    
            RaycastHit hitInfo;
    
            // Initialise Raycasting.
            Hit = Physics.Raycast(_gazeOrigin,
                _gazeDirection,
                out hitInfo,
                GazeMaxDistance, LayerMask);
    
            HitInfo = hitInfo;
    
            // Check whether raycast has hit.
            if (Hit == true)
            {
                Position = hitInfo.point;
    
                Normal = hitInfo.normal;
    
                // Check whether the hit has a collider.
                if (hitInfo.collider != null)
                {
                    // Set the focused object with what the user just looked at.
                    FocusedObject = hitInfo.collider.gameObject;
                }
                else
                {
                    // Object looked on is not valid, set focused gameobject to null.
                    FocusedObject = null;
                }
            }
            else
            {
                // No object looked upon, set focused gameobject to null.
                FocusedObject = null;
    
                // Provide default position for cursor.
                Position = _gazeOrigin + (_gazeDirection * GazeMaxDistance);
    
                // Provide a default normal.
                Normal = _gazeDirection;
            }
    
            // Lerp the cursor to the given position, which helps to stabilize the gaze.
            Cursor.transform.position = Vector3.Lerp(Cursor.transform.position, Position, 0.6f);
    
            // Check whether the previous focused object is this same 
            //    object. If so, reset the focused object.
            if (FocusedObject != _oldFocusedObject)
            {
                ResetFocusedObject();
    
                if (FocusedObject != null)
                {
                if (FocusedObject.CompareTag(InteractibleTag.ToString()))
                {
                        // Set the Focused object to green - success!
                        FocusedObject.GetComponent<Renderer>().material.color = Color.green;
    
                        // Start the Azure Function, to provide the next shape!
                        AzureServices.instance.CallAzureFunctionForNextShape();
                    }
                }
            }
        }
    
  4. 最後に、 ResetFocusedObject () メソッドを追加します。これにより、新しい図形を作成しているかどうかを示す、GazeButton オブジェクトの現在の色が切り替わります。Lastly, add the ResetFocusedObject() method, which will toggle the GazeButton objects current color, indicating whether it is creating a new shape or not.

        /// <summary>
        /// Reset the old focused object, stop the gaze timer, and send data if it
        /// is greater than one.
        /// </summary>
        private void ResetFocusedObject()
        {
            // Ensure the old focused object is not null.
            if (_oldFocusedObject != null)
            {
                if (_oldFocusedObject.CompareTag(InteractibleTag.ToString()))
                {
                    // Set the old focused object to red - its original state.
                    _oldFocusedObject.GetComponent<Renderer>().material.color = Color.red;
                }
            }
        }
    
  5. Unity に戻る前に、変更を Visual Studio に保存します。Save your changes in Visual Studio before returning to Unity.

  6. [スクリプト] フォルダーから、[階層] パネルの [メインカメラ] オブジェクトに、見つめクラスをクリックしてドラッグします。Click and drag the Gaze class from the Scripts folder to the Main Camera object in the Hierarchy Panel.

第10章-AzureServices クラスの完成Chapter 10 - Completing the AzureServices class

他のスクリプトが配置されたので、 Azureservicesクラスを完了できるようになりました。With the other scripts in place, it is now possible to complete the AzureServices class. これは、次の方法で実現されます。This will be achieved through:

  1. CreateCloudIdentityAsync () という名前の新しいメソッドを追加して、Azure との通信に必要な認証変数を設定します。Adding a new method named CreateCloudIdentityAsync(), to set up the authentication variables needed for communicating with Azure.

    また、このメソッドは、シェイプリストを含む以前に格納されたファイルの存在を確認します。This method will also check for the existence of a previously stored File containing the Shape List.

    ファイルが見つかった場合は、 Azure Storage ファイルに格納されている図形のパターンに従って、ユーザーが宝石を無効にし、図形の作成をトリガーします。If the file is found, it will disable the user Gaze, and trigger Shape creation, according to the pattern of shapes, as stored in the Azure Storage file. テキストメッシュによって ' Storage ' または ' New ' と表示されるのは、図形の原点によって異なります。The user can see this, as the Text Mesh will provide display 'Storage' or 'New', depending on the shapes origin.

    ファイルが見つからない場合は、ユーザーがシーン内のGazeButtonオブジェクトを見ているときに図形を作成できるようにしますIf no file is found, it will enable the Gaze, enabling the user to create shapes when looking at the GazeButton object in the scene.

        /// <summary>
        /// Create the references necessary to log into Azure
        /// </summary>
        private async void CreateCloudIdentityAsync()
        {
            // Retrieve storage account information from connection string
            storageAccount = CloudStorageAccount.Parse(storageConnectionString);
    
            // Create a file client for interacting with the file service.
            fileClient = storageAccount.CreateCloudFileClient();
    
            // Create a share for organizing files and directories within the storage account.
            share = fileClient.GetShareReference(fileShare);
    
            await share.CreateIfNotExistsAsync();
    
            // Get a reference to the root directory of the share.
            CloudFileDirectory root = share.GetRootDirectoryReference();
    
            // Create a directory under the root directory
            dir = root.GetDirectoryReference(storageDirectory);
    
            await dir.CreateIfNotExistsAsync();
    
            //Check if the there is a stored text file containing the list
            shapeIndexCloudFile = dir.GetFileReference("TextShapeFile");
    
            if (!await shapeIndexCloudFile.ExistsAsync())
            {
                // File not found, enable gaze for shapes creation
                Gaze.instance.GazeEnabled = true;
    
                azureStatusText.text = "No Shape\nFile!";
            }
            else
            {
                // The file has been found, disable gaze and get the list from the file
                Gaze.instance.GazeEnabled = false;
    
                azureStatusText.text = "Shape File\nFound!";
    
                await ReplicateListFromAzureAsync();
            }
        }
    
  2. 次のコードスニペットは、 Start () メソッド内からのものです。CreateCloudIdentityAsync () メソッドに対して呼び出しが行われます。The next code snippet is from within the Start() method; wherein a call will be made to the CreateCloudIdentityAsync() method. 次のようにして、現在のStart () メソッドを自由にコピーしてください。Feel free to copy over your current Start() method, with the below:

        private void Start()
        {
            // Disable TLS cert checks only while in Unity Editor (until Unity adds support for TLS)
    #if UNITY_EDITOR
            ServicePointManager.ServerCertificateValidationCallback = delegate { return true; };
    #endif
    
            // Set the Status text to loading, whilst attempting connection to Azure.
            azureStatusText.text = "Loading...";
    
            //Creating the references necessary to log into Azure and check if the Storage Directory is empty
            CreateCloudIdentityAsync();
        }
    
  3. CallAzureFunctionForNextShape () メソッドのコードを入力します。Fill in the code for the method CallAzureFunctionForNextShape(). 以前に作成したAzure Function Appを使用して、図形のインデックスを要求します。You will use the previously created Azure Function App to request a shape index. 新しい図形を受け取ると、このメソッドは図形をシェイプトゥイーンファクトリクラスに送信して、シーンに新しい図形を作成します。Once the new shape is received, this method will send the shape to the ShapeFactory class to create the new shape in the scene. 次のコードを使用して、 CallAzureFunctionForNextShape () の本文を完成させます。Use the code below to complete the body of CallAzureFunctionForNextShape().

        /// <summary>
        /// Call to the Azure Function App to request a Shape.
        /// </summary>
        public async void CallAzureFunctionForNextShape()
        {
            int azureRandomInt = 0;
    
            // Call Azure function
            HttpWebRequest webRequest = WebRequest.CreateHttp(azureFunctionEndpoint);
    
            WebResponse response = await webRequest.GetResponseAsync();
    
            // Read response as string
            using (Stream stream = response.GetResponseStream())
            {
                StreamReader reader = new StreamReader(stream);
    
                String responseString = reader.ReadToEnd();
    
                //parse result as integer
                Int32.TryParse(responseString, out azureRandomInt);
            }
    
            //add random int from Azure to the ShapeIndexList
            ShapeFactory.instance.shapeHistoryList.Add(azureRandomInt);
    
            ShapeFactory.instance.CreateShape(azureRandomInt, false);
    
            //Save to Azure storage
            await UploadListToAzureAsync();
        }
    
  4. 図形の履歴リストに格納されている整数を連結して、 Azure Storage ファイルに保存することにより、文字列を作成するメソッドを追加します。Add a method to create a string, by concatenating the integers stored in the shape history list, and saving it in your Azure Storage File.

        /// <summary>
        /// Upload the locally stored List to Azure
        /// </summary>
        private async Task UploadListToAzureAsync()
        {
            // Uploading a local file to the directory created above
            string listToString = string.Join(",", ShapeFactory.instance.shapeHistoryList.ToArray());
    
            await shapeIndexCloudFile.UploadTextAsync(listToString);
        }
    
  5. Azure Storage ファイルにあるファイルに格納されているテキストを取得し、それをリストに逆シリアル化するメソッドを追加します。Add a method to retrieve the text stored in the file located in your Azure Storage File and deserialize it into a list.

  6. このプロセスが完了すると、メソッドは、ユーザーがシーンに図形を追加できるように、宝石を再び有効にします。Once this process is completed, the method re-enables the gaze so that the user can add more shapes to the scene.

        ///<summary>
        /// Get the List stored in Azure and use the data retrieved to replicate 
        /// a Shape creation pattern
        ///</summary>
        private async Task ReplicateListFromAzureAsync()
        {
            string azureTextFileContent = await shapeIndexCloudFile.DownloadTextAsync();
    
            string[] shapes = azureTextFileContent.Split(new char[] { ',' });
    
            foreach (string shape in shapes)
            {
                int i;
    
                Int32.TryParse(shape.ToString(), out i);
    
                ShapeFactory.instance.shapeHistoryList.Add(i);
    
                ShapeFactory.instance.CreateShape(i, true);
    
                await Task.Delay(500);
            }
    
            Gaze.instance.GazeEnabled = true;
    
            azureStatusText.text = "Load Complete!";
        }
    
  7. Unity に戻る前に、変更を Visual Studio に保存します。Save your changes in Visual Studio before returning to Unity.

第11章-UWP ソリューションのビルドChapter 11 - Build the UWP Solution

ビルドプロセスを開始するには:To begin the Build process:

  1. ファイル > のビルド設定にアクセスします。Go to File > Build Settings.

    アプリをビルドする

  2. [Build] をクリックします。Click Build. Unity はエクスプローラーウィンドウを起動します。このウィンドウでは、アプリを作成するフォルダーを作成して選択する必要があります。Unity will launch a File Explorer window, where you need to create and then select a folder to build the app into. ここでそのフォルダーを作成し、「 App」という名前を指定します。Create that folder now, and name it App. 次に、アプリフォルダーを選択し、 [フォルダーの選択] をクリックします。Then with the App folder selected, press Select Folder.

  3. Unity は、アプリフォルダーへのプロジェクトのビルドを開始します。Unity will begin building your project to the App folder.

  4. Unity のビルドが完了すると (時間がかかる場合があります)、ビルドの場所でファイルエクスプローラーウィンドウを開きます (ウィンドウの上に常に表示されるとは限りませんが、新しいウィンドウが追加されたことが通知されます)。Once Unity has finished building (it might take some time), it will open a File Explorer window at the location of your build (check your task bar, as it may not always appear above your windows, but will notify you of the addition of a new window).

第12章-アプリケーションのデプロイChapter 12 - Deploying your application

アプリケーションをデプロイするには:To deploy your application:

  1. 最後の章で作成したアプリフォルダーに移動します。Navigate to the App folder which was created in the last Chapter. アプリ名を含むファイルが表示されます。この拡張子は ".sln" で、ダブルクリックしてVisual Studio内で開く必要があります。You will see a file with your apps name, with the '.sln' extension, which you should double-click, so to open it within Visual Studio.

  2. ソリューションプラットフォームで、[ X86, ローカルコンピューター] を選択します。In the Solution Platform, select x86, Local Machine.

  3. ソリューション構成で、[デバッグ] を選択します。In the Solution Configuration select Debug.

    Microsoft HoloLens の場合、これをリモートコンピューターに設定する方が簡単な場合があります。これにより、コンピューターにテザリングさされることはありません。For the Microsoft HoloLens, you may find it easier to set this to Remote Machine, so that you are not tethered to your computer. ただし、次の手順も実行する必要があります。Though, you will need to also do the following:

    • HoloLens のIP アドレスを確認します。これは、設定 > ネットワーク & インターネット > wi-fi > 詳細オプションにあります。 IPv4 は使用するアドレスです。Know the IP Address of your HoloLens, which can be found within the Settings > Network & Internet > Wi-Fi > Advanced Options; the IPv4 is the address you should use.
    • 開発者モードオンになっていることを確認します。「設定 > の更新」で、開発者向けの セキュリティ & セキュリティ > が見つかりました。Ensure Developer Mode is On; found in Settings > Update & Security > For developers.

    ソリューションの配置

  4. [ビルド] メニューの [ソリューションの配置] をクリックして、アプリケーションをコンピューターにサイドロードします。Go to the Build menu and click on Deploy Solution to sideload the application to your machine.

  5. インストールされているアプリの一覧にアプリが表示され、起動してテストできる状態になります。Your App should now appear in the list of installed apps, ready to be launched and tested!

完成した Azure Functions およびストレージアプリケーションYour finished Azure Functions and Storage Application

これで、Azure Functions と Azure Storage の両方のサービスを活用する mixed reality アプリが作成されました。Congratulations, you built a mixed reality app that leverages both the Azure Functions and Azure Storage services. アプリは、格納されているデータを描画し、そのデータに基づいてアクションを提供できます。Your app will be able to draw on stored data, and provide an action based on that data.

最終製品-終了

ボーナスの演習Bonus exercises

演習1Exercise 1

オブジェクトが作成されたポイントを生成する2番目の生成ポイントとレコードを作成します。Create a second spawn point and record which spawn point an object was created from. データファイルを読み込むときに、最初に作成された場所から生成された図形を再生します。When you load the data file, replay the shapes being spawned from the location they originally were created.

演習2Exercise 2

毎回アプリケーションを再起動するのではなく、アプリを再起動する方法を作成します。Create a way to restart the app, rather than having to re-open it each time. 読み込みシーンは、開始するのに適しています。Loading Scenes is a good spot to start. その後、 Azure Storageで格納されている一覧をクリアする方法を作成して、アプリから簡単にリセットできるようにします。After doing that, create a way to clear the stored list in Azure Storage, so that it can be easily reset from your app.