Пошаговое руководство. Привязка элементов управления WPF к службе данных WCF

Статья
06/10/2015

В этом пошаговом руководстве вы создадите приложение WPF, содержащее элементы управления с привязкой к данным. Эти элементы управления привязаны к записям клиентов, инкапсулированным в Служба данных WCF. Вы также добавите кнопки, позволяющие клиентам просматривать и обновлять записи.

В данном пошаговом руководстве рассмотрены следующие задачи:

Создание модели данных с использованием сущностей (EDM), сформированной из данных в учебной базе данных AdventureWorksLT.
Создание Служба данных WCF, предоставляющего данные из модели EDM приложению WPF.
Создание набора элементов управления с привязкой к данным путем перетаскивания элементов из окна Источники данных в конструктор WPF.
Создание кнопок для перехода вперед и назад по записям клиентов.
Создание кнопки для сохранения изменений, вносимых в данные в элементах управления, в Служба данных WCF и базовый источник данных.

Примечание

Отображаемые на компьютере имена или расположения некоторых элементов пользовательского интерфейса Visual Studio могут отличаться от указанных в следующих инструкциях. Это зависит от имеющегося выпуска Visual Studio и используемых параметров. Дополнительные сведения см. в разделе Настройка параметров разработки в Visual Studio.

Обязательные компоненты

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

Visual Studio
Доступ к запущенному экземпляру SQL Server или SQL Server Express с подключенной учебной базой данных AdventureWorksLT. Вы можете загрузить базу данных AdventureWorksLT с веб-сайта CodePlex.

Перед изучением приведенных ниже концепций будет полезно, хотя и не обязательно, ознакомиться со следующим пошаговым руководством.

Службы данных WCF. Для получения дополнительной информации см. Общие сведения о службах WCF Data Services.
Модели данных в Службы данных WCF.
Модели EDM и ADO.NET Entity Framework. Для получения дополнительной информации см. Общие сведения о платформе Entity Framework.
Работа с Конструктором WPF. Для получения дополнительной информации см. WPF Designer Overview.
Привязка данных WPF. Для получения дополнительной информации см. Общие сведения о связывании данных.

Создание проекта службы

Начните работу с данным пошаговым руководством с создания проекта для Служба данных WCF.

Порядок создания проекта службы

Запустите Visual Studio.
В меню Файл выберите пункт Создать, а затем команду Проект.
Разверните Visual C# или Visual Basic и выберите Веб-сайт.
Выберите шаблон проекта Веб-приложение ASP.NET.
В поле Имя введите AdventureWorksService и нажмите кнопку ОК.

Visual Studio создает проект AdventureWorksService.
В Обозревателе решений щелкните правой кнопкой мыши Default.aspx и выберите пункт Удалить. Этот файл для прохождения данного руководства не требуется.

Создание модели EDM для службы

Чтобы предоставить данные приложению с помощью Служба данных WCF, следует определить модель данных для этой службы. Служба данных WCF поддерживает два типа моделей данных: модель EDM и настраиваемые модели данных, определяемые с помощью объектов среды CLR, которые реализуют интерфейс IQueryable. В данном пошаговом руководстве вы создадите модель EDM для использования в качестве модели данных.

Создание модели EDM

В меню Проект выберите пункт Добавить новый элемент.
В списке "Установленные шаблоны" щелкните Данные и выберите элемент проекта Модель ADO.NET EDM.
Измените имя на AdventureWorksModel.edmx и нажмите кнопку Добавить.

Открывается Мастер моделей EDM.
На странице Выбор содержимого модели щелкните Создать из базы данных и нажмите кнопку Далее.
На странице Выбор подключения к базе данных выберите один из следующих параметров.
- Если подключение к учебной базе данных AdventureWorksLT доступно в раскрывающемся списке, то выберите его.
  
  -или-
- Щелкните Создать подключение и создайте подключение к базе данных AdventureWorksLT.
На странице Выбор подключения базы данных убедитесь, что выбран параметр Сохранить параметры соединения сущности в App.Config как, а затем нажмите кнопку Далее.
На странице Выбор объектов базы данных разверните узел Таблицы и выберите таблицу SalesOrderHeader.
Нажмите кнопку Готово.

Создание службы

Создайте Служба данных WCF для предоставления данных из модели EDM приложению WPF.

