Share via

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

  • Статья

 

Опубликовано: Апрель 2016

В этом пошаговом руководстве описывается создание приложения WPF, отображающего данные из таблиц базы данных, между которыми существует иерархическое отношение. Данные инкапсулированы в сущностях в модели EDM. Родительская сущность содержит информацию общего характера о наборе заказов. Каждое свойство этой сущности привязано к другому элементу управления в приложении. Дочерняя сущность содержит подробные сведения по каждому заказу. Этот набор данных привязан к элементу управления DataGrid.

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

  • Создание приложения WPF и модели EDM, которая генерируется на основе данных в образце базы данных AdventureWorksLT.

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

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

    Примечание

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

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

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

  • Visual Studio.

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

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

Создание проекта

Создание нового проекта WPF для отображения записей о заказах.

Для создания нового проекта WPF выполните следующие действия

  1. Запустите Visual Studio.

  2. В меню Файл последовательно выберите пункты Создать и Проект.

  3. Разверните Visual C# или Visual Basic, затем выберите Windows.

  4. Удостоверьтесь, что в поле со списком в верхней части диалогового окна выбран пункт .NET Framework 4. Элемент управления DataGrid, используемый в этом руководстве, доступен только в .NET Framework 4.

  5. Выберите шаблон проекта Приложение WPF.

  6. В поле Имя введите AdventureWorksOrdersViewer.

  7. Нажмите кнопку ОК.

    Visual Studio создаст проект AdventureWorksOrdersViewer.

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

Прежде чем приступать к созданию связанных с данными элементов управления, необходимо сначала определить модель данных и добавить ее в окно Источники данных. В этом руководстве в качестве модели данных избрана модель "сущность-данные" (Entity Data Model — EDM).

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

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

  2. На странице Выбор типа источника данных выберите База данных и нажмите кнопку Далее.

  3. На странице Выбор модели базы данных щелкните Модель EDM и нажмите кнопку Далее.

  4. На странице Выбор содержимого модели щелкните Создать из базы данных и нажмите кнопку Далее.

  5. На странице Выбор подключения к базе данных выполните одно из следующих действий:

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

      -или-

    • Щелкните Создать подключение и создайте подключение к базе данных AdventureWorksLT.

    Удостоверьтесь, что флажок Сохранить настройки подключения сущности в App.Config как установлен, и нажмите кнопку Далее.

  6. На странице Выбор объектов базы данных разверните узел Tables и выберите следующие таблицы:

    • SalesOrderDetail

    • SalesOrderHeader

  7. Нажмите кнопку Готово.

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

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

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

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

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

    В конструкторе WPF откроется окно.

  2. Внесите в XAML изменения, так чтобы для условий Высота и Ширина было задано значение "800".

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

  4. Разверните узел SalesOrderHeaders.

  5. Щелкните раскрывающееся меню рядом с SalesOrderID и выберите пункт ComboBox.

  6. Для каждого из следующих дочерних узлов узла SalesOrderHeaders щелкните раскрывающееся меню рядом с узлом и выберите Нет:

    • RevisionNumber

    • OnlineOrderFlag

    • ShipToAddressID

    • BillToAddressID

    • CreditCardApprovalCode

    • SubTotal

    • TaxAmt

    • Freight

    • rowguid

    • ModifiedDate

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

  7. Перетащите узел SalesOrderHeaders из окна Источники данных в окно в конструкторе WPF.

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

  8. В конструкторе щелкните поле со списком рядом с меткой ID заказа на продажу.

  9. В окне Свойства установите флажок около свойства IsReadOnly.

Создание элемента управления DataGrid, отображающего подробные сведения о заказах

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

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

  1. В окне Источники данных найдите узел SalesOrderDetails, являющийся дочерним узлом узла SalesOrderHeaders.

    Примечание

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

  2. Разверните дочерний узел SalesOrderDetails.

  3. Для каждого из следующих дочерних узлов узла SalesOrderDetails щелкните раскрывающееся меню рядом с узлом и выберите Нет:

    • SalesOrderID

    • SalesOrderDetailID

    • rowguid

    • ModifiedDate

    Это действие запрещает Visual Studio добавлять эти данные в элемент управления DataGrid, который будет создан на следующем шаге. В этом пошаговом руководстве предполагается, что конечному пользователю нет нужды видеть эти данные.

  4. Перетащите дочерний узел SalesOrderDetails из окна Источники данных в окно в конструкторе WPF.

    Visual Studio генерирует язык XAML для определения нового связанного с данными элемента управления DataGrid, и этот элемент отображается в конструкторе. Visual Studio также обновляет созданный метод GetSalesOrderHeadersQuery в файле с выделенным кодом, чтобы добавить данные в сущности SalesOrderDetails.

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

Соберите и запустите приложение для проверки, отображает ли оно записи о заказах.

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

  1. Нажмите клавишу F5.

    Выполняется сборка и запуск приложения. Проверьте следующее:

    • В поле со списком Идентификатор заказа на продажу отображается 71774. Это первый идентификатор заказа в данной сущности.

    • О каждом заказе, выбранном в поле со списком ID заказа на продажу, в элементе DataGrid отображаются подробные сведения.

  2. Закройте приложение.

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

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

См. также

Привязка элементов управления WPF к данным в Visual Studio
Практическое руководство. Отображение связанных данных в приложениях WPF