本サイトからスピンオフした姉妹サイトです。「iOSのネイティブアプリをWindows上で作るって、どういうこと?」という疑問に答え、実際にiOSアプリ開発を試してみる。Studioの利用経験が10年以上と長く、その使い勝手の良さや、開発生産性をとても気に入っている。Studioが使えるといいな」と思うことは少なくない。これと同じことを考えたことがある方であれば、本稿の内容はきっと興味深いに違いない。Studioを触ったことがなくても、「Windows上で」iOSやAndroid向けのアプリを開発したい方であれば、本稿を一読してその開発方法を知っておくことには価値があるだろう。いって、Xamarin(ザマリン)製品についてはこれまで、何となく「興味本位では扱うが、本格利用では敬遠したい」という気持ちがあった(......本当にごめんなさい)。@IT」という記事を企画・編集したりしてきており、好奇心でXamarin製品を追いかけてきた。@ITの業務アプリInsider主催のイベントで「純正以外の開発技術を使うと、突然の規約変更などで『リジェクト(=アプリの受付拒否)』される可能性があったり、最新の環境にライブラリが対応していなかったりという問題がある」との意見もあったので、「やはり本格的なプロジェクトでは使いたくないもの」という考えに傾いていた。その考えが最近変わったのである。Studio上でiOSアプリを開発しているところである)。XとWindowsのクロスプラットフォームで動作する独自のIDEが採用されていた。Studioを使って開発できるなら、その方がいい」という気持ちは依然として強かった。Studio)で実現してしまったのだ。開発できる内容は、以前と比べてそれほど大差がないかもしれないが、特に「iOSのネイティブアプリをC#を使ってWindows上で作れる」ところに筆者は感動している。Studioについて、筆者が実際に試し、その基本的な開発の内容を簡単に紹介する。iOSとAndroidの両方のアプリ開発方法について説明すると、かなり長くなってしまうので、今回、実際に開発する内容については、iOSアプリに絞って説明する。Androidアプリの開発内容については、後編で説明する。Studioの機能内容や開発手順を見ていこう、としたいところだが、その前に、「iOSアプリをWindows上で作ると言っても、UI(ユーザーインターフェイス)の作成とかどうするの?」など、根本的な疑問の方が気になると思うので、先にいくつかの主要な疑問点について筆者なりに回答しておこう。Builder」というGUIデザイナーを使う2コードでUIを記述するという2種類の手段がある。簡単なUI作成では1の場合が多いが、細かく表示位置などを制御したい場合などでは2の方が好まれる傾向にある。実際に、弊社のiOSアプリの「ロケスマ」などでは2の方法でUIが作成されている。Builderはサポートされていないので、コードでしか作成できない)。使うUI部品はiOSネイティブのものになる(Xamarin独自のものではないので、iOSのバージョンアップにより外観が変わる場合も安心だ)。「iOSアプリをWindows上で作るって、デバッグ実行はどうするの?」iOSアプリのデバッグ実行は、(Mac向けの)Xcodeに付属の「iOSシミュレータ」などを使う。Xの実機は必要になる。Studioから、リモートにあるMacを指定することになる(詳細後述)。Studioでそのアプリをデバッグすることもできる。Studio上でiOSアプリを開発しているところ」という画像は、Mac1台で開発からデバッグまでを行っている例だ。Studioに統合されたUIデザイナーが提供されており、これを使ってビジュアルにUIデザインを行える(次回、詳細を説明)。MicrosoftとXamarinの関係.NETを推進するマイクロソフト社と、その互換環境(Mono)を活用した製品を提供するザマリン社の仲は悪くなかったと想像されるが、これまで強力なパートナーシップを結んでいる印象もなかった。2013」というマイクロソフト社のカンファレンスで、マイクロソフトのエバンジェリストが自社製品を差しおいて1セッション丸々説明しているのである。Studioのリリースとともに発表された「マイクロソフト社とザマリン社のパートナー提携」があるのだ。この提携に基づき、以下のような新施策が発表されている。2013へのXamarin開発環境の統合MSDNサブスクライバー向けの特別特典それぞれの内容を、もう少し説明しておこう。最新の.NETでは、マルチプラットフォーム対応のライブラリをC#などで記述できる「ポータブル・クラス・ライブラリ」(PCL)という機能が提供されている。Phoneなどと、Windowsプラットフォームに限定された機能だった。それが今回、Xamarin.AndroidとXamarin.iOSのサポートが追加され(次の画面を参照)、AndroidやiOSといったプラットフォームでもライブラリがそのまま使い回せることになった。2013へのXamarin開発環境の統合これが本稿で説明する内容である。2013内でXamarin開発が行えるようになった。MSDNサブスクライバー向けの特別特典マイクロソフトの開発者向けサービスの会員向けに、1年間の開発者ラインセンスの割引(1998→1399米ドル。Universityというトレーニングコースへの無料参加という2つの特別特典が提供されている。Studioの環境構築まずは、Xamarin製品全体をダウンロードしよう。Windows]ボタンをクリックしてインストーラー(XamarinInstaller.exeファイル)をダウンロードしよう。Todayインストーラーを実行して、そのウィザードの指示に従い、インストールを進める。selection)では、次の画面のように全てのオプションにチェックを入れるようにしてほしい。selection]ページウィザードの最後でXamarinアカウントのログインが求められる。筆者の場合、Xamarin.iOSとXamarin.Android向けの2つの「Business」ライセンスを保有しているので、ログインすると両者のライセンスがそのまま有効になった。ライセンスを持っていない場合は、Businessライセンスを30日間試用できるはずだ。2013を起動してみよう、といきたいところだが、実際に起動してiOSアプリなどを作ろうとすると、次の画面のように一部の画面の表示がおかしい状態になってしまう(※筆者が試したのは、2013年11月22日ごろなので、すでに改善されている可能性もある。その点はご了承いただきたい)。Studioの言語を「English」にしてみたところ、表示崩れの問題は解消した。具体的には、下記のリンク先から「English」の言語パックをダウンロードして、インストールする。Studioを起動して、メニューバーの[ツール]-[オプション]からダイアログを起動して、左側のツリーから[環境]-[国際対応の設定]を選択し、右側の[言語]欄で「English」を選択し、[OK]ボタンをクリックしてダイアログを閉じ、最後にIDEを再起動すればよい。iOSアプリ開発それでは準備が整ったので、まずはiOSアプリの開発手順から見ていこう。C#]の配下に[iOS]というカテゴリが追加されているのが分かる(次の画面)。iOS関連のプロジェクトテンプレート[iOS]の配下に、[iPad][iPhone][Universal]というカテゴリが見える。この4つのカテゴリフォルダーに含まれるプロジェクトテンプレートは以下のとおりだ。Application」テンプレートでプロジェクトを新規作成してみることにしよう(プロジェクト名は「HelloiOSWorld」とした)。Application」のひな型ファイル群プロジェクト作成時に自動生成されるファイル群を見てみよう。エクスプローラー]の中は、次の画像のような内容になった。Application」のひな型ファイル群それぞれのファイル内容について簡単に説明しよう(C#で開発する方が本稿の読者の大半だと思われるが、.NET開発者以外にも分かるように、.NET関連の基本的なファイルについても簡単に説明しておく)。.NETではビルド後のファイルを「アセンブリ(Assembly)」と呼ぶが、そのアセンブリに付加する情報を記載するためのファイル[Propeties]フォルダーをダブルクリックすると、プロジェクトプロパティが開かれ、GUI操作でiOS関連のビルドや実行などの各種プロジェクト設定が行える(次の画面)。.NETの基本機能を含むアセンブリ。厳密には.NETではなく、Xamarin独自の.NET互換のMonoのアセンブリになっている[Components]フォルダーひな型では空になっている。Xamarinコンポーネントストアから必要なコンポーネント(無料/有料)を導入できる。Studio上でコンポーネントを追加するダイアログを表示したところだ。Studioから起動したXamarinコンポーネントストアのダイアログ[Resources]フォルダーiOSアプリ用の画像などのリソースファイルが配置されている。Info.plistiOSアプリに関する設定情報(アプリケーション名やアイコンなど)を記述するファイル(iOS開発では必須のファイルで、Xamarin独自のものではない)。このファイル項目をダブルクリックすると、次の画面のようにGUIで各設定情報を入力できる。Info.plistファイルのGUI設定Main.cs/AppDelegate.cs/MyViewController.csこの3つが、アプリのソースファイルである。メインビューを管理・制御するクラス各ソースファイルのコード内容を簡単に見ていこう。アプリのエントリーポイントまずはMain.csファイルのコード内容を示す。これがアプリのメイン・エントリ・ポイント。"AppDelegate");}}}Main.csファイルのコード内容(一部翻訳)あえて説明するまでもないと思うが、簡単にコード内容を説明すると、Applicationクラス(HelloiOSWorld名前空間)の中に、静的なMainメソッドが定義されている。アプリが起動されてMainメソッドが呼び出されると、その中のUIApplicationクラス(MonoTouch.UIKit名前空間)の静的なMainメソッドが実行される。このメソッドの第3引数として「AppDelegate」が渡されているが、これによりAppDelegateクラスが、OSから出されるイベントを処理できるようになる。OSからのイベントを処理するクラスそのAppDelegateクラスの内容は次のとおり。true;}}}AppDelegate.csファイルのコード内容AppDelegateクラスは、UIApplicationDelegateクラス(MonoTouch.UIKit名前空間)を継承することで、OSからのイベント通知を受け取る機能を獲得している。AppDelegateクラスにはRegister属性(MonoTouch.Foundation名前空間)が付与されているが、これは「iOSの世界に、このAppDelegateクラスを公開していること」を意味する。クラス内にFinishedLaunchingメソッドがオーバーライドされているが、これは「OSから通知されたFinishedLaunching(=起動完了)イベントを処理するためのメソッド」である。そのメソッドの中身を見ると、UIWindowクラス(MonoTouch.UIKit名前空間)をメイン画面領域(=UIScreen.MainScreen.Bounds)として作成し(つまりメインウィンドウの作成)、そのウィンドウのRootViewControllerプロパティ(=ルートとなるビューコントローラー)に、MyViewControllerクラスのインスタンスを指定している。最後に、メインウィンドウのMakeKeyAndVisibleメソッドを呼び出すことで、実際に画面を作成して表示している。要するにこのコードは、アプリの起動完了後に、メイン画面を表示しているだけである。その実装先が、先ほど出てきたMyViewControllerクラスである。このクラスは次のようなコードになっている。|UIViewAutoresizing.FlexibleBottomMargin;View.AddSubview(button);}}}MyViewController.csファイルのコード内容MyViewControllerクラスは、UIViewControllerクラス(MonoTouch.UIKit名前空間)を継承することでビューコントローラーとしての機能を獲得している。「MyViewController()」というコードで示されているコンストラクターの中には、通常、初期処理などを記述するが、このひな型コードでは何も処理が実装されていない。次にViewDidLoadメソッドがオーバーライドされている。このメソッドは、ビューがロードされたときに1回だけ呼び出される。そのメソッドの中身を見ると、詳しい説明は割愛するが、フレーム(Frame)を定義したり、背景色(BackgroundColor)を設定したり、ボタンを作成してビューに追加したり(=「View.AddSubview(button)」というコード箇所)している。このViewDidLoadメソッドの中身部分が、「コードでUIを記述する」と前に説明した箇所になる。times」という表示に変える処理が記述されている。そのため、このアプリを実行すると、ボタンをタップするたびに、そのタッチ回数が表示されることになる。以上、このiOSアプリのプロジェクト内容や、アプリの挙動を一通り説明した。StudioからのiOSアプリのデバッグ」を試してみよう。name][Identifier][Version]を指定する必要がある。今回は次の画像のように指定した。name]と[Identifier][Version]の指定この状態でプロジェクトをビルドしておこう。Host]ボタンをクリックする。すると、次のようなダイアログが表示される。Host」の起動を促されるこのダイアログに示されているとおり、Mac側にもXamarinのインストールが必要になる(インストール手順はWindowsの場合とほぼ同じなので、説明は割愛)。Host」がヒットするので、これを起動する。起動したら、[Pair]ボタンをクリックする。これにより、PIN番号を取得できる。Host]ダイアログの[Continue]ボタンをクリックする。次のような画面が表示されるので、リストから適切なMacマシンを選択した状態で[Connect]ボタンをクリックする。これにより接続処理が実行され、PIN番号の入力ダイアログが表示されるので、先ほど取得したPIN番号を入力して[Pair]ボタンをクリックする。StudioでiOSアプリがデバッグできるようになる。StudioでのiOSアプリのデバッグそれでは実際にデバッグを開始してみよう。今回は、Mac上の「iOSシミュレータ」でデバッグする。Platforms]欄から「iPhoneSimulator」を選択した状態で(次の画面を参照)、デバッグを開始しよう。Studioの[iOS]ツールバーで「iPhoneSimulator」(=iOSシミュレータ)を選択すると、Mac側で「iOSシミュレータ」が自動起動して、その中でデバッグ対象のiOSアプリが自動的に立ち上がる。Studio上でブレークポイントを設定してデバッグを中断し、ステップ実行したり、変数の値を調べたりできる。Studioで特に気になるポイントを説明し、実際にiOSアプリ開発を試してみた。興味を持った方は本稿を参考に試してみていただけると幸いだ。本稿では説明できなかったAndroid開発について、次回「Android編」で説明しています。「iOSのネイティブアプリをWindows上で作るって、どういうこと?」という疑問に答え、実際にiOSアプリ開発を試してみる。StudioでiOS/Androidアプリが書けるXamarinを試してみた(Android編)iOS編の続編。Studioで基礎的なAndroidアプリのプロジェクトを作成し、生成されるファイル群を説明。Studioでデバッグしてみる。機械学習エンジニアを目指す人~初中級者のための技術情報サイトです。「機械学習&AI」「クラウド&ビッグデータ」「IoTデバイス」のネット記事情報を共有中。開発者のためのSlackチーム、作りました:「機械学習&AI」「クラウド&ビッグデータ」「IoTデバイス」のネット記事情報を共有中。2020最適なビューへの切り替えを推奨します:スマートフォン用表示に。