SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

最新バージョン「Visual Studio 2017(Visual Studio "15")」特集(AD)

iOS/Androidアプリの開発を支援する「Visual Studio Mobile Center (preview)」を使ってみよう

最新バージョン「Visual Studio 2017(Visual Studio "15")」特集 第4回

  • X ポスト
  • このエントリーをはてなブックマークに追加

アプリをビルドする

 続いて、サンプルソースのアプリをビルドしてみましょう。その前に、左のメニューから「Getting Started」を見てみます。ここでは、自身のアプリケーションをMobile Centerと連携するために変更するコードが記されています。

図5 「Getting Started」画面のキャプチャ
図5 「Getting Started」画面のキャプチャ

 内容は選択したプラットフォームや利用する言語により異なりますが、今回は「XAMARIN.FORMS」という説明を元にソースを修正します。修正したソースの抜粋は、リスト1のとおりです。

補足

 これらの設定を行わなくてもクラウド側との連携が必要ない「Build」や「Distribute」などの機能は利用できます。「Crashes」や「Analytics」など、クラウド連携を前提としたサービスを利用しない場合には、後で設定しても問題ありません。

リスト1 アプリコードへのMobileCenterの設定(App.csの抜粋)
// (1) パッケージを追加
using Microsoft.Azure.Mobile;
using Microsoft.Azure.Mobile.Analytics;
using Microsoft.Azure.Mobile.Crashes;

[assembly: XamlCompilation(XamlCompilationOptions.Compile)]
namespace Todo
{
    public class App : Application
    {
        // (2) MobileCenterの設定を追加
        protected override void OnStart()
        {
            MobileCenter.Start("ios=49472de4-f3fb-46c0-9929-xxxxxxxxxxxx;" +
                "android=e98395ea-d285-48e3-a524-xxxxxxxxxxxx;",
               typeof(Analytics), typeof(Crashes));
        }
        // : 省略
    }
}

 (1)では、「Mobile Center」、「Mobile Center Analytics」、「Mobile Center Crashes」のパッケージを指定します。

 これらのパッケージを追加するには、同時にNuGetパッケージの追加作業も必要です。Visual Studio 2017では、「ツール」-「NuGetパッケージマネージャ」-「パッケージマネージャコンソール」からリスト2のように実行してください。

リスト2 NuGetパッケージの追加
PM> Install-Package Microsoft.Azure.Mobile
PM> Install-Package Microsoft.Azure.Mobile.Analytics
PM> Install-Package Microsoft.Azure.Mobile.Crashes

 続いて、(2)ではMobileCenterの設定を追加します。実際には「Getting Started」ページで表示されたコードを追加してください(注2)。

注2

 「Manage App」を選択した画面の「App secret」でも確認できます。

 「App secret」とは、アプリがMobile Centerと接続するためのシークレットキーなので、この値を間違えるとAnalyticsやCrashesの機能と連携できません。間違えずに記載してください。

 また、ここで注意しなければならないのが、XamarinやReact Nativeを使用してiOSとAndroidの両OS向けアプリを開発している場合です。

 「App secret」は、Mobile Centerの「App」単位で発行されるため、両OSで値が異なります。そのため両OS用のAppをMobile Centerに作成し、それぞれの「App secret」をコードに反映させる必要があります。ここまで終了したら、これまでの修正を利用するリポジトリへとプッシュします。今回のサンプルでは執筆当時、利用できるリポジトリサービスがGitHubのみでしたのでGitHubを利用する事を前提としていますが、その他のサービスを使っていても同様です。

 続いて、GitHub上に登録したソースとMobile Centerを接続し、ビルドを行えるように設定します。まず、画面のサイドメニューから「Build」を選択すると、図6のようにGitHubとの連携をするための画面が表示されます。

図6 GitHubとの連携画面
図6 GitHubとの連携画面

 画面上にある「Connect to GitHub」を選択すると、GitHubの認証画面にリダイレクトするので、お手持ちのアカウントでログインします。

 GitHubにログインすると再度Mobile Centerにリダイレクトします。連携に成功すると、自身のGitHub上のリポジトリの一覧が表示されます。この中から、このAppで利用するリポジトリを選択します。リポジトリはプライベート(有料)であってもパブリックであっても利用可能です。

