Создание коллекции сведений в приложении на основе холста

Статья
03/15/2023

Следуйте пошаговым инструкциям, чтобы создать коллекцию сведений в приложении на основе холста для управления вымышленными данными в базе данных Northwind Traders. Эта тема является частью серии, в которой объясняется, как построить бизнес-приложение на реляционных данных в Microsoft Dataverse. Для достижения наилучших результатов изучите эти темы в следующей последовательности:

Создание коллекции заказов.
Создание сводной формы.
Создайте коллекцию сведений (данная тема).

Определение областей экрана.

Предварительные условия

Перед запуском этой темы необходимо установить базу данных, как описано ранее в этой теме. Затем вы должны либо создать галерею заказов и сводную форму, либо открыть приложение Заказы Northwind (холст) - начало части 3, которое уже содержит эту коллекцию и эту форму.

Создание еще одной строки заголовка

В верхней части экрана выберите элемент управления Подпись, который действует как строка заголовка, скопируйте его, нажав Ctrl-C, а затем вставьте его, нажав Ctrl-V:
Измените размер и переместите копию, чтобы она отображалась под формой сводки.
Удалите текст из копии одним из следующих способов:
- Дважды щелкните текст, чтобы выбрать его, затем нажмите "Удалить".
- Задайте для свойства Text пустую строку ("").

Добавление коллекции

Вставьте элемент управления Галерея с Пустым вертикальным макетом:

Новая коллекция, которая покажет сведения о заказе, появится в верхнем левом углу.
Закройте всплывающее диалоговое окно источника данных, затем измените размер и переместите коллекцию сведений в нижний правый угол под новой строкой заголовка:
Задайте для свойства Items коллекции сведений следующую формулу:
```
Gallery1.Selected.'Order Details'
```
Если появляется ошибка, проверьте, что коллекция заказов названа Gallery1 (на панели Представление в виде дерева возле левого края). Если эта коллекция имеет другое имя, переименуйте ее в Gallery1.

Вы только что связали две коллекции. Когда пользователь выбирает заказ в коллекции заказов, этот выбор определяет запись в таблице Заказы. Если этот заказ содержит одну или несколько номенклатур строки, запись в таблице Заказы связана с одной или несколькими записями в таблице Сведения о заказе, и данные из этих записей появляются в коллекции сведений. Такое поведение отражает отношение один ко многим, которое было создано для вас между таблицами Заказы и Сведения о заказе. Формула, которую вы указали, "обходит" это отношение с помощью точечной нотации:

Отображение наименований продуктов

В коллекции сведений выберите Добавить элемент с вкладки "Вставка", чтобы выбрать шаблон коллекции.

Убедитесь, что вы выбрали шаблон коллекции, а не саму коллекцию. Ограничительная рамка должна быть немного внутри границы коллекции и, вероятно, короче высоты коллекции. Когда вы вставляете элементы управления в этот шаблон, они повторяются для каждого элемента в коллекции.
На вкладке Вставка вставьте метку в коллекцию сведений.

Метка должна появиться в коллекции; если она не появилась, попробуйте еще раз, но убедитесь, что выбрали шаблон коллекции, прежде чем вставить метку.
Задайте для свойства Text новой метки следующую формулу:
```
ThisItem.Product.'Product Name'
```
Если текст не появляется, выберите стрелку для пункта Заказ 0901 в нижней части коллекции заказов.
Измените размер метки так, чтобы появился полный текст:

Это выражение выходит из записи в таблице Сведения о заказе. Запись удерживается в ThisItem через таблицу Продукты заказа через отношение многие к одному:

Извлекается столбец Название продукта (и другие столбцы, которые вы собираетесь использовать):

Отображение изображений продуктов

На вкладке Вставка вставьте элемент управления Изображение в коллекцию сведений:
Измените размер и переместите изображение и метку, чтобы они были рядом.

Совет

Для детального контроля размера и положения элемента управления начните изменять его размер или перемещайте его, не нажимая клавишу ALT, а затем продолжайте изменять размер или перемещать элемент управления, удерживая нажатой клавишу ALT:
Задайте для свойства Image изображения эту формулу:
```
ThisItem.Product.Picture
```
Опять же, выражение ссылается на продукт, который связан с этими сведениями о заказе и извлекает поле Рисунок для отображения.
Уменьшите высоту шаблона коллекции, чтобы более одной записи Сведения о заказе появлялись одновременно:

Отображение количества и стоимости продукта

