Независимые от плотности пиксели (dp) и масштабируемые пиксели (sp) необходимы для создания макетов и отображения шрифтов, которые единообразно реагируют на широкий диапазон плотности экрана, классов размеров, форм-факторов и соотношений сторон, характерных для устройств Android.
Основные выводы
- При использовании базовой сетки придерживайтесь размеров 4 и 8.
- Технические характеристики указываются в единицах dp и sp, а не в пикселях.
- Экспорт растровых изображений для всех сегментов.
- При проектировании учитывались адаптивные характеристики, а также различные размеры, разрешения и соотношения сторон экрана.
- Независимые от плотности пиксели (dp) : Независимые от плотности пиксели — это гибкие единицы измерения, которые масштабируются таким образом, чтобы иметь одинаковые размеры на любом экране. Они основаны на физической плотности экрана. Эти единицы измерения относительны для экрана с разрешением 160 dpi (точек на дюйм), на котором 1 dp примерно равен 1 пикселю.
- Масштабируемые пиксели (sp) : Масштабируемые пиксели выполняют ту же функцию, что и dp, но для шрифтов. Значение по умолчанию для sp совпадает со значением по умолчанию для dp. Система Android вычисляет фактический размер шрифта, который следует использовать, на основе устройства и предпочтений пользователя, заданных в настройках устройства.
Основное различие между этими единицами измерения заключается в том, что масштабируемые пиксели сохраняют настройки шрифта пользователя. Пользователи, у которых установлены более крупные настройки текста для обеспечения доступности, видят размер шрифта, соответствующий их предпочтениям. См. как изменить размер шрифта в Compose.
Android использует эти единицы измерения для масштабируемости и адаптации к различным устройствам и разрешениям.
Корзины плотности
Экраны с высокой плотностью имеют больше пикселей на дюйм, чем экраны с низкой плотностью. В результате элементы пользовательского интерфейса с одинаковыми размерами в пикселях отображаются крупнее на экранах с низкой плотностью и меньше на экранах с высокой плотностью. Именно поэтому не следует указывать размеры в пикселях.
Android группирует диапазоны плотности экрана в «категории» и использует их для предоставления оптимального набора ресурсов вашему устройству. Наиболее часто используемые категории плотности — это mdpi , hdpi , xhdpi , xxhdpi и xxxhdpi ( nodpi и anydpi обозначают категорию, которая не масштабируется в зависимости от разрешения устройства и обычно используется для векторных изображений), каждая из которых соответствует файлу ресурсов вашего приложения.
Для расчета DP:
dp = (ширина в пикселях * 160) / плотность экрана
Базовая сетка
Использование базовой сетки помогает обеспечить единообразное расстояние и выравнивание элементов пользовательского интерфейса. В Android UI для компоновки, компонентов и отступов используется сетка с шагом 8 dp.
Более мелкие элементы, такие как значки, текст и некоторые элементы внутри компонентов, лучше всего выравнивать по сетке с шагом 4 dp.
Сетки компоновки
Сетки — это основа любого макета. Учитывайте иерархию контента, его количество и даже смысл.
Иерархическая сетка
Иерархическая сетка создается с учетом иерархии или важности контента. Представьте себе макет газеты: главная статья занимает большую часть макета, а в меньшей колонке отображаются предыдущие статьи.
При адаптации к различным размерам экрана иерархическая компоновка может изменять свою структуру, размер и отображать ячейки сетки.
Модульная сетка
Модульная сетка состоит из одинаковых столбцов и строк, образуя прямоугольную сетку для выравнивания контента. Модульные сетки хорошо подходят для контента схожей важности и размера, например, для галереи карточек.
Адаптивная модульная сетка позволяет добавлять новые ячейки, а содержимое внутри них может прикрепляться к различным ячейкам сетки или переноситься на следующую строку. Ячейки сетки могут оставаться неизменными независимо от размера или изменять свой размер в зависимости от потребностей контента.
Сетка столбцов
Столбцы образуют сеточную структуру, обеспечивающую вертикальное разделение макета за счет разделения контента внутри основной области. Контент размещается в тех областях экрана, которые содержат столбцы. Для выравнивания контента используется базовая сетка, но при этом сохраняется гибкость в размерах.
Изучите основы настройки столбчатой сетки и применения контента в разделе «Основы компоновки» . Столбчатая сетка может адаптироваться к различным форм-факторам, изменяя размеры и количество столбцов в зависимости от размера экрана, а также позволяя масштабировать контент.
Размерные категории
Классы размеров окон — это набор заданных контрольных точек области просмотра, которые помогают проектировать, разрабатывать и тестировать адаптивные макеты приложений. Android делит классы размеров окон на 3: Compact, Medium и Expanded. Подробнее о классах размеров окон можно прочитать здесь.
Соотношение сторон
Соотношение сторон — это отношение ширины элемента к его высоте. Соотношение сторон записывается как ширина:высота.
Для обеспечения единообразия макета используйте одинаковые пропорции для таких элементов, как изображения, поверхности и размер экрана.
Для использования в пользовательском интерфейсе рекомендуются следующие соотношения сторон:
- 16:9
- 3:2
- 4:3
- 1:1
- 3:4
- 2:3