QML类型：Column（列定位器）_qml 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 }
}

如果列中的项目不可见，或者它的宽度或高度为 0，则项目将不会被布置并且在列中也不可见。

由于 Column 会自动垂直定位其子项，因此 Column 内的子项不应使用 top、bottom、anchors.verticalCenter、fill、centerIn 这些锚点设置，也不应该设置 y 属性。如果需要执行这些操作，请考虑在不使用 Column 的情况下定位项目。

当项目被添加到列中或在列内移动时，列可以使用特定转换为项目设置动画。

    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
    }

二、属性成员

1、add : Transition

此属性保存要为添加到此定位器的项目运行的转换。这适用于：

• 创建定位器后作为定位器子项创建或重新设置父项的项目。
• 将 Item::visible 属性从 false 更改为 true 的子项。

2、move : Transition

此属性保存为在定位器内移动的项目运行的过渡。这适用于：

• 由于定位器中项目的添加、移除或重新排列而移位时会移动的子项目。
• 由于定位器中项目的大小调整而重新定位的子项目。

3、populate : 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 }
 
        populate : Transition
        {
            NumberAnimation { properties: "x,y"; duration: 1000 }
        }
    }

4、spacing : real

间距是相邻项目之间留空的像素量。默认间距为 0。

5、四周填充属性：

• bottomPadding : real
• leftPadding : real
• padding : real
• rightPadding : real
• topPadding : real

三、信号成员

1、positioningComplete()

当定位完成时发出该信号。

四、成员函数

1、forceLayout()

此方法强制 Column 立即响应其子项中的任何显着更改。

注意：方法一般只应在组件完成后调用。