Элементы управления для приложений Windows

Элементы управления — это элементы пользовательского интерфейса, составляющие приложение Windows— кнопки, текстовые поля, списки, средства выбора и многое другое. Элемент управления отображает содержимое или позволяет пользователям взаимодействовать с приложением. Шаблон объединяет несколько элементов управления в многократно используемый рецепт для распространенных сценариев, таких как формы или макеты сведений о списках.

Windows предоставляет более 45 готовых элементов управления, созданных на основе Fluent Design System. От простых переключений до расширенных представлений данных, таких как сетка и список, эти элементы управления помогают создавать интерфейсы, которые визуально полируются, доступны и реагируют на разных устройствах.

Ознакомьтесь со статьями в этом разделе по проектированию, примерам кода и рекомендациям по каждому элементу управления и шаблону.

Начало работы

Чтобы узнать, как добавить элементы управления в приложение и связать обработчики событий, см. в разделе Добавление элементов управления и обработка событий. Сведения о настройке внешнего вида элемента управления с помощью повторно используемых стилей XAML см. в разделе "Стилизация элементов управления".

Элементы управления

В следующей таблице перечислены элементы управления приложениями Windows, доступные в WinUI, со ссылками на их документацию.

Базовые входные данные

Изображение	Управление	Описание
	Buttons	Элемент управления, который отвечает на входные данные пользователя и вызывает событие Click. Включает кнопку, раскрывающуюся кнопку, разделенную кнопку, переключатель и многое другое.
	флажки	Элемент управления, который пользователь может выбрать или очистить.
	Поля со списком	Раскрывающийся список элементов, которые пользователь может выбрать.
	Hyperlinks	Кнопка, которая отображается в виде текста гиперссылки и может перейти к URI или обработать событие щелчка.
	Радиокнопки	Элемент управления, позволяющий пользователю выбрать один параметр из группы параметров.
	Элемент управления "Оценка"	Оцените что-нибудь от 1 до 5 звезд.
	ползунки управления	Элемент управления, позволяющий пользователю выбирать из диапазона значений, перемещая ползунок вдоль дорожки.
	Переключатели	Переключатель, который можно переключать между 2 состояниями.

Коллекции

Изображение	Управление	Описание
	Представление элементов	Элемент управления, отображающий коллекцию элементов с использованием различных макетов.
	Представление списка и представление сетки	Элементы управления, которые представляют коллекцию элементов в вертикальном списке или в строках и столбцах.
	Переключение вида	Представляет коллекцию элементов, которые пользователь может пролистывать, один элемент за раз.
	Пейджер Pips	Элемент управления, который позволяет пользователю перемещаться по коллекции с разбивкой на страницы, когда номера страниц не должны быть визуально известны.
	Представление в виде дерева	Шаблон иерархического списка с расширением и сворачиванием узлов, содержащих вложенные элементы.
	Повторитель элементов	Гибкий примитивный элемент управления для макетов на основе данных.
	Свайп	Жест касания для быстрого доступа к действиям меню элементов.
	Обновление путем оттягивания	Предоставляет возможность извлекать коллекцию элементов в списке или сетке для обновления содержимого коллекции.

Диалоговые окна и всплывающие элементы

Изображение	Управление	Описание
	Диалоги	Диалоговое окно, которое можно настроить для хранения любого содержимого XAML.
	Всплывающие элементы	Отображает контекстную информацию и позволяет взаимодействовать с пользователем.
	Совет по обучению	Расширенное всплывающее окно для руководства пользователями и создания моментов обучения.

Формы

Изображение	Управление	Описание
	Формы	Шаблон сбора и отправки входных данных пользователей с помощью сочетания входных элементов управления и меток.

Мультимедиа, графики и фигуры

Изображение	Управление	Описание
	значки	Представляет элементы управления значками, использующие различные типы изображений в качестве содержимого.
	Анимированные значки	Элемент, который отображает и управляет значком, который анимирует при взаимодействии пользователя с элементом управления.
	Изображения и кисти изображений	Элемент управления для отображения содержимого изображения.
	воспроизведение мультимедиа	Элемент управления для отображения содержимого видео и изображения.
	Фигуры	Рисуйте фигуры, такие как эллипсы, прямоугольники и многоугольники.

Замечание

