SlideShare a Scribd company logo
MVVM
Design Patterns
Victor-Andrei Filimon
Agenda
• What is MVVM?
• WPF concepts
• MVVM vs/and MVC
• Advantages
• Disadvantages
• Demo
• References
What is MVVM?
• Splits the user interfaces in Model, View, View Model
• Model : data from database
• View: visual representation of the data, the part that the user interacts with
• View Model: the glue between the View and the Model. Controls the View
interaction with the application and wraps the data from Model for the View
What is MVVM?
Model not aware of the View Model and View Model not aware of the View.
MVVM vs/and MVC
MVVM vs/and MVC
WPF Concepts
• Bindings: connects 2 properties on 2 different objects so that if one of them
changes the other changes too
• Data Templates: converts non-visual data (View Model) into its visual
representation (View)
• Commands: passes the events from View to View Model
WPF Concepts
Advantages
• abstraction of the View (less code-behind)
• View Model is easier to unit test
• re-use
• flexibility and customization : different Views can be used with the same
View Model -> different visual representation of the same functionality
depending on what different customers want
• separation of UI design and development
Disadvantages
• can be overkill for simple UI
• the View Model can be hard to design (if you want to the right amount of
generality)
• harder to debug
• the Bindings can be heavier than the objects being bound
DEMO
¿ Questions ?
References
• http://blogs.msdn.com/b/johngossman/archive/2005/10/08/478683.aspx
• https://russelleast.wordpress.com/2008/08/09/overview-of-the-modelview-viewmodel-mvvm-pattern-and-
data-binding/
• http://joel.inpointform.net/software-development/mvvm-vs-mvp-vs-mvc-the-differences-explained/
• http://www.codeproject.com/Articles/100175/Model-View-ViewModel-MVVM-Explained
• http://www.codeproject.com/Articles/228214/Understanding-Basics-of-UI-Design-Pattern-MVC-MVP
• http://www.codeproject.com/Articles/278901/MVVM-Pattern-Made-Simple
• http://blogs.msdn.com/b/johngossman/archive/2006/03/04/543695.aspx
• http://rachelappel.com/comparing-the-mvc-and-mvvm-patterns-along-with-their-respective-viewmodels
• http://geekswithblogs.net/dlussier/archive/2009/11/21/136454.aspx

More Related Content

What's hot

MVC Architecture
MVC ArchitectureMVC Architecture
MVC Architecture
Prem Sanil
 
Model view controller (mvc)
Model view controller (mvc)Model view controller (mvc)
Model view controller (mvc)
M Ahsan Khan
 
MVC architecture
MVC architectureMVC architecture
MVC architecture
Emily Bauman
 
iOS architecture patterns
iOS architecture patternsiOS architecture patterns
iOS architecture patterns
allanh0526
 
Model View Controller (MVC)
Model View Controller (MVC)Model View Controller (MVC)
Model View Controller (MVC)
Javier Antonio Humarán Peñuñuri
 
Software architectural design patterns(MVC, MVP, MVVM, VIPER) for iOS
Software architectural design patterns(MVC, MVP, MVVM, VIPER) for iOSSoftware architectural design patterns(MVC, MVP, MVVM, VIPER) for iOS
Software architectural design patterns(MVC, MVP, MVVM, VIPER) for iOS
Jinkyu Kim
 
Asp.net MVC training session
Asp.net MVC training sessionAsp.net MVC training session
Asp.net MVC training session
Hrichi Mohamed
 
MSDN - ASP.NET MVC
MSDN - ASP.NET MVCMSDN - ASP.NET MVC
MSDN - ASP.NET MVC
Maarten Balliauw
 
Swift in SwiftUI
Swift in SwiftUISwift in SwiftUI
Swift in SwiftUI
Bongwon Lee
 
MVC ppt presentation
MVC ppt presentationMVC ppt presentation
MVC ppt presentation
Bhavin Shah
 
WEB DEVELOPMENT USING REACT JS
 WEB DEVELOPMENT USING REACT JS WEB DEVELOPMENT USING REACT JS