図7 リポジトリ選択画面

図7 リポジトリ選択画面

 リポジトリを選択すると、リポジトリ内のブランチ一覧が表示されるので、ここでビルド対象のブランチを選択します。サンプルでは、masterブランチしかないので、一覧の中身も1つだけですが、一般的にはブランチの数だけ表示されます。

 指定したブランチにコードをプッシュすると、自動でビルドされるような運用が可能です。実際にはテストブランチなどを作成し、そこで管理するとよいでしょう。対象のブランチを選択すると、ブランチのセットアップ画面になります。Mobile Centerでビルドしたいブランチを選択し(ここではmasterブランチ)、「Set up branch」を選択すると、図8のような設定画面が表示されます。

図8 ブランチ詳細設定画面
図8 ブランチ詳細設定画面

 また、各項目からは、表2のような内容を設定できます。

表2 ビルド時の設定項目
項目名 説明
Project ビルドするプロジェクトを選択。各プラットフォーム・言語タイプのプロジェクトに応じたプロジェクトが自動的に選択される。
Configuration ビルドする際の設定を選択する。Projectで選択したプロジェクトから構成を検出するので、その中から選択が可能。
Xcode Version iOS用プロジェクトの場合のみ選択可能。ビルド時に使用するXcodeのバージョンを選択可能。
Build on push コードがプッシュされたタイミングで自動でビルドするかを設定。オフにした場合には画面上から手動でビルドを実行する。
Build for simulator only iOS用プロジェクトの場合のみ選択可能。オンの場合にはシミュレータでのビルドのみで実機用のビルドは行わない。オフにした場合には「Sign Builds」の設定が必要。
Sign builds 実機用のビルドを有効にする。ビルドに成功すると配信用のパッケージであるipaファイル(iOSの場合)、もしくはapkファイル(Androidの場合)が作成される。また、iOSの場合にはプロビジョニングプロファイルと証明書のアップロード、Andoridの場合にはキーストアファイルのアップロードとそのファイルのパスワードの設定が必要。
Distribute builds 配信用パッケージを配信用グループに設定。ビルド時に自動的にメールで対象者に通知される。

 「Finish setup」ボタンをクリックすると、自動的にビルドが開始されます。ビルドに成功すると、それぞれのビルドファイルがダウンロード可能です(図9)。もし、ビルドに失敗したら、ビルド時の設定項目を再度、確認してください。

図9 ビルド成功時
図9 ビルド成功時

 ビルドファイルをダウンロードしたら、実機もしくはシミュレータにインストールして実行してください。iOSシミュレータならば、ios-simなどを使って実行するとよいでしょう。例えば、iPhone6のシミュレータ上で実行する場合にはリスト3のようにします。

リスト3 iOSシミュレータ上での実行例
$ios-sim launch ./TodoiOS.app --devicetypeid iPhone-6

次のページ
アプリを端末に配信する

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
最新バージョン「Visual Studio 2017(Visual Studio "15")」特集連載記事一覧

もっと読む

この記事の著者

WINGSプロジェクト 小林 昌弘(コバヤシ マサヒロ)

WINGSプロジェクトについて>有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

WINGSプロジェクト 秋葉 龍一(アキバ リュウイチ)

WINGSプロジェクトについて>有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2018年11月時点での登録メンバは55名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂きたい。著書記事多数。 RSS X: @WingsPro_info(公式)、@WingsPro_info/wings(メンバーリスト) Facebook

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

山田 祥寛(ヤマダ ヨシヒロ)

静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for Visual Studio and Development Technologies。執筆コミュニティ「WINGSプロジェクト」代表。主な著書に「独習シリーズ(Java・C#・Python・PHP・Ruby・JSP&サーブレットなど)」「速習シリーズ(ASP.NET Core・Vue.js・React・TypeScript・ECMAScript、Laravelなど)」「改訂3版JavaScript本格入門」「これからはじめるReact実践入門」「はじめてのAndroidアプリ開発 Kotlin編 」他、著書多数

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

【AD】本記事の内容は記事掲載開始時点のものです 企画・制作 株式会社翔泳社

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/10095 2017/05/29 15:31

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング