Спросите помощника

0/400

Вопрос обрабатывается ИИ-сервисом и сохраняется для улучшения ответов. Не вводите персональные данные.

Stack

Накладывает дочерние элементы друг на друга. Используется для оверлеев, бейджей и наложения текста на изображения.

Тип: multi-child

Stack alignment:bottomLeft
  Image src:"https://example.com/bg.jpg" fit:cover
  Positioned bottom:12 left:12
    Text "Заголовок"

Параметры

Параметр	Тип	Default	Описание
`alignment`	string	topStart	Выравнивание непозиционированных дочерних: `topLeft` , `topCenter` , `topRight` , `centerLeft` , `center` , `centerRight` , `bottomLeft` , `bottomCenter` , `bottomRight`
`fit`	string	loose	Размер непозиционированных дочерних: `loose` , `expand` , `passthrough`
`clipBehavior`	string	hardEdge	Обрезка выходящих за границы: `none` , `hardEdge` , `antiAlias` , `antiAliasWithSaveLayer`

Positioned

Позиционирует дочерний элемент внутри Stack по абсолютным координатам.

Тип: single-child

Positioned top:10 right:10
  Text "Бейдж"

Параметры

Параметр	Тип	Описание
`top`	double	Отступ от верхнего края
`bottom`	double	Отступ от нижнего края
`left`	double	Отступ от левого края
`right`	double	Отступ от правого края
`width`	double	Ширина
`height`	double	Высота

Все параметры опциональны. Неуказанные стороны остаются свободными.

Примеры

Карточка с бейджем

SizedBox width:200 height:200
  Stack clipBehavior:none
    ColoredBox color:#36345E
    Positioned top:12 right:12
      DecoratedBox
        #decoration color:#FF4444
          #borderRadius circular 30
        Padding
          #padding symmetric horizontal:8 vertical:4
          Text "NEW"
            #style fontSize:12 color:#FFFFFF

Градиент поверх изображения

Stack
  SizedBox width:512 height:288
    Image src:"https://example.com/poster.jpg" fit:cover
  Positioned bottom:0 left:0 right:0 height:100
    DecoratedBox
      #decoration
        #gradient linear begin:bottomCenter end:topCenter
          #colors 0xFF000000 0x00000000

Stack

Параметры

Positioned

Параметры

Примеры

Карточка с бейджем

Градиент поверх изображения

See also