MVVM: полное понимание

 Методика написания программы используя подход «ModelFirst».

• 1. Разработать модель программы.
• 2. Нарисовать интерфейс программы.
• 3. Соединить интерфейс и модель прослойкой VM.

Итак, наше задание — написать программу сложения двух чисел с выводом результата. 

Выполняем первый пункт: пишем модель. 

 Модель, в принципе, может не хранить никакого состояния. 

Т.е. она может вполне быть реализована статическим методом статического класса.

 Примерно так:

 static class MathFuncs {
    public static int GetSumOf(int a, int b) => a + b;
  }

Следующий шаг — (см. методику «ModelFirst») — создать View или, проще — нарисовать интерфейс.

Это тоже часть, которая может содержать творчество. Но, опять же, не стоить с ним перебарщивать. Пользователь не должен быть шокирован неожиданностями интерфейса. Интерфейс должен быть интуитивен. 

Наша View будет содержать три текстовых поля, которые можно снабдить лейблами: число номер один, число номер два, сумма.

Заключительный шаг — соединение View и модели через VM. 

VM — это такое место, которое вообще не должно содержать творческого элемента.

Т.е. эта часть паттерна железно обуславливается View и не должна содержать в себе НИКАКОЙ «бизнес логики». 

Что значит обусловленность от View? Это значит, что если у нас во View есть три текстовых поля, или три места, которые должны вводить/выводить данные — следовательно в VM (своего рода подложке) должны быть минимум три свойства, которые эти данные принимают/предоставляют.

Следовательно два свойства принимают из View число номер один и два, а третье свойство — вызывает нашу модель для выполнения бизнес-логики нашей программы.

 VM ни в коем случае не выполняет сложение чисел самостоятельно, оно для этого действия только вызывает модель! 

В этом и состоит функция VM — соединять View (которое тоже ничем иным, кроме как приема ввода от пользователя и предоставления ему вывода не занимается) и Модель, в которой происходит все вычисление. Если нарисовать картинку нашей задачки, то получиться нечто такое:


Изображение 3: Схема Примера №1

Зеленое — это View, три зеленые точки в которой — это наши три текстовые поля. Синее — это VM, к которой эти три зеленых точки железно прибиты (прибиндены), ну а красное облачко — это модель, которая занимается вычислением.