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

Xamarin 日本語情報

Xamarin(ザマリン) の代理店だったエクセルソフト田淵のブログです。主に Xamarin に関するエントリーをアップしていきます。(なるべく正しい有益な情報を掲載していきたいと考えていますが、このブログのエントリーは所属組織の公式見解ではありませんのでご注意ください)

Xamarin やりたい人向け Visual Studio 2017 インストール手引書

Xamarin Visual Studio

こんにちは。エクセルソフトの田淵です。

やっと、重い腰を上げて Visual Studio 2017 を新規にインストールしてみました。

2017年3月17日時点の手順です。細かい手順は変わる可能性がありますので、ご了承ください。

Xamarin が使えるように Visual Studio をインストールするには

本エントリーは、まったくの新規の状態からのインストールの手引書です。

が、既に Visual Studio 2017 をインストールされている方は以下の「変更」ボタンから Xamarin を追加インストールできます。

f:id:ytabuchi:20170315174653p:plain:w300

ダウンロード

まずは Visual Studio 2017 のインストーラーをダウンロードします。

www.visualstudio.com

こちらのサイトで、適切なエディションを選んでダウンロードします。

f:id:ytabuchi:20170316010225p:plain:w600

f:id:ytabuchi:20170316010221p:plain:w300

今回は Community Edition をインストールしてみました。

インストールウィザード

インストールを開始すると、以下のインストールウィザードが開きます。

f:id:ytabuchi:20170316010125p:plain:w600

下の方に「.NETによるモバイル開発」がありますので、チェックしましょう。

f:id:ytabuchi:20170316183938p:plain:w600

右側でチェックされているコンポーネントがインストールされます。それぞれが何なのか?の解説をつけておきます。

となっています。(Enterprise の方は iOS Remote Simulator(だったなか?)もインストールしておきましょう。)

Xamarin が初めてという方は、一番下の「ユニバーサルWindowsプラットフォーム(UWP のことです)」を追加でチェックして、そのままインストールしましょう。

その他の「.NET デスクトップ開発」、「ASP.NET と Web 開発」などのワークロードはお好みに合わせて入れてください。

Android SDKIntel HAXM のエミュレーターの作り方について結構分かっているという方は、@amay077 さんが一番小さい容量で Visual Studio 2017 と Xamarin をインストールするには?という趣旨で以下のエントリーを書いてくださっているので、参考にして、最小構成でインストールするのもアリです。

qiita.com

起動&プロジェクト作成

インストールが終了したら「起動」ボタンをクリック!

f:id:ytabuchi:20170317094539p:plain:w600

テーマを決めて Microsoft アカウントでログインして、起動します。

f:id:ytabuchi:20170317095159p:plain:w300

