ただ、いかんせん分からないことだらけで非常に苦労しておりました。
書籍を買って読んでみたり、ネットで調べてみたり、講習会にも参加してみました。
そして、最近になってようやく理解出来るようになってきましたので、これからXamarinについての記事も書いていこうと思っております。
今日は手始めに「Hello World」を表示するところまでやってみたいと思います。
ちなみにXamarinはMac Bookを使って開発しています。
最初はWindowsのVisual Studioで開発を行っていたのですが、なぜか原因不明のエラーが出て、しかも解決方法もよく分からないということが頻発していましたので、思い切ってMacで開発することにしました。Macにしてからエラーも出ることがなくなりスムーズに開発できるようになりました。Xamarinやる方はMacがお勧めです。
では早速、「Hello World」を作っていきたいと思います。
まず、Visual Studio for Macを起動したら、Newを選択します。
次にマルチプラットフォームからアプリを選び、Xamarin.Formsの中の「空白フォームのアプリ」を選択したら、「次へ」をクリックします。
次にアプリ名を入力し、ターゲットプラットフォームはAndroidとiOS両方にチェックを入れ「次へ」をクリックします。
次にプロジェクト名を入力します。
そして最後に「作成」ボタンをクリックします。
これでとりあえずプロジェクトは作成できました。
こんな画面が立ち上がってきます。
ここでひとまずデバッガで動かしてみたいと思います。
起動するプラットフォームを選択したいと思いますので矢印の部分をクリックします。
するとこのような表示になるのでまずはAndroidを選択したいと思います。
選択するとこのような感じになります。
次に実行ボタンをクリックします。
するとAndroidエミュレーターが起動してきて、「Welcome to Xamarin.Forms!」と表示されるのが確認できます。
ではデバッガを停止します。
そしてエミュレーターも終了したいと思います。
メニューから「Quit」を選択します。
次にiOSで動かしてみたいと思います。
対象のプラットフォームを「HelloWorld.iOS」にします。
そして起動すると、このようにシミュレーターが起動してきます。
では、一旦デバッガを停止し、シミュレーターも終了したいと思います。
メニューから「Quit Simulator」を選択します。
次に先ほど画面に表示されていた「Welcome to Xamarin.Forms!」を「Hello World!」に変えたいと思います。
左のソリューションエクスプローラーから「MainPage.xaml」をダブルクリックして表示させます。
そして、LabelのText部分を書き換えたいと思います。
このように「Hello World!」に書き換えます。
書き換えが出来たら再びデバッガを起動してみます。
Androidエミュレーターの表示です。
「Hello World!」と表示されています。
次にiOSシミュレーターです。
こちらも「Hello World!」と表示されています。
とりあえずこれで「Hello World!」を表示させるアプリは完成です。
気づいたと思いますが「MainPage.xaml」を書き換えただけでAndroid、iOS両方の表示が変わりました。これがXamarinの大きな魅力です。完全ではないですが多くの部分でコードを共有できるようになっていて、クロスプラットフォーム開発が出来るようになっています。
まだまだ分からないことがたくさんあるのですが、記事に出来ることがあればまた書いていきたいと思います。
スポンサーリンク