Использование элементов управления Fluent UI
Создание приложений, которые отлично смотрятся, в Microsoft Teams будет проще с нашими новыми компонентами. Построено на Fluent UI framework, новые компоненты будут отлично смотреться со стилями Teams и автоматически адаптируются к теме Teams по умолчанию. Новые элементы управления: Кнопка, Флажок, Поле со списком, Средство выбора даты, Метка, Группа кнопок-переключателей, Рейтинг, Ползунок, Текстовое поле и Переключатель.
Давайте рассмотрим каждый элемент управления Fluent UI и его наиболее полезные свойства. Полный список элементов управления и свойств в Power Apps см. в Элементы управления и свойства в Power Apps.
Кнопка
Элемент управления, который пользователь выбирает для взаимодействия с приложением.

Описание
Настройте свойство OnSelect элемента управления Кнопка для выполнения одной или нескольких формул при выборе элемента управления пользователем.
Ключевые свойства
ButtonType — стиль отображаемой кнопки: стандартный или основной. Значение по умолчанию: Стандарт.
OnSelect — поведение приложения, когда пользователь выбирает элемент управления.
Text — текст, отображаемый в элементе управления, или текст, который пользователь вводит в элемент управления.
Флажок
Элемент управления, который пользователь может установить или снять, задавая значение true или false соответственно.

Описание
Пользователь может указывать логическое значение с помощью этого знакомого элемента управления, который широко используется в пользовательских интерфейсах.
Ключевые свойства
Box side — сторона элемента управления, на которой отображается флажок.
Подпись — Текст, отображаемый на элементе управления.
Checked — Включен ли данный элемент управления.
Поле со списком
Это элемент управления, который позволяет выбирать из доступных вариантов. Поддерживает поиск и выбор нескольких вариантов.

Описание
Элемент управления Поле со списком позволяет пользователю выполнять поиск элементов, которые необходимо выбрать.
Режим одиночного или множественного выбора настраивается с использованием свойства SelectMultiple.
Ключевые свойства
Items — источник данных, в котором можно выбрать элементы.
DefaultSelectedItems — элементы, выбранные изначально до взаимодействия с элементом управления.
SelectMultiple — позволяет определить, сколько элементов можно выбрать: один или несколько.
IsSearchable — позволяет определить, можно ли выполнять поиск элементов, прежде чем их выбрать.
Средство выбора даты
Элемент управления, который выбирается для указания даты.

Описание
Добавив элемент управления Выбор даты вместо элемента управления "Ввод текста", вы обеспечите ввод даты пользователем в правильном формате.
Ключевые свойства
Value — дата, выбранная в элементе управления датой. Эта дата представлена по местному времени.
Подпись
Поле, в котором отображаются данные, например текст, числа, даты и валюта.

Описание
Метка показывает данные, которые вы указываете как буквенную строку текста или как формулу, которая вычисляет строку текста. Метки часто отображаются вне других элементов управления (например, заголовок, определяющий экран), в качестве метки для другого элемента управления (например, элемента "Оценка" или "Аудио") или в коллекции для отображения определенного типа сведений об элементе.
Ключевые свойства
Color — цвет текста в элементе управления.
Font — имя семейства шрифтов, используемых для отображения текста.
Text — Текст, отображаемый на элементе управления.
Группа кнопок-переключателей
Элемент ввода, отображающий несколько вариантов, из которых пользователи могут одновременно выбрать только один.

Описание
Элемент управления Группа кнопок-переключателей — стандартный HTML-элемента ввода — лучше всего использовать с несколькими взаимоисключающими вариантами.
Ключевые свойства
Items — источник данных, отображаемых в элементе управления, такой как коллекция, список или диаграмма.
Selected — запись данных, представляющая выбранный элемент.
Рейтинг
Элемент управления, позволяющий пользователю указать значение от 0 до заданного вами максимального числа.

Описание
В этом элементе управления пользователь может, например, выбрать определенное количество звездочек, показывая, насколько ему что-либо нравится.
Ключевые свойства
Value — начальное значение элемента управления до его изменения пользователем.
Max — максимальное значение, которое может задать пользователь с помощью ползунка или оценки.
Ползунок
Элемент управления, позволяющий пользователю указывать значение, перетаскивая маркер.

Описание
Пользователь может выбрать значение между заданными минимальным и максимальным значениями, передвигая маркер ползунка влево-вправо или вверх-вниз в зависимости от выбранного вами направления.
Ключевые свойства
Max — максимальное значение, которое может задать пользователь с помощью ползунка или оценки.
Min — минимальное значение, которое может задать пользователь с помощью ползунка или оценки.
Value — значение входного элемента управления.
Layout — отображается ли элемент управления по горизонтали или по вертикали.
Show value — должен ли элемент управления отображать значение.
Текстовое поле
Поле, в котором пользователь может вводить текст, числа и другие данные.
Описание
Пользователь может вводить данные в элементе управления Текстовое поле. В зависимости от настройки приложения эти данные могут добавляться в источник, использоваться для вычисления временного значения или применяться иным способом.
Ключевые свойства
Font — имя семейства шрифтов, используемых для отображения текста.
Text — текст, отображаемый в элементе управления, или текст, который пользователь вводит в элемент управления.
Переключатель
Переключатель — это элемент управления, который пользователь может включить или отключить.

Описание
Элемент управления Переключатель разработан для современного пользовательского интерфейса, но ведет себя так же, как флажок.
Ключевые свойства
Checked — Включен ли данный элемент управления.
OffText — Текст выключенного состояния.
OnText — Текст включенного состояния.
Разница между Fluent UI и классическими элементами управления
Свойства элементов управления были упрощены для удобства использования. В следующей таблице перечислены различия между элементами управления Fluent UI и классическими именами свойств элемента управления.
Тип элемента управления | Классические | Fluent UI |
---|---|---|
Кнопка | Заливка Фоновый TabIndex |
ColorFill ColorBackground AcceptsFocus |
Флажок | По умолчанию TabIndex |
Помечено AcceptsFocus |
Поле со списком | InputTextPlaceholder TabIndex |
Текст AcceptsFocus |
Средство выбора даты | SelectedDate TabIndex |
значение AcceptsFocus |
Ярлык | Размер | FontSize |
Группа кнопок-переключателей | TabIndex | AcceptsFocus |
Рейтинг | По умолчанию TabIndex |
значение AcceptsFocus |
Ползунок | По умолчанию TabIndex |
значение AcceptsFocus |
Текстовое поле | Цвет По умолчанию Заливка SpellCheck TabIndex |
ColorText значение ColorBackground EnableSpellCheck AcceptsFocus |
Переключатель | Размер По умолчанию TabIndex |
FontSize Помечено AcceptsFocus |
См. также
Создание дополнительных приложений
Общие сведения о Power Apps Studio
Примечание
Каковы ваши предпочтения в отношении языка документации? Пройдите краткий опрос (обратите внимание, что этот опрос представлен на английском языке).
Опрос займет около семи минут. Личные данные не собираются (заявление о конфиденциальности).