Создание службы

В меню Проект выберите пункт Добавить новый элемент.
В списке "Установленные шаблоны" щелкните Веб-сайт и выберите элемент проекта Служба данных WCF.
В поле Имя введите AdventureWorksService.svc и нажмите кнопку Добавить.

Visual Studio добавляет файл AdventureWorksService.svc в проект.

Настройка службы

Вам необходимо настроить службу на использование созданной модели EDM.

Порядок настройки службы

В файле кода AdventureWorks.svc замените объявление класса AdventureWorksService следующим кодом.

Public Class AdventureWorksService
    Inherits DataService(Of AdventureWorksLTEntities)

    ' This method is called only once to initialize service-wide policies. 
    Public Shared Sub InitializeService(ByVal config As IDataServiceConfiguration)
        config.SetEntitySetAccessRule("SalesOrderHeaders", EntitySetRights.All)
        config.UseVerboseErrors = True 
    End Sub 
End Class

public class AdventureWorksService : DataService<AdventureWorksLTEntities>
{
    // This method is called only once to initialize service-wide policies. 
    public static void InitializeService(IDataServiceConfiguration config)
    {
        config.SetEntitySetAccessRule("SalesOrderHeaders", EntitySetRights.All);
    }
}

Этот код обновляет класс AdventureWorksService, делая его производным от DataService, работающего с классом контекста объекта AdventureWorksLTEntities в вашей модели EDM. Он также обновляет метод InitializeService, чтобы предоставить клиентам службы полный доступ на чтение/запись к сущности SalesOrderHeader.

Соберите проект и убедитесь в отсутствии ошибок.

Создание клиентского приложения WPF

Чтобы отобразить данные из Служба данных WCF, создайте новое приложение WPF с источником данных, основанным на этой службе. Позднее в этом пошаговом руководстве вы добавите в приложение элементы управления с привязкой к данным.

Порядок создания клиентского приложения WPF

В Обозревателе решений щелкните правой кнопкой мыши узел решения, выберите команду Добавить и пункт Новый проект.
В диалоговом окне Новый проект разверните узел Visual C# или Visual Basic, а затем выберите Windows.
Выберите шаблон проекта Приложение WPF.
В поле Имя введите AdventureWorksSalesEditor и нажмите кнопку ОК.

Visual Studio добавляет проект AdventureWorksSalesEditor в решение.
В меню Данные выберите команду Показать источники данных.

Открывается окно Источники данных.
В окне Источники данных выберите Добавить новый источник данных.

Появится мастер настройки источника данных.
На странице Выбор типа источника данных мастера выберите Служба и нажмите кнопку Далее.
В диалоговом окне Добавление ссылки на службу щелкните элемент Найти.

Visual Studio выполняет поиск доступных служб в текущем решении и добавляет AdventureWorksService.svc в список доступных служб в поле Службы.
Введите AdventureWorksService в поле Пространство имен.
В поле Службы щелкните AdventureWorksService.svc и нажмите кнопку ОК.

Visual Studio загружает сведения о службе и возвращается в Мастер настройки источника данных.
На странице Добавление ссылки на службу нажмите кнопку Готово.

Visual Studio добавляет узлы, которые представляют данные, возвращаемые службой в окно Источники данных.

Определение пользовательского интерфейса окна

Добавьте несколько кнопок в окно, изменив в XAML в конструкторе WPF. Позднее в рамках данного пошагового руководства вы добавите код, позволяющий пользователям просматривать и обновлять торговые записи с помощью этих кнопок.

Создание макета окна

В Обозревателе решений дважды щелкните файл MainWindow.xaml.

Открывается окно в Конструкторе WPF.

В представлении Язык XAML конструктора добавьте следующий код между тегами <Grid>:

<Grid.RowDefinitions>
    <RowDefinition Height="75" />
    <RowDefinition Height="525" />
</Grid.RowDefinitions>
<Button HorizontalAlignment="Left" Margin="22,20,0,24" Name="backButton" Width="75">&lt;</Button>
<Button HorizontalAlignment="Left" Margin="116,20,0,24" Name="nextButton" Width="75">&gt;</Button>
<Button HorizontalAlignment="Right" Margin="0,21,46,24" Name="saveButton" Width="110">Save changes</Button>

Выполните построение проекта.

