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

Статья
08/11/2011

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

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

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

Примечание

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

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

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

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

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

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

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

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

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

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

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

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

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

В меню Проект выберите команду Добавить новый элемент.
В категории Данные выберите элемент проекта ADO.NET Entity Data Model.
Измените имя на 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 Basic узел решений отображается в обозревателе решений, только когда установлен флажок Всегда показывать решение в "Общие", страница "Проекты и решения", диалоговое окно "Параметры".
В диалоговом окне Новый проект разверните узел 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.
Важно!

При возникновении исключения безопасности убедитесь, соблюдены ли следующие условия.
- Номер порта, используемый на шаге 5 предыдущей процедуры, соответствует номеру порта ASP.NET Development Server.
- AdventureWorksWebApp загружается автоматически.
- AdventureWorksSilverlightAppTestPage.aspx задана как домашняя страница.
Закройте приложение.

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

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

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

Откройте 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

Журнал изменений

Дата	Журнал	Причина
Май 2011	Добавлены рекомендации по диагностике.	Обратная связь от клиента.

Май 2011

Добавлены рекомендации по диагностике.

Обратная связь от клиента.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

См. также

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

Журнал изменений

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