Slide 1

Slide 1 text

Xamarin + MvvmCross で作る iOS/Androidアプリ 伊勢  シン (@iseebi) Kyoto.なんか 2014/05/03(Sat)

Slide 2

Slide 2 text

⾃自⼰己紹介 •  伊藤  伸裕 / 伊勢  シン – @iseebi / id:iseebi •  フェンリル株式会社  共同開発部所属 – iOS / Android / Windows 8 のアプリ開発してます •  コミュニティ – スマートフォン勉強会@関⻄西 – すごいHaskell読書会 in ⼤大阪 •  H本読んでます。(2週⽬目)

Slide 3

Slide 3 text

Xamarin 2.0 •  ネイティブの  iOS / Android / Mac アプリを C# で書ける! – Windows プラットフォームを⾜足せば、だいたいのプラッ トフォームのソースをC#で書いてしまえる。

Slide 4

Slide 4 text

処理理を共通化できます! •  C#だけで書ける=iOS/Androidで処理理を共通化できる •  アプリの性質にもよるが、3割から4割くらい共通化できま す。 PCL

Slide 5

Slide 5 text

なぜXamarin? •  C# を使うプラットフォームでは MVVM という概念念がすでに体系化されている。 – Model-View-ViewModel •  クロスプラットフォーム開発で MVVM をサポートするライブラリもすでにある – MvvmCross – QuickCross

Slide 6

Slide 6 text

MVVM •  MVなんとかの中でもバインディングに ものすごく依存している •  移し替えのコードがバグ出やすいので、 なるべくバインディングで解決させたい  (と僕は思う) http://msdn.microsoft.com/en-us/library/gg405484(v=PandP.40).aspx#sec1

Slide 7

Slide 7 text

%&.0

Slide 8

Slide 8 text

プロジェクト初期設定 •  プロジェクトの初期設定 –  http://www.slideshare.net/iseebi/cross-platform- development-with-xamarin-20- mvvmcross-32190450 •  NuGetで導⼊入する際、下記のものも⼊入れる –  MvvmCross –  MvvmCross – DownloadCache Plugin •  MvvmCross.HotTuna.Plugin.DownloadCache –  MvvmCross – File Plugin •  MvvmCross.HotTuna.Plugin.File –  Microsoft HTTP Client Libraries (Coreのみ) •  Microsoft.Net.Http

Slide 9

Slide 9 text

はてなフォトライフへのアクセス •  gistを参考に – https://gist.github.com/iseebi/492486

Slide 10

Slide 10 text

ViewModel の作成 •  取得したデータを出す  IEnumerable をプロパ ティに出す •  Start のタイミングで読み込みを⾏行行う  

Slide 11

Slide 11 text

iOSの実装 – セルの作成 •  iPhone Table View Cell を追加すると、 .cs と .xib が⽣生成される。 •  継承元を  MvxTableViewCell に変更更 •  .xib にコントロールを配置し、アウトレット接続 –  Xcode上で⾏行行う –  UIImageView は  MvxImageView にする。 URLでバインディングできるようになる。 •  DelayBind を記述する

Slide 12

Slide 12 text

iOSの実装 - ViewController •  MvxTableViewController にする •  インナークラスで  TableViewSource を作る – コンストラクタで  RegisterCellForReuse する •  ViewDidLoad でバインディングを作成

Slide 13

Slide 13 text

Androidの実装 - ListItem •  Layout を追加する •  xmlns に local を追加する – xmlns:local="http://schemas.android.com/apk/ res-auto" •  各要素に  local:MvxBind を追加する – コントロール側のプロパティ  ViewModel側のプロパテ ィ  で記述する – ImageView は  Mvx.MvxImageView にする。

Slide 14

Slide 14 text

Android の実装 - View •  ListView のかわりに  Mvx.MvxListView を使⽤用 する。 •  local:MvxBind に  ViewModel とのバインディン グを作成 •  local:MvxItemTemplate で、使⽤用するレイアウ トを指定する

Slide 15

Slide 15 text

デメリット •  ライセンスが⾼高い –  会社で使うと1開発者1プラットフォーム  約10万円 –  チームを組むと  iOS / Android 3本ずつ=60万 (実際はディスカウント⼊入るのでもうちょっと安い) •  こまかい制限もちょいちょい –  動的コンパイル必要な機能は動かない •  まあ、「お⾦金金が出るならアリ」の技術… –  コード共有で浮くお⾦金金でライセンスを買おう

Slide 16

Slide 16 text

まとめ •  Xamarin と  MvvmCross を使うと、 iOS / Android アプリを効率率率的に開発できます。

Slide 17

Slide 17 text

参考URL •  今回のソース –  https://github.com/iseebi/FotolifeViewer •  Qiita の  Xamarin タグ (国内のXamarin系の⼈人の  Qiita 参加率率率⾼高い) –  http://qiita.com/tags/xamarin •  Xamarin ⽇日本語情報  (国内代理理店の⼈人のblog) –  http://ytabuchi.hatenablog.com/ •  Xamarin Japan グループ (facebook) –  https://www.facebook.com/groups/778386365523431/ •  backyard of 伊勢的新常識識 (僕のblogです) –  http://iseebi.hatenablog.com/