Тип QML Column

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

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

Свойства

• add : Transition
• bottomPadding : real
• leftPadding : real
• move : Transition
• padding : real
• populate : Transition
• rightPadding : real
• spacing : real
• topPadding : real

Сигналы

• 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 задано для определенного Transition:

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 зелёного Rectangle переключается. Когда он появляется и исчезает, синий Rectangle перемещается внутри Column, и переход move автоматически применяется к синему Rectangle:

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

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

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

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

add : Transition

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

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

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

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

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

move : Transition

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

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

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

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

populate : Transition

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

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

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

spacing : real

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

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

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

positioningComplete()

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

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

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

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

forceLayout()

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

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

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

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