Visual Studio 2015 と比べると結構画面が変わっていますね。新しいプロジェクトから新規プロジェクトを作成できます。検索欄に「クロス」と入力して「クロスプラットフォームアプリ (Xamarin.Forms またはネイティブ」のプロジェクトを作成しても良いですし、「その他のプロジェクトテンプレート」から従来のテンプレート選択ダイアログを表示しても良いです。

f:id:ytabuchi:20170317100951p:plain:w600

「その他のプロジェクトテンプレート」をクリックした場合は、以下のダイアログが開きますので、「Visual C#>Cross-Platform>クロスプラットフォームアプリ (Xamarin.Forms またはネイティブ」を選択して[OK]をクリックします。

f:id:ytabuchi:20170317101041p:plain:w450

アプリの基本設定を決める次のダイアログが表示されますので、今回はそのまま[OK]をクリックします。

f:id:ytabuchi:20170317101302p:plain:w450

UWP 開発をチェックした方は、以下のダイアログが表示されますので、そのまま[OK]をクリックします。

f:id:ytabuchi:20170317101731p:plain:w450

環境チェック&デバッグ

作成されたプロジェクトと環境周りを見てみましょう。

前述の通り、Intel HAXM を使用する Android 6.0 エミュレーターがインストールされ、使える状態になっています。ここでは、「VisualStudio_android-23_x86_phone (Android 6.0 - API 23)」を選択します。

f:id:ytabuchi:20170317102633p:plain:w450

Visual Studio のメニューから「ツール>AndroidAndroid SDK マネージャー」をクリックしてみました。ビルドに必要な「Android SDK Tools」「Android SDK Platform-tools」がほぼ最新で、API 23 で構築できるように「Android SDK Build-tools」の 23.0.3 がインストールされているのが分かります。最低限、Android 6.0 向けのアプリはビルドできることが分かります。

f:id:ytabuchi:20170317102827p:plain:w600

UWP プロジェクトでエラーが出ている可能性がありますが、ソリューションをビルドすれば無くなるはず。(未だに「Initialize Component」のエラーが出るのか… とは思いますが、このエラーは無視しても良いやつです。)

f:id:ytabuchi:20170317103614p:plain:w600

ではそのままビルドしてみましょう!

f:id:ytabuchi:20170317103958p:plain:w600

おおおおお…😭😭 マジか!やったね!!!

UWP も OK

f:id:ytabuchi:20170317104159p:plain:w450

iOS も多分 OK

f:id:ytabuchi:20170317104314p:plain:w300

多分 OK というのは私の環境だけ iOS プロジェクトのプロパティの「iOS ビルド>パッケージ化のオプション>iOS 用に PNG イメージファイルを最適化する」のチェックを外さないとビルドできなかったため… なんでや…

f:id:ytabuchi:20170317112637p:plain:w450

f:id:ytabuchi:20170317104321p:plain:w450

f:id:ytabuchi:20170317104242p:plain:w450

Mac 側の ~/Library/Caches/Xamarin/mtbs/builds/<アプリ名>/<ビルドのハッシュ?>/obj/<ビルドターゲット>/Debug/optimized/ に最適化した png ファイルがコピーされるみたいなのですが、なぜかコピーされない状態です。調査中。

その他きになるかも?という点は以下。

「共有プロジェクト」と「ポータブルクラスライブラリ (PCL)」については以下をご参照ください。
(.NET Standard との兼ね合いで暫くは共有プロジェクトの方が良いかもです。)
developer.xamarin.com


UWP 開発を始めてやる方は、「開発者モードにせよ」というダイアログが出たりしますので、言われる通りにしておきましょう。
f:id:ytabuchi:20170317102352p:plain:w450
f:id:ytabuchi:20170317102402p:plain:w450

まとめ

Visual Studio 2017 で Xamarin を始める方は、PC の容量さえクリアできれば、サクッとインストールして、サクッとデバッグまで試していただけます!これなら、「Xamarin はいいぞ!」って言えますね。嬉しい。

周りの方に、Xamarin を始めたい場合は、Visual Studio 2017 を「.NETによるモバイル開発」にチェックをつけてインストールすれば何の問題もなく始められるよ!と言ってあげてください。

Next Step?

Xamarin 公式ドキュメントにもある、一番最初の QuickStart 日本語版です。まずはここからやってみましょう!

github.com

WPF などの開発を行っていて XAML に慣れている方は、以下のハンズオンをやってみましょう!

github.com

(画面写真やメニューの名前が少し古いかもしれませんがご容赦ください。)

楽しい Xamarin ライフを!

Xamarin 気になった方は

Visual Studio 2017 をインストールして触ってみてください。 学習用リソースJXUG リンクページ に参考資料を纏めてますので併せてどうぞ。

Xamarin の導入支援サービスを始めました。ベースは基本的なアプリを一緒に作ることで Xamarin を使えるようになって頂く内容ですが、ご要望に応じて講習内容のカスタマイズも可能です。詳しくは田淵までお問い合わせください(^^)

有償セミナー、トレーニング | Xamarin : XLsoft エクセルソフト

Xamarin の情報が欲しい方はこのブログも購読いただいたり、私のTwitterアカウントをフォローいただいたりすると嬉しいです。

私が所属している エクセルソフト の宣伝を少しさせてください。弊社は開発者向けの様々なソフトウェアを扱っています。おなじみの ReSharper (JetBrains)、 や Atlassian の JIRA, Confluence、Office/PDF ファイルを .NET/Java で操作するライブラリ Aspose(アスポーズ)Windows アプリ、Web ページ、iOS/Android アプリの UI テストができる TestComplete などお勧めです(^^) また、Visual Studio Professional/Enterprise with MSDN も販売してますし、日本で売っていない海外のソフトウェア、開発ツールなどを弊社経由で日本円で購入頂くことも可能です。ご興味あれば 弊社ページ を覗いてみてください。

以上です。