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

Когда вы используете системные материалы, ваши элементы отлично смотрятся в любом контексте, потому что эффекты автоматически адаптируются к светлому и темному режимам системы.

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

Воспользуйтесь предоставляемыми системой цветами для текста, заливок, символов и разделителей. Предоставляемые системой цвета автоматически подстраивают элементы на полупрозрачный фон. Для руководства см. Динамические системные цвета.

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

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

Для использования в контейнерах контента iOS 13 определяет четыре материала, имеющих разные уровни прозрачности (каждый материал также включает в себя темный вариант):

SystemUltraThinMaterial

SystemThinMaterial

SystemMaterial (по умолчанию)

SystemThickMaterial

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

• Более толстые материалы могут обеспечить лучшую контрастность текста и других элементов с тонкими элементами
  
  
• Прозрачность может помочь сохранить свой контекст, предоставляя видимое напоминание о контенте, который находится в фоновом режиме
  
  

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

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

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

• Label (по умолчанию)
  
  
• secondaryLabel
  
  
• tertiaryLabel
  
  
• quaternaryLabel
  

Вы можете использовать следующие значения яркости для заливок на всех материалах.

• fill (по умолчанию)
  
  
• secondaryFill
  
  
• tertiaryFill
  

iOS определяет одно значение яркости по умолчанию для разделителей (separator), которое хорошо работает на всех материалах.

Выберите эффект яркости, основываясь на его семантическом значении. Избегайте смешения этих эффектов, не используйте эффект метки.