Создание элементов управления с привязкой к данным

Создайте элементы управления, отображающие записи клиентов, перетащив узел SalesOrderHeaders из окна Источники данных в конструктор.

Порядок создания элементов управления с привязкой к данным

В окне Источники данных щелкните раскрывающееся меню для узла SalesOrderHeaders и выберите команду Сведения.
Разверните узел SalesOrderHeaders.
Для данного примера некоторые поля не отображаются, поэтому щелкните раскрывающееся меню рядом со следующими узлами и выберите Нет.
- CreditCardApprovalCode
- ModifiedDate
- OnlineOrderFlag
- RevisionNumber
- rowguid
Это действие не позволяет Visual Studio создать элементы управления с привязкой к данным для этих узлов на следующем шаге. В данном пошаговом руководстве подразумевается, что конечному пользователю не требуется просматривать эти данные.
Из окна Источники данных перетащите узел SalesOrderHeaders на строку сетки под строкой с кнопками.

Visual Studio формирует XAML и код, который создает набор элементов управления, привязанных к данным в таблице Продукт. Дополнительные сведения о созданном XAML и коде см. в разделе Привязка элементов управления WPF к данным в Visual Studio.
Щелкните в конструкторе текстовое поле рядом с меткой Идентификатор клиента.
В окне Свойства установите флажок рядом со свойством IsReadOnly.
Установите свойство IsReadOnly для каждого из следующих текстовых полей.
- Номер заказа на поставку
- Код заказа на продажу
- Номер заказа на продажу

Загрузка данных из службы

Используйте прокси-объект службы для загрузки торговых данных из службы, а затем назначьте возвращенные данные источнику данных для CollectionViewSource в окне WPF.

Порядок загрузки данных из службы

В конструкторе дважды щелкните текст MainWindow, чтобы создать обработчик событий Window_Loaded.

Замените этот обработчик событий следующим кодом. Убедитесь, что вы заменили адрес localhost в этом коде на локальный адрес вашего компьютера разработчика.

Private DataServiceClient As AdventureWorksService.AdventureWorksLTEntities
Private SalesQuery As System.Data.Services.Client.DataServiceQuery(Of AdventureWorksService.SalesOrderHeader)
Private OrdersViewSource As CollectionViewSource

Private Sub Window_Loaded(ByVal Sender As Object, ByVal e As RoutedEventArgs) Handles MyBase.Loaded

    ' TODO: Modify the port number in the following URI as required.
    DataServiceClient = New AdventureWorksService.AdventureWorksLTEntities( _
    New Uri("https://localhost:32415/AdventureWorksService.svc"))
    SalesQuery = DataServiceClient.SalesOrderHeaders

    OrdersViewSource = CType(Me.FindResource("SalesOrderHeadersViewSource"), CollectionViewSource)
    OrdersViewSource.Source = SalesQuery.Execute()
    OrdersViewSource.View.MoveCurrentToFirst()
End Sub

private AdventureWorksService.AdventureWorksLTEntities dataServiceClient;
private System.Data.Services.Client.DataServiceQuery<AdventureWorksService.SalesOrderHeader> salesQuery;
private CollectionViewSource ordersViewSource;

private void Window_Loaded(object sender, RoutedEventArgs e)
{
    // TODO: Modify the port number in the following URI as required.
    dataServiceClient = new AdventureWorksService.AdventureWorksLTEntities(
        new Uri("https://localhost:45899/AdventureWorksService.svc"));
    salesQuery = dataServiceClient.SalesOrderHeaders;

    ordersViewSource = ((CollectionViewSource)(this.FindResource("salesOrderHeadersViewSource")));
    ordersViewSource.Source = salesQuery.Execute();
    ordersViewSource.View.MoveCurrentToFirst();
}

Навигация по торговым записям

Добавьте код, позволяющий пользователям выполнять прокрутку торговых записей с помощью кнопок < и >.

Предоставление пользователям возможности навигации по торговым записям

В конструкторе дважды щелкните кнопку < на поверхности окна.

Visual Studio открывает файл кода программной части и создает новый обработчик событий backButton_Click для события Click.

Добавьте следующий код в созданный обработчик событий backButton_Click:

If OrdersViewSource.View.CurrentPosition > 0 Then
    OrdersViewSource.View.MoveCurrentToPrevious()
