Xamarin でスマートフォンアプリを作成してみた (1/9)

アプリを作成し、AndroidとiPhoneでその動作を確認します。

流れ


以下のような流れで、紹介します。

  • 1. アプリ作りの準備 (本ページ)
  • 2. プロジェクト作成(アプリ作成のたたき台)
  • 3. Androidアプリを確認してみる(#Visual Studio,# Xamarin)
  • 4. iOSアプリを確認してみる(#Visual Studio,#Xamarin)
  • 5. アプリをAndroidスマホで動かしてみる
  • 6. アプリをiPhone/iPadで動かしてみる
  • 7. 画像を表示する
  • 8. タップイベントに対応する
  • 9. アイコンを変更する


  • ※なお、開発環境は こちら です。

    アプリ作りの準備


    スマホアプリを作成するため、各種ソフトウェアをインストールします。インストールするソフトウェアは次の2つです。

    XamarinIcon 1.VisualStudio

    XcodeIcon 2.Xcode

    Visual Studioのインストール

    1_VSCForMac
    VisualStudioを以下のサイトからダウンロードします。
    https://www.visualstudio.com/ja/vs/community/ VisualStdioには、有料のEnterpriseなど 様々種類 がありますが、個人で開発する場合は、無料のCommunityで良いでしょう。今回選択したのは、 Visual Studio Community 2017 です。


    1_VisualStdioCommunity2017ForMac
    中心の下矢印↓アイコン を押すと、「 Install Visual Studio 」を押すと、パソコンにインストールが始まります。
    1_VisualStdioCommunity2017ForMac
    環境により、次のメッセージウィンドウが表示されます。その場合は、「 開く 」を押してください。
    1_VisualStdioCommunity2017ForMac
    以下の画面が表示され、パソコン内の設定が確認され流ので、終るまでしばらく待機します。
    1_VisualStdioCommunity2017ForMac
    ライセンスに同意するかの確認画面が表示されるので、ライセンス規約を読み、右下の「 続行 」をクリックしてください。
    1_VisualStdioCommunity2017ForMac
    インストールするものを選択する画面が表示されるので、デフォルトのまま、右下の「 インストール 」を押してください。
    1_VisualStdioCommunity2017ForMac
    パソコンにVisual Studioのインストールが始まります。
    VisualStudioは3Gbyte程度あるため、インストールには2時間ほど掛かりました。
    1_VisualStdioCommunity2017ForMac
    この時、2回承認を求められます。
    ログインしているMACのアカウント名とパスワードを入力し、右下の「 OK 」を押してください。
    1_VisualStdioCommunity2017ForMac
    Visual Stdioのインストールが完了すると、右のような画面が表示されます。
    画面中央にある、「 Visual Stdioの開始 」を押すと、アプリ作成を始められます。

    Xcodeのインストール

    1_VisualStdioCommunity2017ForMac
    Xcodeを以下のサイトからインストールします。
    https://itunes.apple.com/jp/app/xcode/id497799835?ls=1&mt=12


    1_VisualStdioCommunity2017ForMac
    AppleStoreにログインしている場合は、自動で次のような画面が表示されます。
    Xcodeアイコン の下にある、「 入手 」を押してください。

    ※1.ログインしていない場合は、「入手」の部分が、「Mac App Store で見る」ボタンが表示されているので、クリックしましょう。
    ※2.その後、Apple ID と Passwordを求められるので、入力し、右下の「Sign In」を 押してください。
    1_VisualStdioCommunity2017ForMac
    ダウンロードが開始します。
    1_VisualStdioCommunity2017ForMac
    それでは、次に Andorid,iOSスマホどちらでも動くアプリを作るためのたたき台(プロジェクト)を作成 してみましょう。

    ※なお、開発環境は こちら です。

    更新履歴

    2018年06月12日 : メニュの変更
    2018年02月18日 : メニュの変更
    2018年02月17日 : 体裁の変更
    2018年02月18日 : 初版