В руководстве по Prism можно найти небольшое упоминание о том, как обрабатывать запрос на взаимодействие с пользователем с помощью класса InteractionRequest. Напомню, о чём там шла речь:
Использование объектов запроса на взаимодействие
Один из подходов к осуществлению взаимодействия с пользователем при использовании шаблона MVVM — позволить модели представления посылать запрос на взаимодействие непосредственно в представление. Это можно осуществить с помощью объекта запроса взаимодействия (interaction request), сопряжённого с поведением в представлении. Объект запроса содержит детали запроса на взаимодействие, а также делегат обратного вызова, вызываемый при закрытии диалога. Также, данный объект содержит событие, сообщающее о начале взаимодействия. Представление подписывается на это событие для получения команды начала взаимодействия с пользователем. Представление обычно содержит в себе внешний облик данного взаимодействия и поведение (behavior), которое связано с объектом запроса, предоставленным моделью представления.
Данных подход предоставляет простой, но довольно гибкий механизм, сохраняющий разделение ответственности между моделью представления и представлением. Это позволяет модели представления инкапсулировать логику взаимодействия, в то время, как представление содержит только визуальные аспекты. Логика взаимодействия, располагающаяся в модели представления и может быть легко протестирована, а дизайнеры пользовательского интерфейса могут полностью сосредоточиться на внешнем виде взаимодействия.
Подход на основе запроса взаимодействия хорошо согласуется с шаблонном MVVM и позволяет представлению отображать изменения состояния модели представления. Также, используя двустороннее связывание данных, можно добиться передачи данных от пользователя в модель представления и обратно. Всё это очень похоже на объект DelegateCommand и поведение InvokeCommandBehavior.
Библиотека Prism прямо поддерживает данный шаблон при помощи интерфейса IInteractionRequest и класса InteractionRequest<T>. Интерфейс IInteractionRequest определяет событие начала взаимодействия. Поведение в представлении связывается с этим интерфейсом и подписывается на данное событие. Класс InteractionRequest<T> реализует интерфейс IInteractionRequest и определяет два метода Raise для инициации взаимодействия и задания контекста запроса, а также, при желании, делегат обратного вызова.
Инициация взаимодействия из модели представления
Класс InteractionRequest<T> координирует взаимодействие модели представления с представления во время запроса взаимодействия. Метод Raise позволяет модели представления инициировать взаимодействие и определить контекстный объект (типа T) и делегат обратного вызова, который вызывается при окончании взаимодействия. Объект контекста позволяет модели представления передавать данные и состояние в представление, для использования во время взаимодействия с пользователем. Если определён делегат обратного вызова, то объект контекста будет передан обратно в модель представления, во время его вызова. Это позволяет передать обратно любые изменения, произошедшие во время взаимодействия.
public interface IInteractionRequest
{
event EventHandler<InteractionRequestedEventArgs> Raised;
}
public class InteractionRequest<T> : IInteractionRequest
{
public event EventHandler<InteractionRequestedEventArgs> Raised;
public void Raise(T context, Action<T> callback)
{
var handler = this.Raised;
if (handler != null)
{
handler(
this,
new InteractionRequestedEventArgs(
context,
() => callback(context)));
}
}
}Prism предоставляет предопределённые классы контекста, поддерживающие распространённые сценарии взаимодействия. Класс Notification является базовым классом для всех объектов контекста. Он используется, когда запрос взаимодействия должен сообщить пользователю о каком-либо событии, произошедшем в приложении. Он предоставляет два свойства — Title и Content. Обычно, это сообщение односторонние, то есть, предполагается, что пользователь не будет менять значения контекста во время взаимодействия.
Класс Confirmation наследуется от класса Notification и добавляет третье свойство — Confirmed — используемое для того, чтобы определить, подтвердил пользователь операцию, или отменил её. Класс Confirmation используется для осуществления взаимодействия в стиле MessageBox, в котором необходимо получить от пользователя ответ да/нет. Можно определить свой собственный класс контекста, наследуемый от класса Notification, для хранения необходимых для взаимодействия данных и состояний.
Для использования класса InteractionRequest<T>, модель представления должна создать экземпляр данного класса и задать свойство только для чтения, чтобы позволить представления создать привязку к данному свойству.
public IInteractionRequest ConfirmCancelInteractionRequest
{
get
{
return this.confirmCancelInteractionRequest;
}
}
this.confirmCancelInteractionRequest.Raise(
new Confirmation("Are you sure you wish to cancel?"),
confirmation =>
{
if (confirmation.Confirmed)
{
this.NavigateToQuestionnaireList();
}
});
}Использование поведения для задания визуального облика взаимодействия
Так как объект запроса взаимодействия определяет только логику взаимодействия, то всё остальное должно быть задано в представлении. Для этого часто используются поведения, что позволяет дизайнеру выбрать необходимое поведения и связать его с объектом запроса взаимодействия в модели представления.
Представление должно реагировать на событие начала взаимодействия и предоставлять подходящий для него облик. Microsoft Expression Blend Behaviors Framework поддерживает концепцию триггеров и действий. Триггеры используются для инициации действий, всякий раз, когда возникает соответствующее событие.
Стандартный EventTrigger, предоставляемый Expression Blend, может быть использован для отслеживания событий начала взаимодействия, через связывание его с объектом запроса взаимодействия, определённым в модели представления. Однако, библиотека Prism содержит собственный EventTrigger, названный InteractionRequestTrigger, который автоматически подключается к подходящему событию Raised интерфейса IInteractionRequest.
После возникновения события, InteractionRequestTrigger запускает заданные в нём действия. Для Silverlight, библиотека Prism предоставляет класс PopupChildWindowAction, который отображает пользователю всплывающее окно. После отображения дочернего окна, его DataContext устанавливается в параметр контекста, заданный в объекте запроса. Используя свойство ContentTemplate, можно определить шаблон данных, используемый для отображения переданного контекста. Заголовок всплывающего окна связан со свойством Title объекта контекста.
Следующий пример показывает, как, используя InteractionRequestTrigger и PopupChildWindowAction, отобразить всплывающее окно, для получения от пользователя подтверждения.
<i:Interaction.Triggers>
<prism:InteractionRequestTrigger
SourceObject="{Binding ConfirmCancelInteractionRequest}">
<prism:PopupChildWindowAction
ContentTemplate="{StaticResource ConfirmWindowTemplate}"/>
</prism:InteractionRequestTrigger>
</i:Interaction.Triggers>
<UserControl.Resources>
<DataTemplate x:Key="ConfirmWindowTemplate">
<Grid MinWidth="250" MinHeight="100">
<TextBlock TextWrapping="Wrap" Grid.Row="0" Text="{Binding}"/>
</Grid>
</DataTemplate>
</UserControl.Resources>Когда пользователь взаимодействует со всплывающим окном, объект контекста обновляется в соответствии с привязками, определенными во всплывающем окне, или в шаблоне данных, используемом для отображения содержимого свойства Content объекта контекста. После закрытия всплывающего окна, объект контекста передаётся обратно в модель представления через метод обратного вызова, сохраняя все изменённые пользователем данные. В данном примере, свойство Confirmed устанавливается в true, если пользователь нажимает кнопку OK.
Для поддержки других механизмов взаимодействия, могут быть определены другие триггеры и действия. Реализация классов InteractionRequestTrigger и PopupChildWindowAction, может быть использована, как база для написания своих триггеров и действий.
Создание собственной реализации всплывающего окна
По умолчанию, библиотека Prism не предоставляет какого-либо класса действия для WPF, который показывал бы всплывающее окно, или что-то подобное. Это упущение я и постараюсь далее исправить.
Простая реализация в виде дочернего окна
Для начала создадим заготовку главного окна с моделью представления.
<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
xmlns:localInter="clr-namespace:PrismNotifications.Notifications"
xmlns:inter="clr-namespace:Microsoft.Practices.Prism.Interactivity.InteractionRequest;assembly=Microsoft.Practices.Prism.Interactivity"
xmlns:local="clr-namespace:PrismNotifications" x:Class="PrismNotifications.MainWindow" Title="MainWindow" Height="350"
Width="525">
<Window.DataContext>
<local:MainWindowsViewModel />
</Window.DataContext>
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<i:Interaction.Triggers>
<inter:InteractionRequestTrigger SourceObject="{Binding ShowNotificationInteractionRequest}">
<localInter:ShowChildWindowsAction>
<DataTemplate DataType="{x:Type inter:Notification}">
<Grid Width="200" Height="150">
<TextBlock Text="{Binding Content}" />
</Grid>
</DataTemplate>
</localInter:ShowChildWindowsAction>
</inter:InteractionRequestTrigger>
</i:Interaction.Triggers>
<StackPanel HorizontalAlignment="Right" Margin="10" Grid.Row="1">
<Button Command="{Binding ShowNotificationCommand}">
Show notificaiton windows
</Button>
</StackPanel>
</Grid>
</Window>Модель представления создаётся непосредственно в XAML. Она содержит свойство с запросом на взаимодействие и свойство команды, которая инициирует этот запрос.
using Microsoft.Practices.Prism.Commands;
using Microsoft.Practices.Prism.Interactivity.InteractionRequest;
using Microsoft.Practices.Prism.ViewModel;
namespace PrismNotifications {
/// <summary>
/// Модель представления для главного окна.
/// </summary>
public class MainWindowsViewModel : NotificationObject {
public MainWindowsViewModel() {
ShowNotificationInteractionRequest = new InteractionRequest<Notification>();
ShowNotificationCommand = new DelegateCommand(
() => ShowNotificationInteractionRequest.Raise(
new Notification {
Title = "Заголовок",
Content = "Сообщение."
}));
}
/// <summary>
/// Запрос взаимодействия для показа сообщения.
/// </summary>
public InteractionRequest<Notification> ShowNotificationInteractionRequest { get; private set; }
/// <summary>
/// Команда, инициирующая запрос <see cref="ShowNotificationInteractionRequest"/>.
/// </summary>
public DelegateCommand ShowNotificationCommand { get; private set; }
}
}Как видно, при нажатии кнопки, вызывается метод Raise, в который передаётся экземпляр класса Notification, с заданными свойствами Title и Content. В элементе Grid располагается триггер InteractionRequestTrigger, связанный со свойством ShowNotificationInteractionRequest, которое и представляет собой запрос взаимодействия. Внутрь триггера помещено действие ShowChildWindowsAction, в котором задан шаблон данных.
using System.Windows;
using System.Windows.Interactivity;
using System.Windows.Markup;
using Microsoft.Practices.Prism.Interactivity.InteractionRequest;
namespace PrismNotifications.Notifications {
/// <summary>
/// Действие по показу дочернего окна.
/// </summary>
[ContentProperty("ContentDataTemplate")]
public class ShowChildWindowsAction : TriggerAction<UIElement> {
/// <summary>
/// Шаблон, для отображения контента.
/// </summary>
public DataTemplate ContentDataTemplate { get; set; }
protected override void Invoke(object parameter) {
var args = (InteractionRequestedEventArgs) parameter;
}
}
}Данный класс наследуется от класса TriggerAction<T>, где T — тип объекта, к которому присоединяется триггер. С помощью атрибута ContentPropertyAttribute указываем, что свойство ContentDataTemplate будет являться свойством содержимого. При возникновении запроса взаимодействия, будет вызван метод Invoke, в который будет передан параметр типа InteractionRequestedEventArgs, содержащий контекст и делегат обратного вызова. Сделаем так, чтобы при вызове этого метода, отображалось дочернее окно с заголовком, определённом в свойстве args.Context.Title и содержимым, заданным в свойстве args.Context. Также, необходимо не забыть вызвать метод обратного вызова (если он задан), при закрытии окна.
protected override void Invoke(object parameter) {
var args = (InteractionRequestedEventArgs) parameter;
// Получаем ссылку на окно, содержащее объект, в который помещён триггер.
Window parentWindows = Window.GetWindow(AssociatedObject);
// Создаём дочернее окно, устанавливаем его содержиомое и его шаблон.
var childWindows =
new Window {
Owner = parentWindows,
WindowStyle = WindowStyle.ToolWindow,
SizeToContent = SizeToContent.WidthAndHeight,
WindowStartupLocation = WindowStartupLocation.CenterOwner,
Title = args.Context.Title,
Content = args.Context,
ContentTemplate = ContentDataTemplate,
};
// Обрабатываем делегат обратного вызова при закрытии окна.
childWindows.Closed +=
(sender, eventArgs) => {
if (args.Callback != null) {
args.Callback();
}
};
// Показываем диалог.
childWindows.ShowDialog();
}В результате получим такое всплывающее окошко:
Использование класса Popup.
В библиотеке примитивов WPF, есть замечательный класс Popup, который представляет собой всплывающее окно с содержимым. Действовать будем так: при присоединении действия, будем создавать popup и хранить его в приватном поле в закрытом состоянии. Данный popup необходимо добавить в корневой элемент главного окна. Для этого проверим, является ли корневым элементом класс, производный от Panel, и, если да, добавим popup в коллекцию его дочерних элементов. Если нет, то создадим новый Grid и заменим корневой элемент им, добавив существующий в его коллекцию элементов. При открытии popup будем блокировать содержимое окна, а при закрытии — разблокировать и вызывать делегат обратного вызова. При перемещении окна, popup по умолчанию не перемещается вместе с ним, поэтому необходимо вручную заставлять его обновлять своё расположение. При создании popup, можно задать его свойство PopupAnimation = PopupAnimation.Fade и AllowsTransparency = true, для плавного его появления и исчезновения.
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Controls.Primitives;
using System.Windows.Interactivity;
using System.Windows.Markup;
using Microsoft.Practices.Prism.Interactivity.InteractionRequest;
namespace PrismNotifications.Notifications {
/// <summary>
/// Действие по показу всплывающего окна.
/// </summary>
[ContentProperty("ContentDataTemplate")]
public class ShowPopupAction : TriggerAction<UIElement> {
private Action _callback;
private Popup _popup;
private ContentControl _popupContent;
private Panel _root;
/// <summary>
/// Шаблон, для отображения контента.
/// </summary>
public DataTemplate ContentDataTemplate { get; set; }
protected override void OnAttached() {
// Получаем корневое окно.
Window window = Window.GetWindow(AssociatedObject);
if (window == null) {
throw new NullReferenceException("Windows is null.");
}
// Проверяем, является ли корневым элементом Grid,
// если нет - создаём новый.
_root = window.Content as Panel;
if (_root == null) {
_root = new Grid();
_root.Children.Add((UIElement) window.Content);
window.Content = _root;
}
// Контент всплывающего окна.
_popupContent =
new ContentControl
{
ContentTemplate = ContentDataTemplate,
};
// Создаём всплывающее окно, задаём его визуальные свойства и контент.
_popup =
new Popup
{
StaysOpen = true,
PopupAnimation = PopupAnimation.Fade,
AllowsTransparency = true,
Placement = PlacementMode.Center,
Child = _popupContent,
};
_popup.Closed += PopupOnClosed;
window.LocationChanged += (sender, a) => UpdatePopupLocation();
_root.Children.Add(_popup);
}
private void UpdatePopupLocation() {
// При смене положения главного окна,
// необходимо обновить положение всплывающего окна.
// Делаем это с помощью такого нехитрого трюка.
if (!_popup.IsOpen) {
return;
}
const double delta = 0.1;
_popup.HorizontalOffset += delta;
_popup.HorizontalOffset -= delta;
}
private void PopupOnClosed(object sender, EventArgs eventArgs) {
// Вызываем делегат обратного вызова и снимаем блокировку с главного окна.
if (_callback != null) {
_callback();
}
_root.IsEnabled = true;
}
protected override void Invoke(object parameter) {
var args = (InteractionRequestedEventArgs) parameter;
_callback = args.Callback;
_popupContent.Content = args.Context;
// Блокируем содержимое главного окна и показываем всплывающее окно.
_root.IsEnabled = false;
_popup.IsOpen = true;
}
}
}В MainWindows изменим объявление действия:
<i:Interaction.Triggers>
<inter:InteractionRequestTrigger SourceObject="{Binding ShowNotificationInteractionRequest}">
<localInter:ShowPopupAction ContentDataTemplate="{StaticResource popupTemplate}" />
</inter:InteractionRequestTrigger>
</i:Interaction.Triggers>Теперь шаблон сообщения будет браться из ресурсов. Так как действие присоединяется до того, как инициализируется библиотека ресурсов главного окна, объявление шаблона необходимо расположить в App.xaml.
<Application xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:localInter="clr-namespace:Microsoft.Practices.Prism.Interactivity.InteractionRequest;assembly=Microsoft.Practices.Prism.Interactivity"
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" x:Class="PrismNotifications.App"
StartupUri="MainWindow.xaml">
<Application.Resources>
<DataTemplate DataType="{x:Type localInter:Notification}" x:Key="popupTemplate">
<Border Width="200" Height="150" Background="{StaticResource {x:Static SystemColors.WindowBrushKey}}"
BorderBrush="{StaticResource {x:Static SystemColors.WindowFrameBrushKey}}" BorderThickness="1" CornerRadius="2"
Padding="5">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<TextBlock Text="{Binding Content}" HorizontalAlignment="Center" VerticalAlignment="Center"
Grid.Row="1" />
<Button Content="Close" HorizontalAlignment="Right" Grid.Row="2">
<i:Interaction.Triggers>
<i:EventTrigger EventName="Click">
<ei:ChangePropertyAction
TargetObject="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Popup}}" PropertyName="IsOpen"
Value="False" />
</i:EventTrigger>
</i:Interaction.Triggers>
</Button>
<TextBlock HorizontalAlignment="Center" Text="{Binding Title}" />
</Grid>
</Border>
</DataTemplate>
</Application.Resources>
</Application>Для закрытия сообщения, необходимо найти в дереве элементов Popup и изменить его свойство IsOpen в false. Это можно сделать с помощью триггеров и действий из Expression Framework. В итоге получаем всплывающее окно следующего вида:
Вот таким нехитрым способом можно организовать взаимодействие с пользователем, при полном разделении ответственности между представлением и моделью представления.
Архив с проектом.
Ссылка на пост в моём блоге.
Автор: Unrul
