Microsoft Cognitive Services を試してみる（３）

Visual Studio でアプリを作成していきます。

試した環境は、以下です。

• OS: Windows 10 Enterprise バージョン1607, OSビルド 14393.187
• Visual Studio Community 2015 Version 14.0.25431.01 Update3

手順

２．Visual Studio でアプリ作成その１

2-1. Visual Studio 起動。"ファイル" -> "新規作成" -> "プロジェクト" クリック。"テンプレート" -> "Visual C#" -> "Cross-Platform" から "Blank Xaml App (Xamarin.Forms Portable)" を選択。名前は、ここでは、"FaceEmotionApp1" としました。"OK" クリック。

2-2. NuGetパッケージのインストール。（Visual Studio での開発は、このNuGetパッケージ（開発に必要となるソフトウエアやライブラリ）をインストールすることによって、開発環境を整えていく。）今回は、以下の4つのNuGetパッケージをインストールしました。

• Microsoft.ProjectOxford.Face （バージョン1.1.0）
• Microsoft.ProjectOxford.Emotion（バージョン1.0.310）
• Xam.Plugin.Connectivity（バージョン2.2.12）
• Xam.Plugin.Media（バージョン2.3.0）

注１）NuGetパッケージのバージョンは、必ずしも最新版で動くとは限りませんでした。

注２）FaceとEmotionは、PCLプロジェクトにインストール、ConnectivityとMediaは、全プロジェクトにインストールしました。

NuGetパッケージのインストール方法

ソリューションエクスプローラーで、"ソリューション 'FaceEmotionApp1' (6プロジェクト)" を右クリック、"ソリューションのNuGetパッケージの管理" クリック

それぞれのNuGetパッケージを検索し、インストールします。NuGetパッケージのバージョンとインストール先を注意。PCLプロジェクトは、"FaceEmotionApp1"のみ選択。全プロジェクトは、すべてのプロジェクトをチェックしてインストール。

2-3. アプリのUIを作成。ソリューションエクスプローラーの "FaceEmotionApp1（移植可能）" の下の "MainPage.xaml" ファイルを編集します。（Xamarin (C#) の開発では、UIは、XAMLで定義します。）

以下のコードを記述します。「カメラで撮影」ボタン、「ファイルから選ぶ」ボタン、イメージ（写真）を表示するエリア、Emotion, Face APIで取得した数値を表示するラベル（性別、年齢、エモーション、スマイル、メガネ、あごひげ、口ひげ）を定義しています。

2-4. Emotion, Face API の結果を格納するクラス "FaceEmotionDetection" を作成します。ソリューションエクスプローラーの "FaceEmotionApp1（移植可能）" を右クリック、"追加" -> "クラス" クリック

"クラス"を選択、名前を"FaceEmotionDetection.cs" として、"追加"クリック。

以下のコードを記述して、保存してください。

次回は、Visual Studio でのアプリ作成その２を紹介します。