Вкладки — это кнопки, которые всегда встречаются группами и зависят от состояния друг друга: в любой момент времени активной может быть только одна из них.
Компонент кнопок
Кнопки, не являющиеся вкладками, могут работать независимо от других кнопок.
Анатомия
Характеристики
Вкладки, вложенные в панель приложений, выровнены по левому краю.
Метки макета
Определения E, M, KL, P, Flex
Панель приложения и компонент заголовка
Спецификации, рекомендации по стилю и многое другое.
Вкладки, вложенные в панель приложений – гибкое выравнивание
Вкладки свернуты в панели приложений – меню ящика
Панель приложения и компонент заголовка
Спецификации, рекомендации по стилю и многое другое.
Отдельная панель вкладок – с выравниванием по левому краю
Отдельная панель вкладок – гибкое выравнивание
Переполнение строки метки вкладки
Масштабирование макетов
Эти эталонные макеты показывают, как адаптировать вкладки для экранов различной ширины и высоты. (Категории ширины и высоты определяются в разделе «Макет» .) Обратите внимание, что все значения пикселей находятся в визуализированных пикселях до того, как произойдет какая-либо понижающая или повышающая дискретизация.
Макет
Поля, ключевые линии и отступы для экранов различных размеров.
Метки макета
Определения E, M, KL, P, Flex
Стандартные и широкие экраны в кронштейне небольшой высоты
Стандартные и широкие экраны в кронштейне стандартной высоты
Стандартные и широкие экраны в высоком кронштейне
Сверхширокие и сверхширокие экраны во всех вариантах высоты.
Стили
Рекомендации по типографике
Ссылки на масштаб и сетку, типографские примеры и многое другое.
Рекомендации по цвету
Палитры, значения высоты и непрозрачности и многое другое.
[null,null,["Последнее обновление: 2024-10-30 UTC."],[[["Tabs are interactive buttons displayed in groups, with only one active at a time, unlike independent buttons."],["They can be integrated into app bars with different alignment options or presented as standalone bars, adapting to various screen sizes."],["Tab styling incorporates specific typography, color palettes for different states and elements, and standardized sizing for icons and touch targets."],["Visual examples demonstrate tab implementations, including collapsed, app bar-nested, and standalone configurations."]]],[]]