Элементы управления рукописным вводом (InkCanvas, InkToolbar): Эти элементы управления UWP недоступны в стабильном канале WinUI 3. InkCanvas доступен как экспериментальный API (представленный в Windows App SDK 2.0 Экспериментальный 1). Сведения о текущем состоянии и альтернативах см. в разделе "Известные пробелы в управлении".

Меню и панели инструментов

Изображение	Управление	Описание
	Меню и контекстные меню	Отображает контекстный список простых команд или параметров.
	Панель команд	Панель инструментов для отображения команд, относящихся к приложению, обрабатывающих макет и изменение размера содержимого.
	Всплывающее меню панели команд	Мини-панель инструментов, отображающая упреждающие команды и необязательное меню команд.
	Всплывающее меню и панель меню	Классическое меню, разрешающее отображение MenuItems, содержащего MenuFlyoutItems.

Навигация

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

Люди

Изображение	Управление	Описание
	Изображение человека	Отображает изображение человека или контакта.

Pickers

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

Прокрутка и разметка

Изображение	Управление	Описание
	Расширитель	Контейнер с заголовком, который можно развернуть, чтобы отобразить текст с большим содержимым.
	Элементы управления прокруткой и сдвигом	Элемент управления контейнером, позволяющий пользователю сдвигать содержимое и масштабировать его содержимое.
	Аннотированная полоса прокрутки	Элемент управления, расширяющий функциональность обычной вертикальной полосы прокрутки для простой навигации по большим коллекциям.
	Семантический зум	Позволяет пользователю масштабировать два разных представления коллекции, что упрощает навигацию по большим коллекциям элементов.
	Разделенный вид	Контейнер с 2 областями содержимого с несколькими параметрами отображения области.
	Двухпанельный вид	Элемент управления с двумя областями содержимого, охватывающими доступное пространство, расположенными либо рядом друг с другом, либо сверху-вниз.

Состояние и сведения

Изображение	Управление	Описание
	Progress	Показывает ход выполнения задачи приложением с помощью индикатора хода выполнения или кругового индикатора.
	подсказка	Отображает сведения об элементе во всплывающем окне.
	Панель сведений	Встроенное сообщение для отображения сведений об изменении состояния на уровне приложения.
	Значок сведений	Неинтрузивный пользовательский интерфейс для отображения уведомлений или привлечения фокуса к области.

Текст

Изображение	Управление	Описание
	Поле автоматического предложения	Элемент управления для предоставления предложений при вводе текста пользователем.
	Текстовый блок	Упрощенный элемент управления для отображения небольших объемов текста.
	Блок расширенного текста	Элемент управления, отображающий форматированный текст, гиперссылки, встроенные изображения и другое форматируемое содержимое.
	Текстовое поле	Однострочное или многострочное текстовое поле.
	Текстовое поле расширенного редактирования	Элемент управления редактированием форматированного текста, который поддерживает форматированный текст, гиперссылки и другое форматируемое содержимое.
	Поле ввода пароля	Элемент управления для ввода паролей.
	Поле "Номер"	Текстовый элемент управления, используемый для числовых входных и вычислений алгебраических уравнений.
	Метки	Руководство по добавлению доступных меток в элементы управления входными данными.

Строка заголовка

Изображение	Управление	Описание
	Строка заголовка	Настройте заголовок окна приложения.

Коллекция WinUI 3

Приложение WinUI 3 Gallery — это лучший способ практического изучения этих элементов управления. Он предоставляет интерактивные демонстрации большинства элементов управления WinUI, функций и шаблонов Fluent Design, что делает его идеальным компаньоном в этой документации. Установите его, чтобы попробовать элементы управления в режиме реального времени и связаться непосредственно с отдельных страниц элементов управления.

• Получите коллекцию WinUI 3 из Microsoft Store.
• Получите исходный код из GitHub.

Дополнительные элементы управления и ресурсы

Набор средств сообщества Windows Community Toolkit — это набор вспомогательных элементов, расширений и дополнительных элементов управления пользовательского интерфейса, которые дополняют встроенные элементы управления WinUI. Она управляется сообществом и поддерживается корпорацией Майкрософт, охватывая распространенные сценарии, такие как расширенные макеты, преобразователи и анимации.

Чтобы получить ранний доступ к экспериментальным элементам управления и функциям, ознакомьтесь с Windows Community Toolkit Labs, где новые компоненты разрабатываются и тестируются перед выпуском в основной набор средств.