Создание простой карточки (предварительная версия)

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

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

Учетная запись Power Apps

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

  1. Войдите в Power Apps и выберите свою среду.

  2. В меню навигации выберите ...Еще > Карточки.

  3. Щелкните + Создать карточку.

  4. В разделе Имя карточки введите HelloWorldCard, затем выберите Создать.

Запросите ввод текста.

  1. Выберите текст Добавьте и удалите элемент для настройки новой карточки., затем выберите значок Удалить (X), чтобы удалить его.

    Снимок экрана текстовой метки-заполнителя, которую нужно удалить на новой карточке в конструкторе карточек.

  2. В меню навигации выберите + Вставка.

  3. На панели инструментов выберите Ввод, чтобы развернуть категорию, затем выберите Ввод текста.

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

  4. В области свойств ввода текста установите для свойства Label значение Как Вас зовут?.

    Снимок экрана карточки с элементом управления Ввод текста с меткой в конструкторе карточек.

Назначение переменных

  1. В меню навигации выберите Представление в виде дерева и измените имя элемента управления textInput1 на UserAnswer.

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

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

    Совет

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

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

  2. В меню навигации выберите Переменные.

  3. Выберите + Создать переменную.

  4. В окне Новая переменная введите UserName в поле Имя и введите Нет имени в поле Значение по умолчанию. Остальные значения оставьте как есть.

  5. Выберите Сохранить.

    Снимок экрана области свойств переменной.

  6. На холсте выберите заголовок карточки, который представляет собой элемент управления «текстовая подпись». В области свойств элемента управления задайте для свойства Text значение ="Привет, " & UserName.

    Это выражение изменяет заголовок карты на строку «Привет, », за которой следует значение созданной вами переменной. Вы можете ввести выражение в строке формул или на панели свойств.

    Снимок экрана текстового выражения, введенного в свойство «Text» заголовка карточки.

Добавление кнопки Power Fx

  1. В меню навигации выберите + Вставка.

  2. На панели инструментов выберите Ввод, чтобы развернуть категорию, затем выберите Кнопка.

  3. На панели свойств кнопки установите для свойства Заголовок значение Поприветствовать.

    Снимок экрана с областью свойств именованной кнопки и этой кнопкой на карточке.

  4. На панели свойств рядом с При выборе выберите PowerFx, чтобы поместить курсор в строку формул.

  5. Введите следующее выражение Power Fx в строку формул: Set(UserName, UserAnswer)

    Это выражение на основе функции Set() присваивает значение пользовательского ввода (UserAnswer) переменной UserName текстовой метки (заголовка карточки) при выборе кнопки. Другой способ прочитать этот выражение: Установить значение переменной UserName равным значению UserAnswer. Поскольку выражение привязано к свойству При выборе кнопки, которое также называется Команда рядом со строкой формул, оно выполняется, когда пользователь выбирает кнопку.

    Снимок экрана выражения Power Fx в строке формул, назначенного свойству OnSelect кнопки.

Тестирование карточки

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

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

Дальнейшие шаги

Узнайте, как создать немного более сложную карточку, в учебнике Простой список покупок.