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

Статья
06/10/2015

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

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

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

Примечание

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

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

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

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

Предварительное ознакомление со следующими понятиями полезно, но не обязательно для выполнения пошагового руководства:

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

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

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

Чтобы создать проект службы, выполните следующие действия

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

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

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

Для создания модели EDM выполните следующие действия

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

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

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

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

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

В меню Проект выберите команду Добавить новый элемент.
Выберите элемент проекта Служба данных WCF.
В поле Имя введите AdventureWorksDataService.svc и нажмите Добавить.

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

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

Чтобы настроить службу

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

Public Class AdventureWorksDataService
    Inherits DataService(Of AdventureWorksLTEntities)

    ' This method is called only once to initialize service-wide policies. 
    Public Shared Sub InitializeService(ByVal config As DataServiceConfiguration)
        config.SetEntitySetAccessRule("*", EntitySetRights.All)
        config.DataServiceBehavior.MaxProtocolVersion = DataServiceProtocolVersion.V2
    End Sub 

End Class

public class AdventureWorksDataService : DataService<AdventureWorksLTEntities>
{
    // This method is called only once to initialize service-wide policies. 
    public static void InitializeService(DataServiceConfiguration config)
    {
        config.SetEntitySetAccessRule("*", EntitySetRights.All);
        config.DataServiceBehavior.MaxProtocolVersion = DataServiceProtocolVersion.V2;
    }
}

Постройте проект и удостоверьтесь, что построение выполняется без ошибок.

Создание приложения Silverlight

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

Чтобы создать приложение Silverlight

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

Добавление источника данных в приложение Silverlight

Создайте источник данных, основанный на данных, возвращенных службой.

Создание источника данных

В меню Данные выберите пункт Показать источники данных.
В окне Источники данных выберите Добавить новый источник данных.

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

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

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

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

Добавьте кнопки в окно путем изменения Язык XAML в Конструктор Silverlight.

Чтобы создать макета окна, выполните следующие действия

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

В Конструктор Silverlight откроется окно.

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

<Grid.RowDefinitions>
    <RowDefinition Height="75" />
    <RowDefinition Height="525" />
</Grid.RowDefinitions>
<Button HorizontalAlignment="Left" Margin="22,20,0,24" Name="backButton" Width="75" Content="&lt;"></Button>
<Button HorizontalAlignment="Left" Margin="116,20,0,24" Name="nextButton" Width="75" Content="&gt;"></Button>

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

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

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

Чтобы создать элементы управления с привязкой к данным, выполните следующие действия

В окне Источники данных щелкните раскрывающееся меню узла Customers и выберите пункт Сведения.
Разверните узел Customers.
В данном примере некоторые поля не будут отображаться, поэтому щелкните раскрывающееся меню рядом со следующими узлами и выберите Нет.
- NameStyle
- PasswordHash
- PasswordSalt
- rowguid
Это не дает Visual Studio создавать элементы управления для этих узлов при перетаскивании их в конструктор. В этом пошаговом руководстве предполагается, что конечному пользователю нет нужды видеть эти данные.
Перетащите узел Customers из окна Источники данных в область конструктора под кнопками.

Visual Studio создает Язык XAML и код, который создает набор элементов управления, привязанных к данным о клиентах.

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

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

Чтобы загрузить данные из службы, выполните следующие действия

В конструкторе щелкните пустую область рядом с одной из кнопок.
В окне Свойства убедитесь, что выбран параметр UserControl, и перейдите на вкладку События.
Найдите событие Загружен и дважды щелкните его.