WEB DEVELOPMENT USING REACT JS
MuthuKumaran Singaravelu
 
MVVM with WPF
MVVM with WPFMVVM with WPF
MVVM with WPF
S V
 
MVCもやもや話
MVCもやもや話MVCもやもや話
MVCもやもや話
Tetsuya Kaneuchi
 
Web engineering - MVC
Web engineering - MVCWeb engineering - MVC
Web engineering - MVC
Nosheen Qamar
 
Unified modeling language diagrams
Unified modeling language diagramsUnified modeling language diagrams
Unified modeling language diagrams
Alaa Ahmed
 
Reactjs
Reactjs Reactjs
Reactjs
Neha Sharma
 
Mvc, mvp, mvvm...
Mvc, mvp, mvvm...Mvc, mvp, mvvm...
Mvc, mvp, mvvm...
Yury Kisliak
 
ASP.NET MVC Presentation
ASP.NET MVC PresentationASP.NET MVC Presentation
ASP.NET MVC Presentation
ivpol
 
ASP.NET MVC Presentation
ASP.NET MVC PresentationASP.NET MVC Presentation
ASP.NET MVC Presentation
Volkan Uzun
 
Software Architecture and Design
Software Architecture and DesignSoftware Architecture and Design
Software Architecture and Design
Ra'Fat Al-Msie'deen
 

What's hot (20)

MVC Architecture
MVC ArchitectureMVC Architecture
MVC Architecture
 
Model view controller (mvc)
Model view controller (mvc)Model view controller (mvc)
Model view controller (mvc)
 
MVC architecture
MVC architectureMVC architecture
MVC architecture
 
iOS architecture patterns
iOS architecture patternsiOS architecture patterns
iOS architecture patterns
 
Model View Controller (MVC)
Model View Controller (MVC)Model View Controller (MVC)
Model View Controller (MVC)
 
Software architectural design patterns(MVC, MVP, MVVM, VIPER) for iOS
Software architectural design patterns(MVC, MVP, MVVM, VIPER) for iOSSoftware architectural design patterns(MVC, MVP, MVVM, VIPER) for iOS
Software architectural design patterns(MVC, MVP, MVVM, VIPER) for iOS
 
Asp.net MVC training session
Asp.net MVC training sessionAsp.net MVC training session
Asp.net MVC training session
 
MSDN - ASP.NET MVC
MSDN - ASP.NET MVCMSDN - ASP.NET MVC
MSDN - ASP.NET MVC
 
Swift in SwiftUI
Swift in SwiftUISwift in SwiftUI
Swift in SwiftUI
 
MVC ppt presentation
MVC ppt presentationMVC ppt presentation
MVC ppt presentation
 
WEB DEVELOPMENT USING REACT JS
 WEB DEVELOPMENT USING REACT JS WEB DEVELOPMENT USING REACT JS
WEB DEVELOPMENT USING REACT JS
 
MVVM with WPF
MVVM with WPFMVVM with WPF
MVVM with WPF
 
MVCもやもや話
MVCもやもや話MVCもやもや話
MVCもやもや話
 
Web engineering - MVC
Web engineering - MVCWeb engineering - MVC
Web engineering - MVC
 
Unified modeling language diagrams
Unified modeling language diagramsUnified modeling language diagrams
Unified modeling language diagrams
 
Reactjs
Reactjs Reactjs
Reactjs
 
Mvc, mvp, mvvm...
Mvc, mvp, mvvm...Mvc, mvp, mvvm...
Mvc, mvp, mvvm...
 
ASP.NET MVC Presentation
ASP.NET MVC PresentationASP.NET MVC Presentation
ASP.NET MVC Presentation
 
ASP.NET MVC Presentation
ASP.NET MVC PresentationASP.NET MVC Presentation
ASP.NET MVC Presentation
 
Software Architecture and Design
Software Architecture and DesignSoftware Architecture and Design
Software Architecture and Design
 

Viewers also liked

