MVVM for iOS

iOSアプリケーションの開発にMVVMアーキテクチャの考えを持ち込んで設計を見直そうという話をしました

Transcript

1. MVVM for iOS MVVM for iOS @laiso @laiso 03/12/2014 03/12/2014 potatotips#5(at COOKPAD) potatotips#5(at COOKPAD)
2. laiso is NOT laiso is NOT ແ৬ ແ৬ http://lai.so/
3. ΤϯλʔϓϥΠζ ΤϯλʔϓϥΠζObjective-C Objective-C ͷੈքͱ͸ ͷੈքͱ͸
4. มߋ͕πϥ͍ มߋ͕πϥ͍iOS iOSΞϓϦέʔ ΞϓϦέʔ γϣϯ γϣϯ Fat & Massive ViewController God object, Singleton UI testing is very hard
5. มߋʹཱͪ޲͔͏ มߋʹཱͪ޲͔͏iOS iOSΞϓϦ ΞϓϦ έʔγϣϯ έʔγϣϯ OSΞοϓσʔτʹΑΓΫϥΠΞϯτͷ؀ڥ͕ͲΜͲΜߋ ৽͞ΕͯΏ͘ ϢʔβʔαΠυͰಈ͘ͿΜݖݶ΍Өڹ͕େ͖͘มߋʹϦε Ϋ͕͋Δ(඼࣭ཁٻ͕ߴ͍) ωΠςΟϒUIͷมߋ͸HTML+JavaScriptͳͲΑΓॏ͘ͳΓ ͕ͪ
6. ઃܭվળ ઃܭվળ ίʔυΛཧղ͠΍͍ͨ͘͢͠ ςετΛॻ͖΍͍ͨ͘͢͠ มߋʹڧ͘ͳΓɺߴ଎ʹ։ൃ͍ͨ͠
7. MVVM MVVM (Model View ViewModel) (Model View ViewModel)
8. MVVM MVVM Windows / .NET WPF Silverlight JavaScript Framework AngularJS KnockoutJS
9. MVC MVC MVVM MVVM
10. Cocoa vs MVVM Cocoa vs MVVM ϓϥοτϑΥʔϜຖʹMVCͷߟ͑ํ͸ҧ͏ (Rails,Cocoa,Smalltalk) Controller != ViewController MVVM View == View+ViewController
11. ViewController ViewController Ϗϡʔͷίϯτϩʔϥʔ ΞϓϦέʔγϣϯ/Ϟδϡʔϧ"ͷ"ίϯτϩʔϥʔͰ͸ͳ ͍ ର৅ͷϏϡʔΛอ໋࣋ͯ͠ྩ͢Δ
12. ViewModel ViewModel View-ModelɻϏϡʔͷͨΊͷϞσϧ σʔλόΠϯσΟϯάͷ࢓૊ΈͰσʔλΛϏϡʔͱ઀ଓ Ϗϡʔͳ͠Ͱ΋ΠϯλʔϑΣΠεΛૢ࡞Ͱ͖Δ
13. MVVM MVVMͷத৺ͱͳΔߟ͑ํ ͷத৺ͱͳΔߟ͑ํ એݴతͳViewςϯϓϨʔτ σʔλόΠϯσΟϯά
14. Storyboard(IB) Storyboard(IB) એݴతͳViewςϯϓϨʔτ Storyboard != View த਎͸Ξοϓϧͷಠࣗن֨ͷXMLςΩετϑΝΠϧ Xcode͕GUIσβΠϯπʔϧͱͯ͠ղऍ͢Δɻ ຊ෼͸ϏϡʔΛએݴͯ͠ΠϕϯτΛ઀ଓ͢Δ͜ͱ ʮUIύʔπΛը໘ʹදࣔͤ͞ΔͨΊͷπʔϧʯҎ্ͷ ҙຯ߹͍͕͋Δ
15. σʔλόΠϯσΟϯά σʔλόΠϯσΟϯά = Co‐ = Co‐ coa coaόΠϯσΟϯά όΠϯσΟϯά? ? Mac OS X޲͚ͷσʔλόΠϯσΟϯάػߏ iOSʹ͸དྷͯͳ͍ see "Cocoa Bindings Programming Topics" http://news.mynavi.jp/special/2005/cocoamvc/menu.html
16. σʔλόΠϯσΟϯά σʔλόΠϯσΟϯά = Re‐ = Re‐ activeCocoa activeCocoa https://github.com/ReactiveCocoa/ReactiveCocoa
17. ReactiveCocoa ReactiveCocoa Mac/iOSͰϦΞΫςΟϒϓϩάϥϛϯάΛ࣮ݱ͢Δҝͷϥ ΠϒϥϦ ؔ਺ܕϓϩάϥϛϯά෩ͷݴޠ಺DSL
18. ReactiveCocoa ReactiveCocoaͱ ͱGitHub GitHub GitHubࣾͷਓୡΛϝΠϯʹ։ൃ͞Ε͍ͯΔ GitHub͕Windows൛ΞϓϦέʔγϣϯΛ։ൃ͠ग़ͨ͋͠ ͨΓ͔Β׆ൃʹ GitHubʹC#/.NETܥͷ࣮ྗऀ͕͍ΔɻXamarin/Mono΋΍ ͬͯΔͦ͏ GitHubͷMacΞϓϦ͸ReactiveCocoaΛ࢖ͬͯMVVMΛ࣮ ݱ͍ͯ͠Δ
19. ReactiveCocoa ReactiveCocoa มߋΛγάφϧͱ͍͏ΦϒδΣΫτͰදݱͰ͖ΔͷͰɺ ViewModel͸ViewͷৄࡉΛ஌Δඞཁ͕ͳ͍ ViewModelΛର৅ʹςετ͕ॻ͚Δ
20. RVMViewModel RVMViewModel ReactiveCocoa/ReactiveViewModel ಛఆͷγάφϧͷΠϯλʔϑΣΠεΛఆٛͨ͠ϕʔεΫϥ ε ViewModelͰܧঝͯ͠࢖͏
21. ViewModel ViewModelΛ࢓ࠐΉ Λ࢓ࠐΉ ViewControllerͷॳظԽ࣌ʹ // TipsListViewController - (id)init { // ... self.viewModel = [[TipsListViewModel alloc] init]; return self; }
22. ViewModel ViewModelΛ࢓ࠐΉ Λ࢓ࠐΉ StoryboardͷγʔέϯεͰInject // TipsListViewController - (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender { if ([[segue identifier] isEqualToString:@"showDetail"]) { NSIndexPath *indexPath = [self.tableView indexPathForSelectedRow]; TipsDetailViewController *viewController = segue.destinationViewController; // ભҠઌͷViewModelΛॳظԽͯ͠ฦ͢ viewController.viewModel = [self.viewModel detailViewModelForIndexPath:indexPath]; } }
23. ViewModel ViewModelͷ୯ମςετ ͷ୯ମςετ it (@"ViewModelͷςετ", ^{ TipsDetailViewModel *viewModel = [[TipsDetailViewModel alloc] initWithModel:tips] expect(viewModel.title).to.equal(@"MVVM for iOS"); expect(viewModel.subTitle).to.equal(@""); expect(viewModel.author).to.equal(@"laiso"); });
24. Pros Pros UIͱϩδοΫͷ෼཭ ςετ͠΍͘͢ͳΔ ࠶ར༻͠΍͘͢ͳΔ ϦΞΫςΟϒUIԽͰͷԠ౴ੑ޲্
25. Cons Cons هड़ྔ͕૿͑Δ ReactiveCocoaͷޠኮΛशಘ͢Δඞཁ͕͋Δ ࣮ݧతͰ࣮ફ͢Δͷ͕೉͍͠ ϑϨʔϜϫʔΫଆͷڧ੍ྗ͸ͳ͍ͷͰͨͩ৑௕ʹͳͬ ͯΠϚΠνͳײ͡ͰऴΘΔՄೳੑ΋͋Δ UIʹର͢Δςετ͸ΧόʔͰ͖ͳ͍
26. ͜Ε͔Β ͜Ε͔Β 1. ෳ਺ͷ։ൃऀ͕͔͔ΘΔΑ͏ͳෳࡶͰن໛ͷେ͖ͳΞϓϦ έʔγϣϯΛ͏·͘։ൃͰ͖ΔΑ͏ʹ͢Δ 2. ςετͰอޢͰ͖ΔൣғΛ૿΍ͯ͠ϦϑΝΫλϦϯάͰί ʔυͷ෗ഊΛ๷͗ߴ଎ʹϦϦʔεͰ͖ΔΑ͏ʹ͢Δ 3. ํ๏࿦ͷಋೖͰ͸ͳ͘എܠͷ՝୊ʹؔ৺Λ࣋ͪࣗ෼ͨͪͰ ߟ͑Δ͜ͱͰվળ͍ͯ͘͠
27. ࢀߟࢿྉ ࢀߟࢿྉ Code Reuse with MVVM Model-View-ViewModel for iOS | Teehan+Lax ReactiveCocoa/Documentation/FrameworkOverview.md at master · ReactiveCocoa/ReactiveCocoa GUI Architectures
28. Functional Reactive Program‐ Functional Reactive Program‐ ming on iOS ming on iOS https://leanpub.com/iosfrp
29. Xamarin.iOS Xamarin.iOS C#޲͚ͷMVVMαϙʔτϥΠϒϥϦ https://github.com/MvvmCross/MvvmCross https://github.com/reactiveui/ReactiveUI
30. Thank You Thank You