В открывшемся файле кода (MainPage.xaml) добавьте оператор using (C#) или Imports (Visual Basic).

Imports System.Windows.Data
Imports AdventureWorksSilverlightApp.AdventureWorksService

using System.Windows.Data;
using AdventureWorksSilverlightApp.AdventureWorksService;

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

Private advWorksService As AdventureWorksLTEntities
Private customersViewSource As CollectionViewSource

Private Sub UserControl_Loaded(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles MyBase.Loaded
    advWorksService = New AdventureWorksLTEntities(New Uri("https://localhost:6188/AdventureWorksDataService.svc"))
    customersViewSource = Me.Resources("CustomersViewSource")
    advWorksService.Customers.BeginExecute(Sub(result As IAsyncResult)
                                               customersViewSource.Source = advWorksService.Customers.EndExecute(result)
                                           End Sub, Nothing)
End Sub

private AdventureWorksLTEntities advWorksService;
private System.Windows.Data.CollectionViewSource customersViewSource;

private void UserControl_Loaded(object sender, RoutedEventArgs e)
{
    advWorksService = new AdventureWorksLTEntities(new Uri("https://localhost:54961/AdventureWorksDataService.svc"));

    customersViewSource = this.Resources["customersViewSource"]
    as System.Windows.Data.CollectionViewSource;
    advWorksService.Customers.BeginExecute(result => customersViewSource.Source = advWorksService.Customers.EndExecute(result), null);
}

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

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

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

В меню Построение выберите команду Построить решение. Убедитесь в том, что проект строится без ошибок.
Нажмите клавишу F5.
Убедитесь, что отображается первая запись в таблице Customers.
Закройте приложение.

Примечание

Если отображается ошибка, проверьте, что в коде указан правильный порт сервера разработки ASP.NET.

Перемещение по записям

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

Чтобы предоставить пользователям возможность перемещаться по записям о продажах, выполните следующие действия

Откройте MainPage.xaml в конструкторе и дважды щелкните кнопку >.

Замените созданный обработчик событий backButton_Click следующим кодом.

Private Sub backButton_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles backButton.Click
    customersViewSource.View.MoveCurrentToPrevious()
    If customersViewSource.View.IsCurrentBeforeFirst Then
        customersViewSource.View.MoveCurrentToFirst()
    End If 
End Sub

private void backButton_Click(object sender, RoutedEventArgs e)
{
    customersViewSource.View.MoveCurrentToPrevious();
    if (customersViewSource.View.IsCurrentBeforeFirst)
        customersViewSource.View.MoveCurrentToFirst();
}

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

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

Замените созданный обработчик событий nextButton_Click следующим кодом.

Private Sub nextButton_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs) Handles nextButton.Click
    customersViewSource.View.MoveCurrentToNext()
    If customersViewSource.View.IsCurrentAfterLast Then
        customersViewSource.View.MoveCurrentToLast()
    End If 
End Sub

private void nextButton_Click(object sender, RoutedEventArgs e)
{
    customersViewSource.View.MoveCurrentToNext();
    if (customersViewSource.View.IsCurrentAfterLast)
        customersViewSource.View.MoveCurrentToLast();
}

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

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

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

В меню Построение выберите команду Построить решение. Убедитесь в том, что проект строится без ошибок.
Нажмите клавишу F5.
Убедитесь, что отображается первая запись в таблице Customers.
Нажимайте кнопки < и > для переходов назад и вперед по записям клиентов.
Закройте приложение.

Примечание

Если отображается ошибка, проверьте, что в коде указан правильный порт сервера разработки ASP.NET.

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

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

Узнайте, как сохранить изменения в базу данных. Дополнительные сведения см. в разделе Привязка данных.
Узнайте, как внедрить дополнительные функции в приложения Silverlight с помощью Службы данных WCF. Дополнительные сведения см. в разделе Службы данных ADO.NET (Silverlight).

См. также

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

Data Access and Data Structures

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

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

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

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

Чтобы создать проект службы, выполните следующие действия

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

Для создания модели EDM выполните следующие действия

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

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

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

Чтобы настроить службу

Создание приложения Silverlight

Чтобы создать приложение Silverlight

Добавление источника данных в приложение Silverlight

Создание источника данных

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

Чтобы создать макета окна, выполните следующие действия

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

Чтобы создать элементы управления с привязкой к данным, выполните следующие действия

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

Чтобы загрузить данные из службы, выполните следующие действия

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

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

Перемещение по записям

Чтобы предоставить пользователям возможность перемещаться по записям о продажах, выполните следующие действия

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

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

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

См. также

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

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