MVVM de A à Z
MVVM de A à ZMVVM de A à Z
MVVM de A à Z
Microsoft
 
MVVM par Karim PIerre Maalej
MVVM par Karim PIerre MaalejMVVM par Karim PIerre Maalej
MVVM par Karim PIerre Maalej
CocoaHeads France
 
Mvvm basics
Mvvm basicsMvvm basics
Mvvm basics
anusha kadimi
 
L'architecture MVVM avec KnockoutJS
L'architecture MVVM avec KnockoutJSL'architecture MVVM avec KnockoutJS
L'architecture MVVM avec KnockoutJSDavid Bottiau
 

Viewers also liked (6)

MVVM de A à Z
MVVM de A à ZMVVM de A à Z
MVVM de A à Z
 
Présentation WPF
Présentation  WPFPrésentation  WPF
Présentation WPF
 
MVVM par Karim PIerre Maalej
MVVM par Karim PIerre MaalejMVVM par Karim PIerre Maalej
MVVM par Karim PIerre Maalej
 
Mvvm basics
Mvvm basicsMvvm basics
Mvvm basics
 
WPF MVVM
WPF MVVMWPF MVVM
WPF MVVM
 
L'architecture MVVM avec KnockoutJS
L'architecture MVVM avec KnockoutJSL'architecture MVVM avec KnockoutJS
L'architecture MVVM avec KnockoutJS
 

Similar to MVVM

MVVM and Prism
MVVM and PrismMVVM and Prism
MVVM and Prism
Bilal Ahmed
 
Architectural Design & Patterns
Architectural Design&PatternsArchitectural Design&Patterns
Architectural Design & Patterns
Inocentshuja Ahmad
 
Mvc pattern and implementation in java fair
Mvc   pattern   and implementation   in   java fairMvc   pattern   and implementation   in   java fair
Mvc pattern and implementation in java fair
Tech_MX
 
Mvvw patterns
Mvvw patternsMvvw patterns
Mvvw patterns
eleksdev
 
Models used in iOS programming, with a focus on MVVM
Models used in iOS programming, with a focus on MVVMModels used in iOS programming, with a focus on MVVM
Models used in iOS programming, with a focus on MVVM
Andrei Popa
 
Ios models
Ios modelsIos models
Ios models
JUDYFLAVIAB
 
Mobile App Architectures & Coding guidelines
Mobile App Architectures & Coding guidelinesMobile App Architectures & Coding guidelines
Mobile App Architectures & Coding guidelines
Qamar Abbas
 
GUI patterns : My understanding
GUI patterns : My understandingGUI patterns : My understanding
GUI patterns : My understanding
Nitin Bhide
 
MVVM presentation
MVVM presentationMVVM presentation
MVVM presentation
Inova LLC
 
Knockout js
Knockout jsKnockout js
Mvc, mvp & mvvm (erp)
Mvc, mvp & mvvm (erp)Mvc, mvp & mvvm (erp)
Mvc, mvp & mvvm (erp)
Ayesha Maqsood
 
Mvc vs mvp vs mvvm a guide on architecture presentation patterns
Mvc vs mvp vs mvvm  a guide on architecture presentation patternsMvc vs mvp vs mvvm  a guide on architecture presentation patterns
Mvc vs mvp vs mvvm a guide on architecture presentation patterns
Concetto Labs
 
Using mvvm inside mvc in domain driven design
Using mvvm inside mvc in domain driven designUsing mvvm inside mvc in domain driven design
Using mvvm inside mvc in domain driven design
yashar Aliabasi
 
реалии использования Mv в i os разработке
реалии использования Mv в i os разработкереалии использования Mv в i os разработке
реалии использования Mv в i os разработке
Provectus
 
MVC
MVCMVC
MVC architecture
MVC architectureMVC architecture
Mvc part 1
Mvc part 1Mvc part 1
Mvc part 1
Gandhi Ghanashyam
 
Portable Class Libraries and MVVM
Portable Class Libraries and MVVMPortable Class Libraries and MVVM
Portable Class Libraries and MVVM
Andreas Kuntner
 