На вкладке Вставка вставьте другую метку в коллекцию сведений, затем измените размер и переместите новую метку справа от информации о продукте.
Задайте для свойства Text новой метки следующее выражение:
```
ThisItem.Quantity
```
Эта формула выбирает информацию непосредственно из таблицы Сведения о заказе (отношения не требуются).
На вкладке Главная измените выравнивание этого элемента управления на Справа:
На вкладке Вставка вставьте другую метку в коллекцию сведений, затем измените размер и переместите новую метку справа от метки количества.
Задайте для свойства Text новой метки следующую формулу:
```
Text( ThisItem.'Unit Price', "[$-en-US]$ #,###.00" )
```
Если вы не включите тег языка ([$-en-US]), он будет добавлен для вас в зависимости от вашего языка и региона. Если вы используете другой языковой тег, вы захотите удалить $ сразу после закрывающей квадратной скобки (]), затем добавьте собственный символ валюты в эту позицию.
На вкладке Главная измените выравнивание этого элемента управления на Справа:
На вкладке Вставка вставьте другой элемент управления метки в коллекцию сведений, затем измените размер и переместите новую метку справа от единиц цены.
Задайте для свойства Text новой метки следующую формулу:
```
Text( ThisItem.Quantity * ThisItem.'Unit Price', "[$-en-US]$ #,###.00" )
```
Опять же, если вы не включите тег языка ([$-en-US]), он будет добавлен для вас в зависимости от вашего языка и региона. Если тег отличается, вы можете использовать свой собственный символ валюты вместо $ сразу после закрывающей квадратной скобки (]).
На вкладке Главная измените выравнивание этого элемента управления на Справа:

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

Добавление текста в новую строку заголовка

На вкладке Вставка вставьте еще одну метку на экран:
Измените размер и переместите новую метку над изображениями продуктов во второй строке заголовка, затем измените цвет текста на белый на вкладке Главная.
Дважды щелкните текст метки, затем введите Продукт:
Скопируйте и вставьте метку продукта, а затем измените размер и переместите копию, чтобы она находилась над столбцом количества.
Дважды щелкните текст новой метки, затем введите Количество:
Скопируйте и вставьте метку количества, а затем измените размер и переместите копию, чтобы она находилась над столбцом цены за единицу.
Дважды щелкните текст новой метки, затем введите Цена за единицу:
Скопируйте и вставьте метку цены за единицу, а затем измените размер и переместите копию, чтобы она находилась над столбцом суммы без учета скидок и наценок.
Дважды щелкните текст новой метки, затем введите Сумма.

Отображения итоговой суммы по заказу

Уменьшите высоту коллекции сведений, чтобы освободить место для итоговой суммы по заказу в нижней части экрана:
Скопируйте и вставьте строку заголовка в середине экрана, а затем переместите копию в нижнюю часть экрана:
Скопируйте и вставьте метку продукта из средней строки заголовка, затем переместите копию в нижнюю строку заголовка, слева от столбца Количество.
Дважды щелкните текст новой метки, затем введите следующий текст:
Итого по заказу:
Скопируйте и вставьте метку итоговой суммы заказа, затем измените размер и переместите копию справа от метки итоговой суммы заказа.
Задайте для свойства Text новой метки следующую формулу:
```
Sum( Gallery1.Selected.'Order Details', Quantity )
```
Эта формула показывает предупреждение о делегировании, но вы можете игнорировать его, потому что ни один заказ не будет содержать более 500 продуктов.
На вкладке Главная задайте для выравнивания текста новой метки значение Вправо:
Скопируйте и вставьте этот элемент управления метки, затем измените размер и переместите копию под столбец Сумма.
Задайте для свойства Text копии следующую формулу:
```
Text( Sum( Gallery1.Selected.'Order Details', Quantity * 'Unit Price' ), "[$-en-US]$ #,###.00" )
```
Эта формула показывает предупреждение о делегировании, но вы можете игнорировать его, потому что ни один заказ не будет содержать более 500 продуктов.

Добавление места для новых сведений

В любой коллекции вы можете показывать данные, но не можете обновлять или добавлять записи. Под коллекцией сведений вы добавите область, в которой пользователь может настроить запись в таблице Сведения о заказе и вставите эту запись в заказ.

Уменьшите высоту коллекции сведений достаточно, чтобы освободить пространство для редактирования отдельного элемента под этой коллекцией.

