読者です 読者をやめる 読者になる 読者になる

Live And Let Die

Microsoft エバンジェリストのブログ&備忘録 渡辺弘之の個人ブログ

Microsoft Cognitive Services を試してみる(3)

マイクロソフト Development Cognitive Service

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

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

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

手順

2.Visual Studio でアプリ作成その1

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

f:id:hiwatan:20161026162031p:plain

 

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)

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

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

 

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

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

f:id:hiwatan:20161026162042p:plain

 

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

f:id:hiwatan:20161026162050p:plain

 

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

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

f:id:hiwatan:20161026162106p:plain

 

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

f:id:hiwatan:20161026162117p:plain

 

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

f:id:hiwatan:20161026162127p:plain

 

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

f:id:hiwatan:20161026162135p:plain

 

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