Software Design Patterns
Software Design PatternsSoftware Design Patterns
Software Design Patterns
alkuzaee
 
MVC architecture in software programming for interactive apps
MVC architecture in software programming for interactive appsMVC architecture in software programming for interactive apps
MVC architecture in software programming for interactive apps
KotiTenali
 

Similar to MVVM (20)

MVVM and Prism
MVVM and PrismMVVM and Prism
MVVM and Prism
 
Architectural Design & Patterns
Architectural Design&PatternsArchitectural Design&Patterns
Architectural Design & Patterns
 
Mvc pattern and implementation in java fair
Mvc   pattern   and implementation   in   java fairMvc   pattern   and implementation   in   java fair
Mvc pattern and implementation in java fair
 
Mvvw patterns
Mvvw patternsMvvw patterns
Mvvw patterns
 
Models used in iOS programming, with a focus on MVVM
Models used in iOS programming, with a focus on MVVMModels used in iOS programming, with a focus on MVVM
Models used in iOS programming, with a focus on MVVM
 
Ios models
Ios modelsIos models
Ios models
 
Mobile App Architectures & Coding guidelines
Mobile App Architectures & Coding guidelinesMobile App Architectures & Coding guidelines
Mobile App Architectures & Coding guidelines
 
GUI patterns : My understanding
GUI patterns : My understandingGUI patterns : My understanding
GUI patterns : My understanding
 
MVVM presentation
MVVM presentationMVVM presentation
MVVM presentation
 
Knockout js
Knockout jsKnockout js
Knockout js
 
Mvc, mvp & mvvm (erp)
Mvc, mvp & mvvm (erp)Mvc, mvp & mvvm (erp)
Mvc, mvp & mvvm (erp)
 
Mvc vs mvp vs mvvm a guide on architecture presentation patterns
Mvc vs mvp vs mvvm  a guide on architecture presentation patternsMvc vs mvp vs mvvm  a guide on architecture presentation patterns
Mvc vs mvp vs mvvm a guide on architecture presentation patterns
 
Using mvvm inside mvc in domain driven design
Using mvvm inside mvc in domain driven designUsing mvvm inside mvc in domain driven design
Using mvvm inside mvc in domain driven design
 
реалии использования Mv в i os разработке
реалии использования Mv в i os разработкереалии использования Mv в i os разработке
реалии использования Mv в i os разработке
 
MVC
MVCMVC
MVC
 
MVC architecture
MVC architectureMVC architecture
MVC architecture
 
Mvc part 1
Mvc part 1Mvc part 1
Mvc part 1
 
Portable Class Libraries and MVVM
Portable Class Libraries and MVVMPortable Class Libraries and MVVM
Portable Class Libraries and MVVM
 
Software Design Patterns
Software Design PatternsSoftware Design Patterns
Software Design Patterns
 
MVC architecture in software programming for interactive apps
MVC architecture in software programming for interactive appsMVC architecture in software programming for interactive apps
MVC architecture in software programming for interactive apps
 

Recently uploaded

ALGIT - Assembly Line for Green IT - Numbers, Data, Facts
ALGIT - Assembly Line for Green IT - Numbers, Data, FactsALGIT - Assembly Line for Green IT - Numbers, Data, Facts
ALGIT - Assembly Line for Green IT - Numbers, Data, Facts
Green Software Development
 
Orion Context Broker introduction 20240604
Orion Context Broker introduction 20240604Orion Context Broker introduction 20240604
Orion Context Broker introduction 20240604
Fermin Galan
 
Need for Speed: Removing speed bumps from your Symfony projects ⚡️
Need for Speed: Removing speed bumps from your Symfony projects ⚡️Need for Speed: Removing speed bumps from your Symfony projects ⚡️
Need for Speed: Removing speed bumps from your Symfony projects ⚡️
Łukasz Chruściel
 
