これまでに記事を幾つか書きましたが、これらの記事を書きながら私も勉強してきたのでまとも(?)にXamarinでアプリを作ろう！ってのは初の試みだったりします。

今回作りたいアプリの完成図

かりまたかりまた

今回は日頃、会社で疲弊している人たちの為に「有給を増やすアプリ」を作ってみたいと思います。ロジックは至って簡単。 ボタンを押すと、有給が1日増えるという魔法のアプリです。

かりまたかりまた

どのような動きをするのかはYouTubeにアップロードしてみたのでご覧ください。

りんちゃんりんちゃん

このBGMはなんなのにゃ～…

かりまたかりまた

特に意味はないです。「有給」でググったらバイキングのコントが出てきたのでそれを流してるだけです。

アプリの作り方

かりまたかりまた

まずは、Xamarinのプロジェクトの作り方を読んでXamarinのプロジェクトを作成してください。

かりまたかりまた

プロジェクトが開けたら、ソリューションエクスプローラー>MainPage.xamlを開いて、レイアウトを以下のようにしてください。


りんちゃんりんちゃん

実際のソースコードは以下のようになるはずにゃ～

かりまたかりまた

次にこのXAMLのコードビハインドを以下のようなロジックにします。


かりまたかりまた

簡単ですね！これでYeah、めっちゃ、ホリディ！

C#の書き方についてちょっとだけ補足


かりまたかりまた

↑のような書き方なんですが、String interpolation（文字列補間）と言ってVisual Studio 2014のC#6.0から追加された機能です。あんまし業務で見ない書き方な気がしてるんですが、String.Formatよりかは使い勝手が良いのと分かりやすいので好んで使ってます。

One Write More Run

りんちゃんりんちゃん

ちなみに、同じコードでも実行するOSに応じて表示のされ方が異なるにゃ～。これは、それぞれのプラットフォームに合ったコントロールの表示に、イイ感じにXamarinがしてくれてるんだにゃ～。実際に比較してみるとこんな感じだにゃ～

りんちゃんりんちゃん

左がWindows8.1でデバッグしたもの、右がAndroidでデバッグしたものにゃ～。それぞれのコントロールがそれぞれのOSでどのような表示になるのかはiOSも含めて後で検証するとするにゃ～

最後に

かりまたかりまた

初めてXamarinでアプリを作ってみて、意外と簡単なようなそうでもないような感じでした。個人的には、イベントの割り付け方が最初わからなくて、「？？？」という状態でした。WinFormなんかだと、コントロールをダブルクリックするだけでイベントハンドラが作られるんですが…。

りんちゃんりんちゃん

XamarinはXAMLの知識も持ってないと効率的なプログラムを書くのはちょっとキツイかもにゃ～

かりまたかりまた

Xamarinを通して、XAMLであったり、MVVMだったりを合わせて勉強していければ一粒で二つも三つもおいしいね！って感じでがんばっていきましょ～