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

Функциональность

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

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

Дизайн и Стиль

Размер и Форма

Spinner представляет собой круглый объект, который вращается вокруг своего центра. В зависимости от контекста используйте размеры Spinner:

• S — 16x16px
• M — 24x24px
• L — 32x32px
• XL — 64x64px

Цвет и Контраст

У Spinner есть зависимость между цветом и состоянием. В нём используются отличительные цвета для состояний: Brand, Neutral, Neutral Light, Positive, Warning, Negative и Informative.

Spinner оформлен в семантической палитре при обычном состоянии акцентный цвет, белый цвет с альфа-каналом используется на контрастном фоне(например на primary кнопке). Палитра Plex отвечает стандартам контрастности WCAG.