Utilocate provides Smarter, Better, Faster, Safer Locate Ticket Management
Utilocate provides Smarter, Better, Faster, Safer Locate Ticket ManagementUtilocate provides Smarter, Better, Faster, Safer Locate Ticket Management
Utilocate provides Smarter, Better, Faster, Safer Locate Ticket Management
Utilocate
 
Webinar On-Demand: Using Flutter for Embedded
Webinar On-Demand: Using Flutter for EmbeddedWebinar On-Demand: Using Flutter for Embedded
Webinar On-Demand: Using Flutter for Embedded
ICS
 
Mobile App Development Company In Noida | Drona Infotech
Mobile App Development Company In Noida | Drona InfotechMobile App Development Company In Noida | Drona Infotech
Mobile App Development Company In Noida | Drona Infotech
Drona Infotech
 
原版定制美国纽约州立大学奥尔巴尼分校毕业证学位证书原版一模一样
原版定制美国纽约州立大学奥尔巴尼分校毕业证学位证书原版一模一样原版定制美国纽约州立大学奥尔巴尼分校毕业证学位证书原版一模一样
原版定制美国纽约州立大学奥尔巴尼分校毕业证学位证书原版一模一样
mz5nrf0n
 
Graspan: A Big Data System for Big Code Analysis
Graspan: A Big Data System for Big Code AnalysisGraspan: A Big Data System for Big Code Analysis
Graspan: A Big Data System for Big Code Analysis
Aftab Hussain
 
GraphSummit Paris - The art of the possible with Graph Technology
GraphSummit Paris - The art of the possible with Graph TechnologyGraphSummit Paris - The art of the possible with Graph Technology
GraphSummit Paris - The art of the possible with Graph Technology
Neo4j
 
E-commerce Development Services- Hornet Dynamics
E-commerce Development Services- Hornet DynamicsE-commerce Development Services- Hornet Dynamics
E-commerce Development Services- Hornet Dynamics
Hornet Dynamics
 
Hand Rolled Applicative User Validation Code Kata
Hand Rolled Applicative User ValidationCode KataHand Rolled Applicative User ValidationCode Kata
Hand Rolled Applicative User Validation Code Kata
Philip Schwarz
 
Using Xen Hypervisor for Functional Safety
Using Xen Hypervisor for Functional SafetyUsing Xen Hypervisor for Functional Safety
Using Xen Hypervisor for Functional Safety
Ayan Halder
 
2024 eCommerceDays Toulouse - Sylius 2.0.pdf
2024 eCommerceDays Toulouse - Sylius 2.0.pdf2024 eCommerceDays Toulouse - Sylius 2.0.pdf
2024 eCommerceDays Toulouse - Sylius 2.0.pdf
Łukasz Chruściel
 
SWEBOK and Education at FUSE Okinawa 2024
SWEBOK and Education at FUSE Okinawa 2024SWEBOK and Education at FUSE Okinawa 2024
SWEBOK and Education at FUSE Okinawa 2024
Hironori Washizaki
 
Fundamentals of Programming and Language Processors
Fundamentals of Programming and Language ProcessorsFundamentals of Programming and Language Processors
Fundamentals of Programming and Language Processors
Rakesh Kumar R
 
Why Mobile App Regression Testing is Critical for Sustained Success_ A Detail...
Why Mobile App Regression Testing is Critical for Sustained Success_ A Detail...Why Mobile App Regression Testing is Critical for Sustained Success_ A Detail...
Why Mobile App Regression Testing is Critical for Sustained Success_ A Detail...
kalichargn70th171
 
AI Fusion Buddy Review: Brand New, Groundbreaking Gemini-Powered AI App
AI Fusion Buddy Review: Brand New, Groundbreaking Gemini-Powered AI AppAI Fusion Buddy Review: Brand New, Groundbreaking Gemini-Powered AI App
AI Fusion Buddy Review: Brand New, Groundbreaking Gemini-Powered AI App
Google
 
Artificia Intellicence and XPath Extension Functions
Artificia Intellicence and XPath Extension FunctionsArtificia Intellicence and XPath Extension Functions
Artificia Intellicence and XPath Extension Functions
Octavian Nadolu
 
