Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
M-V-VM. Basics.
Search
DAloG
June 27, 2014
Programming
3
470
M-V-VM. Basics.
In this slides (EN, and RU texts) i will try to explain basics of MVVM pattern.
DAloG
June 27, 2014
Tweet
Share
More Decks by DAloG
See All by DAloG
State normalization (RU)
dalog
0
200
Redux + MQTT
dalog
1
780
От задач к проблемам
dalog
1
260
Unlimited power of Data-Driven UI
dalog
4
650
Data-Driven View Controllers. Tips and Tricks
dalog
5
1.9k
2 years of Redux in iOS. Lessons learned
dalog
0
380
Why unidirectional architecture matter for iOS.
dalog
1
290
Mobile backend without REST
dalog
2
110
Self managed teams 101
dalog
0
150
Other Decks in Programming
See All in Programming
もうちょっといいRubyプロファイラを作りたい (2025)
osyoyu
1
460
機能追加とリーダー業務の類似性
rinchoku
2
1.3k
Platformに“ちょうどいい”責務ってどこ? 関心の熱さにあわせて考える、責務分担のプラクティス
estie
1
140
チームのテスト力を鍛える
goyoki
3
930
Introducing ReActionView: A new ActionView-compatible ERB Engine @ Rails World 2025, Amsterdam
marcoroth
0
710
MCPとデザインシステムに立脚したデザインと実装の融合
yukukotani
4
1.5k
Namespace and Its Future
tagomoris
6
710
AI時代のUIはどこへ行く?
yusukebe
18
9.1k
rage against annotate_predecessor
junk0612
0
170
アプリの "かわいい" を支えるアニメーションツールRiveについて
uetyo
0
280
Improving my own Ruby thereafter
sisshiki1969
1
160
🔨 小さなビルドシステムを作る
momeemt
4
690
Featured
See All Featured
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.6k
Being A Developer After 40
akosma
90
590k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.7k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3k
Done Done
chrislema
185
16k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
22k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
A better future with KSS
kneath
239
17k
YesSQL, Process and Tooling at Scale
rocio
173
14k
The Power of CSS Pseudo Elements
geoffreycrofte
77
6k
Building a Modern Day E-commerce SEO Strategy
aleyda
43
7.6k
Transcript
M-V-VM. Обоснование. Теоретические размышления об абстракции интерфейса пользователя. DAloG @
CocoaHeads/2014(June)
История
История • Паттерн не формализован • Мартин фаулер публикует статью
• Microsoft делает WPF • ReactiveCocoa (Rx) начинает продвижение • objc.io доносит идею в массы.
Мода
Мода • Binding - это удобно • RAC - это
модно • TDD - это полезно • … • PROFIT!!!
Основы
Основы View
Основы View Layout Structure Content
Основы (pre iPad) Layout Structure Content Дизайнер Приложение
Основы (iPad) Layout Structure Content Дизайнер Приложение
Основы (iOS 7) Layout Structure Content Дизайнер Приложение
Основы (iOS 8) Layout Structure Content Дизайнер Приложение
Акцент Content
Content • Цвет • Текст • Шрифт • Состояние (активно,
пассивно) • Анимация
Content
Content Content Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content
Content
Content Статичный Динамичный
Content Статичный Динамичный
Content Статичный ViewModel
View Content ViewModel Structure Layout
ViewModel • Динамическое состояние интерфейса • Прием информации от интерфейса
• Связь с иерархией ViewModel’ей
@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
@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
@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
@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
@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
@interface XXUserCredentialsViewModel: NSObject ! ! …! - (void) loginUser;! !
@property (readonly) XXLoginProcessViewModel* ! ! ! ! ! ! ! ! ! loginProcess;! …! ! @end
M-V-VM ViewModel View Model
M-V-VM ViewModel View Model @model; @viewModel;
Закон восходящих абстракций @model; @viewModel; • Любая абстракция не имеет
доступа к более конкретным сущностям. • IoC используется для прохождения через этот барьер, и только для этого.
M-V-VM ViewModel View Model @model; @viewModel;
M-V-VM ViewModel View Model View
M-V-VM ViewModel View Model View ViewModel View
M-V-VM ViewModel View Model View ViewModel View Model
M-V-VM ViewModel View Model View View Model
M-V-VM ViewModel View Model View View Model Storyboard
M-V-VM ViewModel View Model @model; @viewModel;
Тестирование View Mock View @viewModel; UI
Тестирование VM ViewModel XCAssert() Mock @model; @viewModel;
M-V-VM ViewModel View Model @model; @viewModel;
M-V-VM ViewModel View @model;
MVC Model UIViewController @model; UIView @view;
M-(V-C)-VM ViewModel UIViewController Model UIView
Тестирование View Mock View @viewModel; UI
M-V-VM ViewModel View Model @model; @viewModel;
Model Model @model; Adapter Service
Model Model @model; Adapter Service Network CoreData
Model • Абстракция всего проложения (use case) • Сокрытие конкретных
сервисов • Бизнес правила
Model = ! Application Model = Domain Model
M-V-VM ViewModel View Model @model; @viewModel;
Синхронизация • Динамическая (RAC, KVO) • Статическая (Time, Notification)
RAC — деталь механизма синхронизации.
Тестирование VM ViewModel XCAssert() Mock @model; @viewModel;
Итого
Итого MVVM - инструмент для обеспечения тестирования пользовательского интерфейса путем
его абстрагирования.
Итого MVVM - инструмент для обеспечения тестирования пользовательского интерфейса путем
его абстрагирования.
Минусы • Высокая неявная связность • Низкое зацепление • Сложность
в поддержке • Трудоемкость
M-V-VM ViewModel View Model View ViewModel View Model
Альтернативы • 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
Дополнительные материалы • 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
Вопросы. • Алексей Демедецкий • Twitter: @DAlooG • Skype: nobidon