В этом пространстве вы добавите элементы управления, чтобы пользователь мог добавить сведения о заказе:
На вкладке Вставка вставьте метку, затем измените размер и переместите ее под коллекцию сведений.
Дважды щелкните текст новой метки, затем нажмите "Удалить".
На вкладке Главная задайте для цвета Fill новой метки значение LightBlue:

Выбор продукта

На вкладке Вставка выберите Элементу управления > Поле со списком.

Элемент управления Поле со списком (Поле со списком) появляется в верхнем левом углу.
Во всплывающем диалоговом окне выберите источник-данных Продукты заказа.
На вкладке Свойства для поля со списком выберите Изменить (рядом с пунктом Поля), чтобы открыть панель Данные. Убедитесь, что в полях Основной текст и SearchField задано значение nwind_productname.

Вы указываете логическое имя, потому что панель Данные пока не поддерживает отображаемые имена в этом случае:
Закройте панель Данные.
На вкладке Свойства возле правого края, прокрутите вниз, выключите Разрешить множественный выбор и убедитесь, что Разрешить поиск включен:
Измените размер и переместите поле со списком в светло-синюю область, прямо под столбцом названия продукта в коллекции сведений:

В этом поле со списком пользователь укажет запись в таблице Продукт для записи Сведения о заказе, которую создаст приложение.
Удерживая нажатой клавишу ALT, выберите стрелку вниз у поля со списком.

Совет

Удерживая клавишу ALT, вы можете взаимодействовать с элементами управления в Power Apps Studio без открытия режима предварительного просмотра.
В появившемся списке продуктов выберите продукт:.

Добавление изображения продукта

На вкладке Вставка выберите Мультимедиа > Изображение:

Элемент управления Изображение появляется в верхнем левом углу:
Измените размер и переместите изображение в светло-синюю область под другими изображениями продуктов и рядом с полем со списком.
Установите для свойства Image изображения следующее значение:
```
ComboBox1.Selected.Picture
```
Вы используете тот же прием, который вы использовали, чтобы показать фотографию сотрудника в сводной форме. Свойство Selected поля со списком возвращает всю запись любого продукта, выбранного пользователем, включая поле Рисунок.

Добавление поля количества

На вкладке Вставка выберите Текст > Ввод текста.

Элемент управления Ввод текста появляется в верхнем левом углу:
Измените размер и переместите поле ввода текста справа от поля со списком, под столбец количества продукта в коллекции сведений:

Используя это поле ввода текста, пользователь будет указывать поле Количество в записи Сведения о заказе.
Задайте для свойства Default этого элемента управления значение "":
На вкладке Главная задайте для выравнивания текста этого элемента управления значение Справа:

Отображение цены за единицу и суммы без учета скидок и наценок

На вкладке Вставка вставьте элемент управления Подпись:

Метка появляется в верхнем левом углу экрана:
Измените размер и переместите метку в положение справа от элемента управления вводом текста и установите для свойства Text метки следующую формулу:
```
Text( ComboBox1.Selected.'List Price', "[$-en-US]$ #,###.00" )
```
Этот элемент управления показывает значение Цена в прайс-листе из таблицы Продукты заказа. Это значение будет определять поле Цена за единицу в записи Сведения о заказе.

Примечание

Для этого сценария значение доступно только для чтения, но в других сценариях пользователь приложения может изменить его. В этом случае используйте элемент управления Ввод текста (Ввод текста ) и задайте для его свойства Default значение Цена по прайс-листу.
На вкладке Главная задайте для выравнивания текста метки цены по прайс-листу значение Справа:
Скопируйте и вставьте метку цены по прайс-листу, затем измените размер и переместите копию справа от метки цены по прайс-листу.
Задайте для свойства Text новой метки следующую формулу:
```
Text( Value(TextInput1.Text) * ComboBox1.Selected.'List Price', "[$-en-US]$ #,###.00" )
```
Этот элемент управления показывает сумму без учета скидок и наценок на основе количества, указанного пользователем приложения, и цены по прайс-листу продукта, выбранного пользователем приложения. Это чисто информационное значение для пользователя приложения.
Дважды щелкните элемент управления вводом текста для количества, затем введите число.

Метка Сумма пересчитывается, чтобы показать новое значение:

Добавление значка "Добавить"

На вкладке Вставка выберите Значок > Добавить:

