PathAttribute QML Type

Path의 특정 위치에 속성을 설정하는 방법을 지정합니다. 더 보기...

• 상속된 멤버를 포함한 모든 멤버 목록

속성

• name : string
• value : real

상세 설명

PathAttribute 객체를 사용하면 경로를 따라 위치한 다양한 지점에 대해 이름과 값으로 구성된 속성을 지정할 수 있습니다. 이러한 속성은 델리게이트에 '부착 속성(Attached Properties)'으로 노출됩니다. 경로를 따라 특정 지점에서의 속성 값은 해당 지점을 둘러싼 PathAttributes에서 보간되어 결정됩니다.

아래 예제는 경로 상단에서 항목의 크기를 30%로, 불투명도를 50%로 조정하고, 하단에서는 크기를 100%로, 불투명도를 100%로 설정한 경로를 보여줍니다. PathView 의 .iconScale 및 PathView 의 .iconOpacity 부착 속성을 사용하여 델리게이트의 크기와 불투명도를 설정하는 점에 유의하십시오.

import QtQuick

Rectangle {
    width: 240; height: 200

    Component {
        id: delegate
        Item {
            width: 80; height: 80
            scale: PathView.iconScale
            opacity: PathView.iconOpacity
            Column {
                Image { anchors.horizontalCenter: nameText.horizontalCenter; width: 64; height: 64; source: icon }
                Text { id: nameText; text: name; font.pointSize: 16 }
            }
        }
    }

    PathView {
        anchors.fill: parent
        model: ContactModel {}
        delegate: delegate
        path: Path {
            startX: 120; startY: 100
            PathAttribute { name: "iconScale"; value: 1.0 }
            PathAttribute { name: "iconOpacity"; value: 1.0 }
            PathQuad { x: 120; y: 25; controlX: 260; controlY: 75 }
            PathAttribute { name: "iconScale"; value: 0.3 }
            PathAttribute { name: "iconOpacity"; value: 0.5 }
            PathQuad { x: 120; y: 100; controlX: -20; controlY: 75 }
        }
    }
}

Path도 참조하십시오 .

속성 설명서

name : string

이 속성은 변경할 속성의 이름을 저장합니다.

이 속성은 델리게이트에서 PathView.<name> 형태로 사용할 수 있습니다.

"opacity"와 같은 기존 Item 속성 이름을 속성으로 사용하는 것이 허용된다는 점에 유의하십시오. 이는 경로 속성이 새로운 첨부 속성을 추가하며, 이 속성은 기존 속성과 전혀 충돌하지 않기 때문입니다.

value : real

이 속성은 속성의 값을 저장합니다.

지정된 값은 경로를 따라 항목의 시각적 모양을 조정하는 데 사용할 수 있습니다. 예를 들어, 다음 경로(Path)는 itemRotation이라는 속성을 지정하며, 이 속성의 값은 경로 시작 부분에서는 0이고, 끝 부분에서는 90입니다.

Path {
    startX: 0
    startY: 0
    PathAttribute { name: "itemRotation"; value: 0 }
    PathLine { x: 100; y: 100 }
    PathAttribute { name: "itemRotation"; value: 90 }
}

델리게이트에서 rotation 속성을 이 속성을 위해 생성된 첨부 속성 PathView.itemRotation에 바인딩할 수 있습니다.

Rectangle {
    width: 10; height: 10
    rotation: PathView.itemRotation
}

각 항목이 경로를 따라 배치되면 그에 따라 회전하게 됩니다. 즉, 경로의 시작 부분에 있는 항목은 회전되지 않고, 경로의 끝 부분에 있는 항목은 90도 회전하며, 경로 중간에 있는 항목은 45도 회전하게 됩니다.