Column QML Type

将子元素排列成一列。更多...

• 所有成员的列表，包括继承的成员

属性

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

信号

• positioningComplete()

方法

• void 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 中的某个项目未设置 `visible`，或者其宽度或高度为 0，则该项目将不会被布局，且在 Column 中不可见。 此外，由于“列”会自动将子项垂直排列，因此“列”中的子项不应设置其y 位置，也不应使用top 、bottom 、anchors.verticalCenter 、fill 或centerIn 锚点进行垂直定位。若需执行这些操作，请考虑在不使用“列”的情况下手动定位这些项。

请注意，列中的项目可以使用Positioner 附加属性来获取其在列内位置的更多信息。

有关使用 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
}

按下空格键时，绿色Rectangle 的 `visible ` 值会发生切换。当它出现和消失时，蓝色Rectangle 会在 Column 内移动，并且 `move ` 过渡效果会自动应用于蓝色Rectangle ：

另请参阅 Row 、Grid 、Flow 、Positioner 、ColumnLayout 以及Qt Quick 示例 - 定位器。

属性文档

add : Transition

该属性用于存储添加到此定位器中的项目应执行的过渡效果。对于定位器而言，这适用于：

• 在定位器创建后，作为其子项被创建或重新关联的项
• 将Item::visible 属性从false更改为true，从而变为可见状态的子项

该过渡效果可使用 `ViewTransition ` 属性来获取有关正在添加的项的更多详细信息。有关使用这些过渡效果的更多详细信息和示例，请参阅ViewTransition 文档。

另请参阅 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 。

Signal 文档

positioningComplete()

当定位完成时，会发出此信号。

方法文档

void forceLayout()

Column 通常每帧对子元素进行一次定位。这意味着在脚本块内部，底层子元素可能已经发生变化，但 Column 尚未相应地更新。

此方法可强制 Column 立即响应其子元素中任何尚未处理的更改。

注意：通常情况下，方法应在组件完成处理后才调用。