Использование классов ViewModel
На текущий момент наша программа может отображать информацию о клиенте, но не позволяет редактировать эту информацию. Пользователь может изменить текст в полях страницы, но изменения не будут сохраняться в программе.
Чтобы внесенные на странице изменения обновляли данные в списке клиентов, можно использовать привязку данных. При этом, привязка текста в элементе TextBox должна быть двусторонней, чтобы при изменении данных на экране приложения автоматически обновлялось связанное с элементом свойство:
После этого можно добавить код к классу Customer классу для управления связанными событиями. Этот код при изменении имени клиента должен изменяться текст на экране, и если текст элемента TextBox изменится, то связанное с элементом также должно изменяться автоматически. Но можно сделать это немного иначе, использовав модель, известную под названием Model—View—ViewModel.
-
Создание класса ViewModel
Можно добавить привязку данных с классом Customer, но есть некоторые причины, почему это не является хорошей идеей. Существует правило проектирования программного обеспечения: обычно класс должен выполнять одно действие, и только одно. Класс Customer должен хранить данные о клиентах, но не должен участвовать в процессе редактирования. При хранении или передаче данных о клиентах мы не должны создавать методы, которые касаются редактирования данных. При передаче объекта, представляющего клиента, на другое устройство или при осуществлении привязки данных любое дополнительное свойство или метод будет лишней тратой пространства, так как не будет использоваться в этом контексте.
Возможность преобразования и проверки допустимости данных. В идеале, при вводе данных пользователем всегда должна осуществляться проверка соответствия вводимых данных определенным правилам. Например, должно соблюдаться правило: "Имя должно содержать только буквы и пробелы". Можно поместить эти правила в класс Customer, но будет намного проще указать их непосредственно в процессе ввода данных, так как они должны использоваться только при вводе данных. Также полезна возможность выполнять преобразование некоторых входных значений, например даты и времени, из текстового формата, в котором они вводятся и выводятся, в формат, в котором значения хранятся.
Возможность отмены действия. Практически всегда при проектировании формы для редактирования каких-либо значений рекомендуется предусмотреть возможность отмены сделанных пользователем, но еще не сохраненных изменений. Обычно в таких формах присутствуют кнопки сохранить и отмена. При использовании привязки данных это может оказаться проблемой, поскольку в этом случае объект данных сразу изменяется. Чтобы отследить изменения, внесенные пользователем, необходимо создать копию данных при открытии формы, и при отмене изменений использовать ее, что очень неудобно и требует создания дополнительного кода.
Создание класса ViewModel. Можно избежать этих проблем, создав класс ViewModel. Этот класс предназначен для представления данных и связывания с компонентами формы и также может выполнять необходимые проверки допустимости данных.
Создадим класс ViewModel для представления действий, которые нужно выполнить в пользовательском интерфейсе. Этот класс соединяет пользовательский интерфейс с объектами данных, содержит свойства, которые будут использоваться в пользовательском интерфейсе:
public class CustomerView : INotifyPropertyChanged
{
private string name;
public string Name
{
get
{
return name;
}
set
{
name = value;
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs("name"));
}
}
}
// свойство Address создается таким же образом
private int id;
public int ID
{
get
{
return id;
}
}
public event PropertyChangedEventHandler PropertyChanged;
public void Load(Customer cust)
{
Name = cust.Name;
Address = cust.Address;
id = cust.ID;
}
public void Save(Customer cust)
{
cust.Name = Name;
cust.Address = Address;
}
}
Этот класс генерирует события при изменении свойств в программе, и элементы Silverlight могут устанавливать новые значения свойств в классе при их изменении пользователем. Обратите внимание, что свойство ID доступно только для чтения, и пользователь не может изменить его значение. Это позволяет обеспечить уникальность идентификатора клиента.
Работа с данными в классе ViewModel. Класс CustomerView также содержит методы Load и Save, предназначенные для взаимодействия программы с содержимым класса ViewModel. Следующий код выполняется перед началом редактирования информации о клиенте:
// создание экземпляра класса ViewModel для страницы редактирования
CustomerView view = new CustomerView();
protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
{
// получить ссылку на страницу, содержащую информацию об активном клиенте
App thisApp = Application.Current as App;
// загрузить объект с информацией об активном клиенте в класс ViewModel
view.Load(thisApp.ActiveCustomer);
// установить контекст данных для отображения
customerDisplayGrid.DataContext = view;
}
Когда программа переходит на страницу для редактирования информации о клиенте, Silverlight вызывает метод OnNavigatedTo для настройки страницы. Этот метод получает информацию о выбранном клиенте и загружает ее в экземпляр класса CustomerView.
Когда пользователь нажимает кнопку сохранить, программа должна выгрузить содержимое класса ViewModel в редактируемое свойство Customer:
private void saveButton_Click(object sender, RoutedEventArgs e)
{
// получить ссылку на страницу, содержащую информацию об активном клиенте
App thisApp = Application.Current as App;
// скопировать данные из класса ViewModel в свойство ActiveCustomer
view.Save(thisApp.ActiveCustomer);
// вернуться на предыдущую страницу
NavigationService.GoBack();
}
-
Навигация по страницам с использованием метода GoBack
Класс NavigationService содержит метод GoBack, который переносит пользователя к предыдущей странице. Это эффективнее, чем использование URI, потому что при этом страница не обновляется. Если перейти на страницу, используя метод Navigate класса NavigationService, будет создана новая страница, и она будет создаваться каждый раз при переходе на нее. Это может замедлить работу приложения и привести к созданию и освобождению большого количества элементов Silverlight. Кроме того, неудобно при каждом переходе на страницу со списком прокручивать ее вниз, поскольку в этом случае при переходе на страницу будет отображаться начало списка.
Однако, использование метода GoBack для перехода к предыдущей странице приводит к возникновению некоторых проблем. Трудность состоит в том, что предыдущая страница не будет содержать изменения данных, которые внесет пользователь. Например, пользователь выполняет следующие действия:
Выбор клиента из списка.
Изменение имени клиента.
Нажатие кнопки Сохранить для выполнения изменений.
Возврат к предыдущей странице.
После выполнения этих действий в списке будут содержаться первоначальные значения без учета сделанных пользователем изменений. Проблема состоит в том, что элемент ListBox не знает, что содержимое одной из записей в списке изменилось, поскольку при выводе списка на экран создается его копия, и при изменении данных эта копия обновляться не будет. Решение этой проблемы основано на использовании наблюдаемых коллекций ObservableCollection.
Класс ObservableCollection используется для хранения коллекции элементов и предоставляет поддержку уведомлений так, чтобы при изменении коллекции элемент ListBox можно было связать с событием изменения. Для создания наблюдаемой коллекции можно использовать имеющийся список:
ObservableCollection observableCustomers;
private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
{
// получить ссылку на страницу, содержащую список клиентов
App thisApp = Application.Current as App;
// создать наблюдаемую коллекцию этих клиентов
observableCustomers = new ObservableCollection(
thisApp.ActiveCustomerList.CustomerList);
// отображение элементов наблюдаемой коллекции
customerList.ItemsSource = observableCustomers;
}
Этот код выполняется при запуске главной страницы приложения. Он создает новый список observableCustomers на основе имеющегося списка клиентов и устанавливает этот список в качестве источника данных элемента customerList. Теперь, при изменении значения элементов в списке эти изменения будут отображаться на экране.
Однако, если пользователь обновит имя клиента, это изменение не будет отражено на экране, потому что ObservableCollection реагирует на изменение содержимого списка, но не на изменение данных в элементе списка. Это является очень серьезным недостатком, приводящим к неправильной работе программы.
Чтобы исправить эту ошибку, нужно как-то внести изменения в список, чтобы он обновлялся на экране. Один из способов вызвать обновление заключается в том, чтобы удалить элемент из списка и снова его добавить. Изменения содержимого наблюдаемой коллекции генерируют события, которые обрабатывает элемент ListBox, который выводит список на экран.
protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
{
// получить ссылку на страницу, содержащую список клиентов
App thisApp = Application.Current as App;
if (thisApp.ActiveCustomer != null)
{
// найти нужного клиента в списке
int pos = observableCustomers.IndexOf(thisApp.ActiveCustomer);
// удалить клиента
observableCustomers.RemoveAt(pos);
// вернуть клиента назад
observableCustomers.Insert(pos, thisApp.ActiveCustomer);
}
}
Этот код выполняется, когда пользователь переходит назад к главной странице. Если выбран какой-нибудь клиент, метод удаляет этого клиента из списка и затем добавляет его на то же самое место. Это вызывает изменение списка, и пользователь будет видеть сделанные изменения. При обновлении всего одного элемента обновление будет выполняться довольно быстро. Это особенно важно, если список содержит несколько тысяч элементов.
При использовании класса ViewModel для редактирования информации о клиенте мы создавали методы для загрузки и сохранения информации, которые заносили информацию о клиенте в класс CustomerView и затем возвращали обновленные значения. При использовании класса ObservableCollection необходимо сделать что-то похожее. К счастью, существует много способов получения списка данных из класса ObservableCollection. Например, можно использовать расширяющий метод ToList:
thisApp.ActiveCustomerList.CustomerList = observableCustomers.ToList();
Использование наблюдаемых коллекций не приводят к повышению расхода памяти, поскольку содержат набор ссылок на уже существующие объекты. Соответственно, требуется лишь небольшой объем памяти для хранения дополнительных ссылок на объекты. Однако наблюдаемые коллекции не имеет смысла использовать, если программа только выводит список на экран, но не изменяет его.
-
Краткие итоги
Программы могут изменять значения свойств элементов Silverlight для управления отображением элементов на экране. К числу свойств относятся положение элемента на экране и его цвет.
Большинство свойств элементов удобнее задавать, редактируя напрямую XAML-код. XAML-описание элемента имеет определенную структуру, в которой одни свойства могут вкладываться в другие.
В элементе TextBox есть набор свойств, которые задают тип клавиатуры, которая будет использоваться для ввода данных. Можно использовать для ввода специальную клавиатуру для ввода чисел вместо клавиатуры для ввода произвольного текста.
Windows Phone может выводить на экран окно с сообщением для пользователя. Текст сообщения может состоять из нескольких строк. Сообщения могут также использоваться для подтверждения или отмены действий пользователя.
Ресурсы могут быть добавлены в приложение для Windows Phone как часть содержимого или как внедренные ресурсы. Элемент содержимого копируется в каталог приложения в отдельный файл, который может использоваться программой. Внедренный ресурс встраивается в файл сборки приложения. Элементы содержимого не замедляют загрузку сборки, но могут медленнее загружаться во время работы программы. Внедренные ресурсы загружаются быстрее, но увеличивают размер сборки программы.
Элементы Silverlight могут генерировать события в ответ на действия пользователя. Например, событие TextChanged элемента TextBox происходит при изменении текста элемента.
Silverlight предоставляет привязку данных, с помощью которой свойства программного объекта могут быть соединены со свойствами визуального элемента Silverlight. Привязка может быть однонаправленной, когда визуальный элемент используется только для вывода значения объекта программы, или двунаправленной, когда изменение свойства визуального элемента приводит к обновлению связанного свойства класса.
Можно связать коллекцию элементов с элементом ListBox для отображения списка элементов. Шаблон данных используется для описания того, как отдельные свойства каждого элемента должны выводиться на экран.
Приложения Silverlight могут состоять из нескольких страниц. Навигация по страницам выполняется в классе Navigate, который использует URI страницы. Простые строковые значения можно передавать между страницами, разместив их в строке запроса, присоединенной к URI.
Страницы могут получать события при перемещении к ним и от них. Событие OnNavigatedFrom предоставляет возможность отмены перехода на другую страницу, если нужно чтобы пользователь подтвердил переход.
Большие объекты данных могут совместно использовать несколько страниц приложения с помощью класса App, который является частью приложения Windows Phone. Любая страница приложения Silverlight может получить ссылку на объект приложения, который является частью этого приложения.
Программисты могут создать классы ViewModel, которые связывают редактируемые данные с элементами на странице Silverlight.
Механизм ObservableCollection позволяет отразить на экране изменения в коллекции элементов.
|
