<2017年8月版>Xamarin + Prism 超入門（とりあえず動かしてみよう！）
最近の本ブログへのトラフィックのうち、以前に書いた以下の記事へのものが未だに多いようです。
ただし、上記記事では開発環境が Visual Studio 2015 であり、少し古いバージョンをベースとしています。
その為、[2017年8月版]として最新の開発環境である「Visual Studio 2017(Windows)」をベースに「Xamarin + Prism 超入門（とりあえず動かしてみよう！）」を書き起こしたいと思います（厳密には Xamarin Forms + Prism です）。
1 前提条件
本編に入る前・・・以下を前提条件とします。
- Visual Studio 2017がインストールされている事（Windowsの場合）
- Visual Studio 2017において「.NETによるモバイル開発」がインストールされている事
- iOS / Android / UWP(VS2017のみ) 実行環境が整っている事
2 はこれ↓です。
3 については本エントリーの主題ではありませんが、Xamarin開発を始める際に引っかかる事が多い点なので、いくつかのポイントを以下に説明しておこうと思います。
1.1 iPhoneシミュレータ(iOS)実行環境設定について
Mac側およびVisual Studio 2017側で設定を行います。
1.1.1 Mac側セキュリティ設定の変更
まず、Mac側でセキュリティに関する設定を行う必要があります。
「システム環境設定」ウィンドウで「共有」をクリックします。
「共有」ウィンドウで「リモートログイン」を有効に設定します。
これにより Visual Studio 2017側 から Mac側 へのアクセスが可能になります。
(Macとの接続がとられていないと、iOSアプリの実行・デバッグが行えません)
1.1.2 Visual Studio 2017からの接続設定
Visual Studio 2017のメニュー「ツール → iOS → Xamarin Mac Agent」を選択します。
「Xamarin Mac Agent」ウィンドウが表示されるので、「次へ」をクリックします。
Macが同一ネットワーク上に存在すればリストに表示されます。
接続したいMacを選択して「接続」ボタンをクリックします。
ログイン情報を入力して「ログイン」ボタンをクリックします。
以上で、Visual Studio 2017からMacへの接続設定が完了しました。
1.2 Androidエミュレータ実行環境設定について
初期設定として行うべきことが多く躓きやすいと思います（私もXamarinやり始めのころかなり躓きました・・・）。
まず前提として、Androidエミュレータは HAXM（Intel Hardware Accelerated Execution Manager） を使って実行します。そうでないと使い物にならないほど激遅です。
で、HAXMを動作させるには「Hyper-Vを無効化」しておかなければなりません。
1.2.1 Hyper-Vの無効化
Windowsの機能として「Hyper-V」をインストールしていなければ気にする必要はありません。
Hyper-Vがインストールされている場合には、以下のコマンドによりHyper-Vを無効化します。
bcdedit /set hypervisorlaunchtype off
※コマンド実行後は、再起動により設定が反映されます。
逆にHyper-V機能を有効化するには以下のコマンドを実行します（要再起動）。
bcdedit /set hypervisorlaunchtype auto
1.2.2 Google APIs Intel x86 Atom System Image と HAXM のインストール
エミュレータイメージである「Google APIs Intel x86 Atom System Image」と、「HAXM」をインストールします。
Visual Studio 2017のメニューから「ツール → Android → Android SDK マネージャー」を選択します。
表示された「Android SDK Manager」から、以下を選択して「Install xx packages..」ボタンをクリックします。
HAXMの方は「Not compatible with Windows」と表示されてインストールできない場合があります。
その場合は以下から直接ダウンロードしてインストールを行います。
zipファイルをダウンロードし、解凍して生成された「intelhaxm-android.exe」を実行することでHAXMのインストールが行われます。
1.3 UWP実行環境設定について
Windows 10の「スタートメニュー → 設定 → 更新とセキュリティ → 開発者向け」を選択します。
「開発者向け機能を使う」項目から「開発者モード」を選択します。
しばらく待つとインストールが完了します。
2 Visual Studio 2017 で Xamarin + Prism 開発
やっと本題です。
Visual Studio 2017を起動します。
2.1 「Prism Template Pack」のインストール
メニュー「ツール → 拡張機能と更新プログラム」を選択します。
「拡張機能と更新プログラム」ウィンドウが表示されます。
「オンライン」を選択し、右上の検索ボックスに「Prism Template Pack」と入力します。
一覧に表示された「Prism Template Pack」を選択し「ダウンロード」ボタンをクリックします。
ダウンロードが完了したら、「閉じる」ボタンをクリックします。
Visual Studio 2017を終了させます。
「Prism Template Pack」のインストール画面が表示されます。
インストール画面の指示に従うことで、インストールが完了します。
2.2 Prismプロジェクトの作成
Visual Studio 2017を起動します。
メニュー「ファイル → 新規作成 → プロジェクト」を選択します。
プロジェクトテンプレート（カテゴリー）として「Prism」が追加されていることを確認することができます。
ここでは「Prism → Xamarin.Forms」を選択します。以下の４つのテンプレートがリストされます。
- Prism Autofac App(Xamarin.Forms)
- Prism Dryloc App(Xamarin.Forms)
- Prism Ninject App(Xamarin.Forms)
- Prism Unity App(Xamarin.Forms)
名称から分かるように、テンプレートごとに「利用するDIコンテナ」に違いがあります。
お好みで選択してOKですが、ここでは「Prism Autofac App(Xamarin.Forms)」を選択することにします。
名前はデフォルトのまま「PrismAutofacApp1」としました。
「OK」をクリックします。
「PRISM PROJECT WIZARD」ウィンドウが表示されます。
ターゲットとするプラットフォームの選択になります。ここでは iOS / ANDROID / UWP の３つすべてを選択します。
Macとの接続設定が未設定の場合は「Xamarin Mac Agentの指示」ウィンドウが開きます。
ネットワーク内に開発に使えるMacがある場合は接続します。
（Macとの接続設定が済んでいる環境では、このステップは省略されます）
「新しいユニバーサル Windows プロジェクト」ウィンドウが表示されます。
UWPのターゲットバージョンの指定になりますが、ここではデフォルトのまま「OK」ボタンをクリックすることとします。
以上でプロジェクトの作成が完了します。
2.3 実行
では、ソースは何もいじらずに、ウィザードによって生成されたHello World的なプログラムを実行してみます。
2.3.1 Androidエミュレータで実行
VS上部のツールバー（？）から「スタートアッププロジェクト」を「PrismAutofacApp1.Droid」を選択します。
すぐ右のドロップダウンでシミュレータデバイスを選択します。ここでは「Visual Studio_android-23_x86_phone(Android 6.0 - API 23)」を選択します。
F5キークリックでデバッグ実行を行います。
ビルド＆デプロイが行われ、以下のエミュレータ画面が表示されます。
※私の環境ではデプロイが完了しない場合があります。そんな場合は、一度ビルドのキャンセルを行い、再度F5をクリックするとうまく動作したりするようです。
2.3.2 iPhoneシミュレータ（iOS）で実行
VS上部のツールバー（？）から、「ソリューション プラットフォーム」を「iPhoneSimulator」に、「スタートアッププロジェクト」を「PrismAutofacApp1.iOS」に設定します。
すぐ右のドロップダウンでシミュレータデバイスを選択します。ここでは「iPhone 7 iOS 10.3」」を選択します。
F5キークリックでデバッグ実行を行います。
ビルド＆デプロイが行われ、シミュレータ画面が表示されます。
Visual Studio 2017の「リモート Simulator から Windows へ」機能が有効になっている場合は、Windows側の画面にシミュレータが表示されます。この機能が無効になっている場合には、Mac側にシミュレータ画面が表示されます。
[Windows側にシミュレータ表示]
[Mac側にシミュレータ表示]
「リモート Simulator から Windows へ」機能の設定変更は以下の通りです。
Visual Studio 2017のメニュー「ツール → オプション」を選択し、「オプション」ウィンドウを開きます。
左側のカテゴリーから「Xamarin → iOSの設定」を選択します。右側に表示される「リモート Simulator から Windows へ」チェックボックスで有効・無効の設定を切り替えます（当該機能はVisual Studio Enterpriseのみの機能になります）。
2.3.3 UWPで実行
VS上部のツールバー（？）から、「ソリューション プラットフォーム」を「x64（もしくはx86）Any CPU」に、「スタートアッププロジェクト」を「PrismAutofacApp1.UWP(Universal Windows)」に設定します。
すぐ右のドロップダウンでシミュレータデバイスを選択します。ここでは「ローカル コンピューター」を選択します。
F5キークリックでデバッグ実行を行います。
以下のようにUWPアプリが起動します。
※2017/8/3 かずき@69.7kg (@okazuki) | Twitterさんより「ソリューションプラットフォーム」を AnyCPU ではなく x64 もしくは x86 を明示的に選択すれば「配置」の必要がないことをご指摘いただきました。「2.3.3 UWPで実行」に関する 以下の取り消し線部分を上記に修正しました！かずきさんありがとうございます！
配置→実行の手順となります。
(1) 配置
ソリューションエクスプローラから「PrismAutofacApp1.UWP」を選択し、マウス右ボタンクリックでポップアップメニューを表示、「配置」メニューを選択します。
ビルドが行われ、配置処理が行われます。
(2) 実行
VS上部のツールバー（？）から、「ソリューション プラットフォーム」を「Any CPU」に、「スタートアッププロジェクト」を「PrismAutofacApp1.UWP(Universal Windows)」に設定します。
すぐ右のドロップダウンでシミュレータデバイスを選択します。ここでは「ローカル コンピューター」を選択します。
F5キークリックでデバッグ実行を行います。
以下のようにUWPアプリが起動します。
まとめ
ということで、コーディング0の「Xamarin + Prism 超入門」でした。
Xamarinまわりは、以前と比べてかなり改善されていますが、初期設定関連の取り掛かりの部分が躓きとなる可能性がある部分だと思います。
ということで、Xamarin + Prism開発、更にはその手前の初期設定に関して少しでも本エントリーが参考になればと思います。
