Back to Qt.io
Contact Us Blog Download Qt

PathAttribute QML Type

Path 内の与えられた位置に属性を設定する方法を指定します。詳細...

Import Statement: import QtQuick

プロパティ

詳細説明

PathAttribute オブジェクトは、名前と値から成る属性をパスに沿った様々なポイントに対して指定することを可能にする。属性はAttached Properties としてデリゲートに公開されます。パスに沿った任意の特定の点における属性の値は、その点を囲む PathAttributes から補間されます。

下の例は、パスの上部で不透明度 50% でアイテムが 30% に拡大縮小され、下部で不透明度 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 }
        }
    }
}

(上記のContactModelに使用されているContactModel.qmlの仕様については、PathView のドキュメントを参照してください)。

Pathも参照してください 。

プロパティ ドキュメント

name : string

このプロパティは、変更する属性の名前を保持します。

この属性はPathView.<name> としてデリゲートに提供されます。

opacity "のような既存のItemプロパティ名を属性として使用することが許可されていることに注意してください。これは、パス属性が既存のプロパティと衝突することなく、新しいAttached Propertyを追加するためです。


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 }
}

デリゲートでは、この属性のために作成されたアタッチドプロパティ PathView.itemRotationに 回転プロパティをバインドすることができます。

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

各アイテムがパスに沿って配置されると、それに応じて回転されます：パスの始点にあるアイテムは回転されず、パスの終点にあるアイテムは90度回転され、パスの途中にあるアイテムは45度回転されます。


© 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.