Значок появляется в верхнем левом углу экрана.
Измените размер и переместите этот значок к правому краю светло-синей области, затем установите для свойства OnSelect значка следующую формулу:
```
Patch( 'Order Details',
    Defaults('Order Details'),
    {
        Order: Gallery1.Selected,
        Product: ComboBox1.Selected,
        Quantity: Value(TextInput1.Text),
        'Unit Price': ComboBox1.Selected.'List Price'
    }
);
Refresh( Orders );
Reset( ComboBox1 );
Reset( TextInput1 )
```
В общем случае функция Patch обновляет и создает записи, а конкретные аргументы в этой формуле определяют точные изменения, которые будет выполнять функция.
- Первый аргумент определяет источник данных (в данном случае таблицу Сведения о заказе), в которой функция будет обновляться или создавать запись.
- Второй аргумент указывает, что функция создаст запись со значениями по умолчанию для таблицы Сведения о заказе, если иное не указано в третьем аргументе.
- Третий аргумент указывает, что четыре столбца в новой записи будут содержать значения от пользователя.
  - Столбец Заказ будет содержать номер заказа, который пользователь выбрал в коллекции заказов.
  - Столбец Продукт будет содержать название продукта, выбранного пользователем в поле со списком продуктов.
  - Столбец Количество будет содержать значение, указанное пользователем в поле ввода текста.
  - Столбец Цена за единицу будет содержать цену по прайс-листу продукта, который пользователь выбрал для этих сведений о заказе.
Примечание

Вы можете создавать формулы, которые используют данные из любого столбца (в таблице Продукты заказа) для любого продукта, который пользователь приложения выбирает в поле со списком, которое показывает продукты. Когда пользователь выбирает запись в таблице Продукты заказа, не только в этом поле со списком отображается название продукта, но и на подписи появляется цена единицы продукта. Каждое значение подстановки в приложении на основе холста ссылается на всю запись, а не только на первичный ключ.

Функция Обновить гарантирует, что таблица Заказы отражает запись, которую вы только что добавили в таблицу Сведения о заказе. Функция Reset очищает данные о продукте, количестве и цене за единицу, чтобы пользователю было проще создавать еще одни сведения о заказе для того же заказа.
Нажмите F5, затем выберите значок Добавить.

Заказ отражает указанную вами информацию:
(необязательно) Добавьте еще один пункт в заказ.
Нажмите ESC, чтобы закрыть режим предварительного просмотра.

Удаление сведений о заказе

В центре экрана выберите шаблон коллекции сведений о заказе:
На вкладке Вставка выберите Значки > Корзина:

Значок корзины появляется в верхнем левом углу шаблона коллекции.
Измените размер и переместите значок корзины к правому краю шаблона коллекции сведений, затем установите для свойства OnSelect значка следующую формулу:
```
Remove( 'Order Details', ThisItem ); Refresh( Orders )
```
На данный момент нельзя удалить запись непосредственно из отношения, поэтому функция Удалить удаляет запись непосредственно из связанной таблицы. ThisItem указывает удаляемую запись, взятую из той же записи в коллекции сведений, в которой появляется значок корзины.

Опять же, операция использует кэшированные данные, поэтому функция Обновить информирует таблицу Заказы о том, что приложение изменило одну из связанных с ним таблиц.
Нажмите F5, чтобы открыть режим предварительного просмотра, затем выберите значок корзины рядом с каждой записью Сведения о заказе, которую вы хотите удалить из заказа.
Попробуйте добавить и удалить различные сведения о заказе из ваших заказов:

В заключение

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

Второй элемент управления коллекции, связанный с коллекцией заказов посредством отношения "один ко многим": Gallery2.Items = Gallery1.Selected.'Order Details'
Отношение многие к одному из таблицы Сведения о заказе в таблицу Продукты заказа: ThisItem.Product.'Product Name' и ThisItem.Product.Picture
Функция Choices для получения списка продуктов: Choices( 'Order Details'.Product' )
Свойство Selected поля со списком как полная запись со связью "многие к одному": ComboBox1.Selected.Picture и ComboBox1.Selected.'List Price'
Функция Patch для создания записи Сведения о заказе: Patch( 'Order Details', Defaults( 'Order Details' ), ... )
Функция Remove для удаления записи Сведения о заказе: Remove( 'Order Details', ThisItem )

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

Примечание

Каковы ваши предпочтения в отношении языка документации? Пройдите краткий опрос (обратите внимание, что этот опрос представлен на английском языке).

Опрос займет около семи минут. Личные данные не собираются (заявление о конфиденциальности).

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