Back to Qt.io
Contact Us Blog Download Qt

Column QML Type

열에 자식을 배치합니다. 더 보기...

Import Statement: import QtQuick
Inherits:

Item

속성

신호

방법

상세 설명

열은 하나의 열을 따라 하위 항목을 배치하는 유형입니다. 앵커를 사용하지 않고 일련의 항목을 세로로 배치하는 편리한 방법으로 사용할 수 있습니다.

아래는 다양한 크기의 직사각형 세 개가 포함된 열입니다:

Column {
    spacing: 2

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

열은 이러한 항목을 다음과 같이 자동으로 수직으로 배치합니다:

열 내의 항목이 visible 이 아니거나 너비 또는 높이가 0인 경우 항목이 배치되지 않고 열 내에서 표시되지 않습니다. 또한 열은 자동으로 자식을 세로로 배치하므로 열 내의 자식 항목은 y 위치를 설정하거나 top, bottom, anchors.verticalCenter, fill 또는 centerIn 앵커를 사용하여 세로로 앵커링해서는 안 됩니다. 이러한 작업을 수행해야 하는 경우 열을 사용하지 않고 항목을 배치하는 것이 좋습니다.

열의 항목은 Positioner 첨부 속성을 사용하여 열 내 위치에 대한 자세한 정보에 액세스할 수 있습니다.

열 및 기타 관련 포지셔너 유형 사용에 대한 자세한 내용은 항목 포지셔너를 참조하세요.

전환 사용

열은 항목이 열에 추가되거나 열 내에서 이동할 때 특정 전환을 사용하여 항목에 애니메이션을 적용합니다.

예를 들어 아래 열은 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 이 열 내에서 이동하고 파란색 Rectangle 에 move 전환이 자동으로 적용됩니다:

Row, Grid, Flow, Positioner, ColumnLayout, Qt Quick 예제 - 포지셔너를참조하세요 .

속성 문서

bottomPadding : real

leftPadding : real

padding : real

rightPadding : real

topPadding : real

이 프로퍼티는 콘텐츠 주위의 패딩을 유지합니다.


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 입니다.


메서드 문서

forceLayout()

열은 일반적으로 프레임당 한 번씩 자식의 위치를 지정합니다. 즉, 스크립트 블록 내부에서 기본 자식은 변경되었지만 그에 따라 열이 아직 업데이트되지 않았을 수 있습니다.

이 메서드는 열이 자식의 미결 변경 사항에 즉시 응답하도록 합니다.

참고: 일반적으로 메서드는 컴포넌트가 완료된 후에만 호출해야 합니다.


© 2025 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.