Atelier - Innover avec l’IA Générative et les graphes de connaissances
Atelier - Innover avec l’IA Générative et les graphes de connaissancesAtelier - Innover avec l’IA Générative et les graphes de connaissances
Atelier - Innover avec l’IA Générative et les graphes de connaissances
Neo4j
 
GreenCode-A-VSCode-Plugin--Dario-Jurisic
GreenCode-A-VSCode-Plugin--Dario-JurisicGreenCode-A-VSCode-Plugin--Dario-Jurisic
GreenCode-A-VSCode-Plugin--Dario-Jurisic
Green Software Development
 

Recently uploaded (20)

ALGIT - Assembly Line for Green IT - Numbers, Data, Facts
ALGIT - Assembly Line for Green IT - Numbers, Data, FactsALGIT - Assembly Line for Green IT - Numbers, Data, Facts
ALGIT - Assembly Line for Green IT - Numbers, Data, Facts
 
Orion Context Broker introduction 20240604
Orion Context Broker introduction 20240604Orion Context Broker introduction 20240604
Orion Context Broker introduction 20240604
 
Need for Speed: Removing speed bumps from your Symfony projects ⚡️
Need for Speed: Removing speed bumps from your Symfony projects ⚡️Need for Speed: Removing speed bumps from your Symfony projects ⚡️
Need for Speed: Removing speed bumps from your Symfony projects ⚡️
 
Utilocate provides Smarter, Better, Faster, Safer Locate Ticket Management
Utilocate provides Smarter, Better, Faster, Safer Locate Ticket ManagementUtilocate provides Smarter, Better, Faster, Safer Locate Ticket Management
Utilocate provides Smarter, Better, Faster, Safer Locate Ticket Management
 
Webinar On-Demand: Using Flutter for Embedded
Webinar On-Demand: Using Flutter for EmbeddedWebinar On-Demand: Using Flutter for Embedded
Webinar On-Demand: Using Flutter for Embedded
 
Mobile App Development Company In Noida | Drona Infotech
Mobile App Development Company In Noida | Drona InfotechMobile App Development Company In Noida | Drona Infotech
Mobile App Development Company In Noida | Drona Infotech
 
原版定制美国纽约州立大学奥尔巴尼分校毕业证学位证书原版一模一样
原版定制美国纽约州立大学奥尔巴尼分校毕业证学位证书原版一模一样原版定制美国纽约州立大学奥尔巴尼分校毕业证学位证书原版一模一样
原版定制美国纽约州立大学奥尔巴尼分校毕业证学位证书原版一模一样
 
Graspan: A Big Data System for Big Code Analysis
Graspan: A Big Data System for Big Code AnalysisGraspan: A Big Data System for Big Code Analysis
Graspan: A Big Data System for Big Code Analysis
 
GraphSummit Paris - The art of the possible with Graph Technology
GraphSummit Paris - The art of the possible with Graph TechnologyGraphSummit Paris - The art of the possible with Graph Technology
GraphSummit Paris - The art of the possible with Graph Technology
 
E-commerce Development Services- Hornet Dynamics
E-commerce Development Services- Hornet DynamicsE-commerce Development Services- Hornet Dynamics
E-commerce Development Services- Hornet Dynamics
 
Hand Rolled Applicative User Validation Code Kata
Hand Rolled Applicative User ValidationCode KataHand Rolled Applicative User ValidationCode Kata
Hand Rolled Applicative User Validation Code Kata
 
Using Xen Hypervisor for Functional Safety
Using Xen Hypervisor for Functional SafetyUsing Xen Hypervisor for Functional Safety
Using Xen Hypervisor for Functional Safety
 
2024 eCommerceDays Toulouse - Sylius 2.0.pdf
2024 eCommerceDays Toulouse - Sylius 2.0.pdf2024 eCommerceDays Toulouse - Sylius 2.0.pdf
2024 eCommerceDays Toulouse - Sylius 2.0.pdf
 