End If

if (ordersViewSource.View.CurrentPosition > 0)
    ordersViewSource.View.MoveCurrentToPrevious();

Вернитесь в конструктор и дважды щелкните кнопку >.

Visual Studio открывает файл кода программной части и создает новый обработчик событий nextButton_Click для события Click.

Добавьте следующий код в созданный обработчик событий nextButton_Click:

If OrdersViewSource.View.CurrentPosition < CType(OrdersViewSource.View, CollectionView).Count - 1 Then
    OrdersViewSource.View.MoveCurrentToNext()
End If

if (ordersViewSource.View.CurrentPosition < ((CollectionView)ordersViewSource.View).Count - 1)
{
    ordersViewSource.View.MoveCurrentToNext();
}

Сохранение изменений в торговых записях

Добавьте код, позволяющий пользователям просматривать и сохранять изменения в торговых записях с помощью кнопки Сохранить изменения.

Добавление возможности сохранения изменений в торговых записях

В конструкторе дважды щелкните кнопку Сохранить изменения.

Visual Studio открывает файл кода программной части и создает новый обработчик событий saveButton_Click для события Click.

Добавьте следующий код в обработчик событий saveButton_Click.

Dim CurrentOrder As AdventureWorksService.SalesOrderHeader = CType(OrdersViewSource.View.CurrentItem, AdventureWorksService.SalesOrderHeader)

DataServiceClient.UpdateObject(CurrentOrder)
DataServiceClient.SaveChanges()

AdventureWorksService.SalesOrderHeader currentOrder = (AdventureWorksService.SalesOrderHeader)ordersViewSource.View.CurrentItem;
dataServiceClient.UpdateObject(currentOrder);
dataServiceClient.SaveChanges();

Тестирование приложения

Выполните сборку и запуск приложения, чтобы убедиться, что вы можете просмотреть и обновить записи клиентов.

Тестирование приложения

В меню Сборка выберите Собрать решение. Убедитесь, что сборка решения выполняется без ошибок.
Нажмите сочетание клавиш CTRL + F5.

Visual Studio запускает проект AdventureWorksService без его отладки.
В Обозревателе решений щелкните правой кнопкой мыши проект AdventureWorksSalesEditor.
В области Отладка контекстного меню выберите команду Запустить новый экземпляр.

Выполняется запуск приложения. Проверьте следующее.
- Текстовые поля отображают разные поля данных из первой торговой записи, имеющей код заказа на продажу 71774.
- Вы можете нажать кнопку > или < для перехода по другим торговым записям.
Введите текст в поле Комментарий для одной из торговых записей, а затем нажмите кнопку Сохранить изменения.
Закройте приложение и снова запустите его из Visual Studio.
Перейдите к измененной торговой записи и убедитесь, что изменения сохранились после перезапуска приложения.
Закройте приложение.

Следующие действия

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

Узнайте, как использовать окно Источники данных в Visual Studio для привязки элементов управления WPF к другим типам источников данных. Для получения дополнительной информации см. Пошаговое руководство. Привязка элементов управления WPF к набору данных.
Узнайте, как использовать окно Источники данных в Visual Studio для отображения связанных данных (то есть данных в отношении "родитель — потомок") в элементах управления WPF. Для получения дополнительной информации см. Пошаговое руководство. Отображение связанных данных в приложении WPF.

См. также

Поделиться через

Пошаговое руководство. Привязка элементов управления WPF к службе данных WCF

Обязательные компоненты

Создание проекта службы

Порядок создания проекта службы

Создание модели EDM для службы

Создание модели EDM

Создание службы

Создание службы

Настройка службы

Порядок настройки службы

Создание клиентского приложения WPF

Порядок создания клиентского приложения WPF

Определение пользовательского интерфейса окна

Создание макета окна

Создание элементов управления с привязкой к данным

Порядок создания элементов управления с привязкой к данным

Загрузка данных из службы

Порядок загрузки данных из службы

Навигация по торговым записям

Предоставление пользователям возможности навигации по торговым записям

Сохранение изменений в торговых записях

Добавление возможности сохранения изменений в торговых записях

Тестирование приложения

Тестирование приложения

Следующие действия

См. также

Задачи

Основные понятия

Другие ресурсы

Дополнительные ресурсы