M-V-VM. Basics.

In this slides (EN, and RU texts) i will try to explain basics of MVVM pattern.

1. M-V-VM. Обоснование. Теоретические размышления об абстракции интерфейса пользователя. DAloG @ CocoaHeads/2014(June)
2. История
3. История • Паттерн не формализован • Мартин фаулер публикует статью • Microsoft делает WPF • ReactiveCocoa (Rx) начинает продвижение • objc.io доносит идею в массы.
4. Мода
5. Мода • Binding - это удобно • RAC - это модно • TDD - это полезно • … • PROFIT!!!
6. Основы
7. Основы View
8. Основы View Layout Structure Content
9. Основы (pre iPad) Layout Structure Content Дизайнер Приложение
10. Основы (iPad) Layout Structure Content Дизайнер Приложение
11. Основы (iOS 7) Layout Structure Content Дизайнер Приложение
12. Основы (iOS 8) Layout Structure Content Дизайнер Приложение
13. Акцент Content
14. Content • Цвет • Текст • Шрифт • Состояние (активно, пассивно) • Анимация
15. Content
16. Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content Content
17. Content
18. Content Статичный Динамичный
19. Content Статичный Динамичный
20. Content Статичный ViewModel
21. View Content ViewModel Structure Layout
22. ViewModel • Динамическое состояние интерфейса • Прием информации от интерфейса • Связь с иерархией ViewModel’ей
23. @interface XXUserCredentialsViewModel: NSObject ! ! /// Динамическое состояние интерфейса! @property (readonly) NSString* name;! @property (readonly) NSString* password;! @property (readonly) BOOL canLogin;! ! /// Прием информации от интерфейса! - (void) setName:(NSString*) name;! - (void) setPassword:(NSString*) password;! - (void) loginUser;! ! /// Связь с иерархией ViewModel’ей! @property (readonly) XXTimelineViewModel* timeline;! ! @end
24. @interface XXUserCredentialsViewModel: NSObject ! ! /// Динамическое состояние интерфейса! @property (readonly) NSString* name;! @property (readonly) NSString* password;! @property (readonly) BOOL canLogin;! ! /// Прием информации от интерфейса! - (void) setName:(NSString*) name;! - (void) setPassword:(NSString*) password;! - (void) loginUser;! ! /// Связь с иерархией ViewModel’ей! @property (readonly) XXTimelineViewModel* timeline;! ! @end
25. @interface XXUserCredentialsViewModel: NSObject ! ! /// Динамическое состояние интерфейса! @property (readonly) NSString* name;! @property (readonly) NSString* password;! @property (readonly) BOOL canLogin;! ! /// Прием информации от интерфейса! - (void) setName:(NSString*) name;! - (void) setPassword:(NSString*) password;! - (void) loginUser;! ! /// Связь с иерархией ViewModel’ей! @property (readonly) XXTimelineViewModel* timeline;! ! @end
26. @interface XXUserCredentialsViewModel: NSObject ! ! /// Динамическое состояние интерфейса! @property (readonly) NSString* name;! @property (readonly) NSString* password;! @property (readonly) BOOL canLogin;! ! /// Прием информации от интерфейса! - (void) setName:(NSString*) name;! - (void) setPassword:(NSString*) password;! - (void) loginUser;! ! /// Связь с иерархией ViewModel’ей! @property (readonly) XXTimelineViewModel* timeline;! ! @end
27. @interface XXUserCredentialsViewModel: NSObject ! ! /// Динамическое состояние интерфейса! @property (readonly) NSString* name;! @property (readonly) NSString* password;! @property (readonly) BOOL canLogin;! ! /// Прием информации от интерфейса! - (void) setName:(NSString*) name;! - (void) setPassword:(NSString*) password;! - (void) loginUser;! ! /// Связь с иерархией ViewModel’ей! @property (readonly) XXTimelineViewModel* timeline;! ! @end
28. @interface XXUserCredentialsViewModel: NSObject ! ! …! - (void) loginUser;! ! @property (readonly) XXLoginProcessViewModel* ! ! ! ! ! ! ! ! ! loginProcess;! …! ! @end
29. M-V-VM ViewModel View Model
30. M-V-VM ViewModel View Model @model; @viewModel;
31. Закон восходящих абстракций @model; @viewModel; • Любая абстракция не имеет доступа к более конкретным сущностям. • IoC используется для прохождения через этот барьер, и только для этого.
32. M-V-VM ViewModel View Model @model; @viewModel;
33. M-V-VM ViewModel View Model View
34. M-V-VM ViewModel View Model View ViewModel View
35. M-V-VM ViewModel View Model View ViewModel View Model
36. M-V-VM ViewModel View Model View View Model
37. M-V-VM ViewModel View Model View View Model Storyboard
38. M-V-VM ViewModel View Model @model; @viewModel;
39. Тестирование View Mock View @viewModel; UI
40. Тестирование VM ViewModel XCAssert() Mock @model; @viewModel;
41. M-V-VM ViewModel View Model @model; @viewModel;
42. M-V-VM ViewModel View @model;
43. MVC Model UIViewController @model; UIView @view;
44. M-(V-C)-VM ViewModel UIViewController Model UIView
45. Тестирование View Mock View @viewModel; UI
46. M-V-VM ViewModel View Model @model; @viewModel;
47. Model Model @model; Adapter Service
48. Model Model @model; Adapter Service Network CoreData
49. Model • Абстракция всего проложения (use case) • Сокрытие конкретных сервисов • Бизнес правила
50. Model = ! Application Model = Domain Model
51. M-V-VM ViewModel View Model @model; @viewModel;
52. Синхронизация • Динамическая (RAC, KVO) • Статическая (Time, Notification)
53. RAC — деталь механизма синхронизации.
54. Тестирование VM ViewModel XCAssert() Mock @model; @viewModel;
55. Итого
56. Итого MVVM - инструмент для обеспечения тестирования пользовательского интерфейса путем его абстрагирования.
57. Итого MVVM - инструмент для обеспечения тестирования пользовательского интерфейса путем его абстрагирования.
58. Минусы • Высокая неявная связность • Низкое зацепление • Сложность в поддержке • Трудоемкость
59. M-V-VM ViewModel View Model View ViewModel View Model
60. Альтернативы • As Is • Fat Data Source - apple way. http://oleb.net/ blog/2014/06/apples-take-on-app-architecture/ • Active Model - [self.ui …]. http://www.objc.io/ issue-13/viper.html
61. Дополнительные материалы • MSDN (WPF) • ReactiveViewModel - RAC connected. • Clean architecture - http://blog.8thlight.com/ uncle-bob/2012/08/13/the-clean-architecture.html • Presentation Model - http://martinfowler.com/ eaaDev/PresentationModel.html • objc.io - http://www.objc.io/issue-13/mvvm.html
62. Вопросы. • Алексей Демедецкий • Twitter: @DAlooG • Skype: nobidon