SWEBOK and Education at FUSE Okinawa 2024
SWEBOK and Education at FUSE Okinawa 2024SWEBOK and Education at FUSE Okinawa 2024
SWEBOK and Education at FUSE Okinawa 2024
 
Fundamentals of Programming and Language Processors
Fundamentals of Programming and Language ProcessorsFundamentals of Programming and Language Processors
Fundamentals of Programming and Language Processors
 
Why Mobile App Regression Testing is Critical for Sustained Success_ A Detail...
Why Mobile App Regression Testing is Critical for Sustained Success_ A Detail...Why Mobile App Regression Testing is Critical for Sustained Success_ A Detail...
Why Mobile App Regression Testing is Critical for Sustained Success_ A Detail...
 
AI Fusion Buddy Review: Brand New, Groundbreaking Gemini-Powered AI App
AI Fusion Buddy Review: Brand New, Groundbreaking Gemini-Powered AI AppAI Fusion Buddy Review: Brand New, Groundbreaking Gemini-Powered AI App
AI Fusion Buddy Review: Brand New, Groundbreaking Gemini-Powered AI App
 
Artificia Intellicence and XPath Extension Functions
Artificia Intellicence and XPath Extension FunctionsArtificia Intellicence and XPath Extension Functions
Artificia Intellicence and XPath Extension Functions
 
Atelier - Innover avec l’IA Générative et les graphes de connaissances
Atelier - Innover avec l’IA Générative et les graphes de connaissancesAtelier - Innover avec l’IA Générative et les graphes de connaissances
Atelier - Innover avec l’IA Générative et les graphes de connaissances
 
GreenCode-A-VSCode-Plugin--Dario-Jurisic
GreenCode-A-VSCode-Plugin--Dario-JurisicGreenCode-A-VSCode-Plugin--Dario-Jurisic
GreenCode-A-VSCode-Plugin--Dario-Jurisic
 

MVVM

  • 2. Agenda • What is MVVM? • WPF concepts • MVVM vs/and MVC • Advantages • Disadvantages • Demo • References
  • 3. What is MVVM? • Splits the user interfaces in Model, View, View Model • Model : data from database • View: visual representation of the data, the part that the user interacts with • View Model: the glue between the View and the Model. Controls the View interaction with the application and wraps the data from Model for the View
  • 4. What is MVVM? Model not aware of the View Model and View Model not aware of the View.
  • 7. WPF Concepts • Bindings: connects 2 properties on 2 different objects so that if one of them changes the other changes too • Data Templates: converts non-visual data (View Model) into its visual representation (View) • Commands: passes the events from View to View Model
  • 9. Advantages • abstraction of the View (less code-behind) • View Model is easier to unit test • re-use • flexibility and customization : different Views can be used with the same View Model -> different visual representation of the same functionality depending on what different customers want • separation of UI design and development
  • 10. Disadvantages • can be overkill for simple UI • the View Model can be hard to design (if you want to the right amount of generality) • harder to debug • the Bindings can be heavier than the objects being bound
  • 11. DEMO
  • 13. References • http://blogs.msdn.com/b/johngossman/archive/2005/10/08/478683.aspx • https://russelleast.wordpress.com/2008/08/09/overview-of-the-modelview-viewmodel-mvvm-pattern-and- data-binding/ • http://joel.inpointform.net/software-development/mvvm-vs-mvp-vs-mvc-the-differences-explained/ • http://www.codeproject.com/Articles/100175/Model-View-ViewModel-MVVM-Explained • http://www.codeproject.com/Articles/228214/Understanding-Basics-of-UI-Design-Pattern-MVC-MVP • http://www.codeproject.com/Articles/278901/MVVM-Pattern-Made-Simple • http://blogs.msdn.com/b/johngossman/archive/2006/03/04/543695.aspx • http://rachelappel.com/comparing-the-mvc-and-mvvm-patterns-along-with-their-respective-viewmodels • http://geekswithblogs.net/dlussier/archive/2009/11/21/136454.aspx