StackPanel

Контейнер в виде стека элементов.

Description

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

Если ширина и высота всех дочерних элементов фиксирована, размеры стека определяются с использованием следующих правил:
при горизонтальной ориентации высота стека равна высоте самого высокого дочернего элемента, а ширина равна сумме широт всех дочерних элементов;
при вертикальной ориентации высота стека равна сумме высот всех дочерних элементов, а ширина равна ширине самого широкого дочернего элемента.

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

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

Extends

Container

Syntax

new StackPanel(parent, viewMode)

Parameters

Name Type Default Description
parent Element Родительский элемент
viewMode String ‘Base’ Строка со значением режима отображения. Возможные значения: ‘Base’, ‘FormGroup’. Отличие ‘FormGroup’ от ‘Base’ в том, что между элементами добавляются отступы

Events

Нет

StackPanel.metadata

Метаданные типа StackPanel.

Properties

Name Type Default Description
ViewMode String Режим отображения. Может принимать значения: ‘Base’, ‘FormGroup’.
Orientation StackPanelOrientation ‘Vertical’ Ориентация стека элементов

Examples

//infinni-ui-demo
{
  "Items": [
  //infinni-ui-display-begin
{
  "StackPanel": {
    "ViewMode": "Base",
    "Orientation": "Horizontal",
    "Items": [
      {
        "Label": {
          "Value": "One"
        }
      },
      {
        "Label": {
          "Value": "Two"
        }
      },
      {
        "Label": {
          "Value": "Three"
        }
      }
    ]
  }
},
{
  "StackPanel": {
    "ViewMode": "FormGroup",
    "Orientation": "Horizontal",
    "Items": [
      {
        "Label": {
          "Value": "One"
        }
      },
      {
        "Label": {
          "Value": "Two"
        }
      },
      {
        "Label": {
          "Value": "Three"
        }
      }
    ]
  }
}
    //infinni-ui-display-end
  ]
}