Тип QML Column

Располагает своих дочерние элементы в столбце. Подробнее...

• Список всех членов, включая унаследованные

Свойства

• add : Переход
• bottomPadding : вещественное число
• leftPadding : вещественное число
• move : Переход
• padding : вещественное число
• populate : Переход
• rightPadding : вещественное число
• spacing : вещественное число
• topPadding : вещественное число

Сигналы

• positioningComplete()

Методы

• forceLayout()

Подробное описание

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

Ниже представлен Column, содержащий три прямоугольника различных размеров:

Column {
    spacing: 2

    Rectangle { color: "red"; width: 50; height: 50 }
    Rectangle { color: "green"; width: 20; height: 50 }
    Rectangle { color: "blue"; width: 50; height: 20 }
}

Column автоматически располагает эти элементы в вертикальном формате, как показано ниже:

Если элемент внутри Column не видим или имеет ширину или высоту 0, элемент не будет выложен и не будет виден в столбце. Кроме того, поскольку Column автоматически располагает свои дочерние элементы вертикально, дочерний элемент внутри Column не должен устанавливать своё положение по оси y или вертикально привязываться с помощью якорей top, bottom, anchors.verticalCenter, fill или centerIn. Если вам необходимо выполнить эти действия, рассмотрите возможность размещения элементов без использования Column.

Обратите внимание, что элементы в Column могут использовать свойство Positioner для получения дополнительной информации о своём положении внутри Column.

Дополнительную информацию об использовании Column и других типах позиционеров см. в разделе Позиционеры элементов.

Использование переходов

Column анимирует элементы, используя определённые переходы, когда элементы добавляются или перемещаются внутри Column.

Например, в Column ниже свойство move задано для определённого Перехода:

Column {
    spacing: 2

    Rectangle { color: "red"; width: 50; height: 50 }
    Rectangle { id: greenRect; color: "green"; width: 20; height: 50 }
    Rectangle { color: "blue"; width: 50; height: 20 }

    move: Transition {
        NumberAnimation { properties: "x,y"; duration: 1000 }
    }

    focus: true
    Keys.onSpacePressed: greenRect.visible = !greenRect.visible
}

При нажатии клавиши Пробел значение visible зелёного Прямоугольника переключается. Когда он появляется и исчезает, синий Прямоугольник перемещается внутри Column, и переход move автоматически применяется к синему Прямоугольнику:

См. также Row, Grid, Flow, Positioner, ColumnLayout и Примеры Qt Quick — Позиционеры.

Документация по свойствам

add : Переход

Это свойство содержит переход, который будет выполнен для элементов, добавляемых в этот позиционер. Для позиционера это относится к:

• Элементам, созданным или переродившимся как дочерние элементы позиционера после создания позиционера
• Дочерним элементам, которые изменяют свойство Item::visible с false на true и, следовательно, теперь видны

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

Примечание: Этот переход не применяется к элементам, которые уже являются частью позиционера на момент его создания. В этом случае применяется переход populate.

См. также populate, ViewTransition и Примеры Qt Quick — Позиционеры.

bottomPadding : вещественное число

Эти свойства хранят отступы вокруг содержимого.

Это свойство было добавлено в Qt 5.6.

leftPadding : вещественное число

Эти свойства хранят отступы вокруг содержимого.

Это свойство было добавлено в Qt 5.6.

move : Переход

Это свойство содержит переход, который будет выполняться для элементов, которые были перемещены внутри позиционера. Для позиционера это относится к:

• Дочерним элементам, которые перемещаются, когда они смещаются из-за добавления, удаления или перестановки других элементов в позиционере
• Дочерним элементам, которые переупорядочиваются из-за изменения размеров других элементов в позиционере

Переход может использовать свойство ViewTransition для получения более подробной информации об элементе, который перемещается. Однако обратите внимание, что для этого перехода перемещения списки ViewTransition.targetIndexes и ViewTransition.targetItems устанавливаются только при возникновении этого перехода из-за добавления других элементов в позиционер; в других случаях эти списки будут пустыми. Дополнительную информацию и примеры использования этих переходов см. в документации по ViewTransition.

См. также add, populate, ViewTransition и Примеры Qt Quick — Позиционеры.

padding : вещественное число

Эти свойства хранят отступы вокруг содержимого.

Это свойство было добавлено в Qt 5.6.

populate : Переход

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

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

См. также add, ViewTransition и Примеры Qt Quick — Позиционеры.

rightPadding : вещественное число

Эти свойства хранят отступы вокруг содержимого.

Это свойство было добавлено в Qt 5.6.

spacing : вещественное число

Отступ — это количество пикселей, оставляемых пустым между смежными элементами. Значение по умолчанию — 0.

См. также Grid::spacing.

topPadding : вещественное число

Эти свойства хранят отступы вокруг содержимого.

Это свойство было добавлено в Qt 5.6.

Документация по сигналам

positioningComplete()

Этот сигнал излучается при завершении позиционирования.

Соответствующий обработчик — onPositioningComplete.

Этот сигнал был добавлен в Qt 5.9.

Документация по методам

forceLayout()

Column обычно размещает свои дочерние элементы один раз за кадр. Это означает, что внутри блоков скрипта возможны изменения в дочерних элементах, но Column ещё не был обновлён соответствующим образом.

Этот метод заставляет Column немедленно отреагировать на любые ожидающие изменения в его дочерних элементах.

Примечание: методы в целом должны вызываться только после завершения компонента.

Этот метод был добавлен в Qt 5.9.