Расположение и размеры элементов

Размеры

Типы определения размера

Регулировать размеры элементов в карточке можно с помощью параметров width и height элемента container. Они принимают одно из значений size:

match_parent — значение по умолчанию для ширины, элемент подстраивается под содержащий его блок;
wrap_content — значение по умолчанию для высоты, элемент подстраивается под свое содержимое;
fixed — фиксированное значение размера.

Чтобы элемент занимал половину высоты или располагался внизу контейнера, используйте match_parent. Алгоритм распределяет место в таком порядке:

Место занимают элементы со значениями размера fixed и wrap_content.
Оставшееся место делят элементы со значением размера match_parent. По умолчанию все элементы со значением размера match_parent поделят место поровну или распределят его согласно значению параметра weight, если он указан.

Посмотреть интерактивный пример

Единицы измерения размера

Примечание

Единица измерения sp используется только на Android.

Если используется тип fixed, то результат зависит от единиц измерения:

dp (density-independent pixels) — стандартная единица измерения размеров, которая используется по умолчанию и не зависит от плотности экрана;
sp (scale-independent pixels) — единица измерения, которая зависит от коэффициента размера текста в телефоне.

Если в элементе есть текст, указывайте высоту в sp, чтобы блок масштабировался вместе с текстом. Если текст не помещается, используйте dp.

Границы элемента

Для определения рамок у элементов используются параметры paddings и margins элемента container:

paddings — расстояние от контента карточки до ее границ;
margins — расстояние от границ карточки до других элементов и границ контейнера. Не влияет на размер самой карточки.

Выравнивание

Для выравнивания внутри элементов по горизонтали и вертикали используются следующие параметры элемента container:

alignment_horizontal — выравнивание по горизонтали. Может принимать значения left, center, right. Внутри горизонтально выравненного контейнера можно выравнивать только по вертикали, т. е. применять content_alignment_vertical со значениями left (по умолчанию), center, right.
alignment_vertical — выравнивание по вертикали. Может принимать значения top, center, bottom. Внутри вертикально выравненного контейнера можно выравнивать по горизонтали, т. е. применять content_alignment_horizontal со значениями top (по умолчанию), center, bottom.

Если внутри контейнера указать выравнивание, например content_alignment_horizontal, то дочерние элементы наследуют этот параметр. Если значения указаны в дочерних, то они будут переопределены.

Посмотреть интерактивный пример

Узнать больше

Следите за новостями DivKit в Telegram-канале: http://t.me/divkit_news

Также вы можете обсуждать интересующие вас темы в сообществе пользователей DivKit в Telegram: https://t.me/divkit_community_ru

Репозиторий DivKit