MVVM-C (Model View ViewModel Controller)

MVVM-C (Model View ViewModel Controller)

1 min read

Definition

MVVM-C extends MVVM by adding a Coordinator (also called Router) to handle navigation and screen flow, separating navigation logic from the ViewModel.

flowchart LR
    subgraph View
        V[View]
    end
    subgraph ViewModel
        VM[ViewModel]
    end
    subgraph Model
        M[Model]
    end
    subgraph Coordinator
        C[Coordinator]
    end
    
    V <-.->|data binding| VM
    VM <-->|data| M
    VM <-->|navigation| C
    C -->|creates| V

Flow

  1. Coordinator manages navigation between screens
  2. View binds to ViewModel for data and commands
  3. ViewModel handles business logic and delegates navigation to Coordinator
  4. Navigation flow is decoupled from ViewModels

Coordinator Responsibilities

The Coordinator (Router) handles navigation:

  • Manages screen transitions and navigation stack
  • Creates and configures new Views/ViewModels
  • Handles deep linking and URL routing
  • Coordinates between multiple ViewModels
  • Keeps navigation logic separate from ViewModels

Key Characteristics

  • All MVVM benefits: Data binding, testability, separation of concerns
  • Clean Navigation: Navigation logic extracted from ViewModels
  • Composable: Screens can be combined and rearranged easily
  • Deep Link Support: Coordinators can handle external navigation requests

Common Use Cases

  • iOS apps using MVVM with Coordinators
  • Android apps with Navigation Component
  • React/React Native with navigation libraries
  • Desktop applications with complex navigation flows

Components

Recent Notes

Graph View

Related notes