Back to Qt.io
Contact Us Blog Download Qt
このページでは

StyledItem QML Type

DelegateStyle... 続きを読む

Import Statement: import Qt.labs.StyleKit
Inherits:

Item

プロパティ

詳細説明

StyledItemは、DelegateStyle をレンダリングします。color 、border 、gradient 、image などのプロパティを読み取り、対応するビジュアル要素を内部的に作成します。

DelegateStyle に設定されたdelegate がnull （デフォルト）の場合、StyledItem は自動的にレンダリングに使用されます。

カスタムdelegate は任意のItemに設定できます。しかし、StyledItemと組み合わせることで、オーバーレイ、アンダーレイ、シェーダー効果を追加しながら、デフォルトのレンダリングを保持することができます。次のスニペットは、デフォルトのデリゲートの上に追加のItemを描画する方法を示しています：

Style {
    component Star : Shape {
        id: star
        property color color
        ShapePath {
            fillColor: star.color
            scale: Qt.size(star.width, star.height)
            PathMove { x: 0.50; y: 0.00 }
            PathLine { x: 0.59; y: 0.35 }
            PathLine { x: 0.97; y: 0.35 }
            PathLine { x: 0.66; y: 0.57 }
            PathLine { x: 0.78; y: 0.91 }
            PathLine { x: 0.50; y: 0.70 }
            PathLine { x: 0.22; y: 0.91 }
            PathLine { x: 0.34; y: 0.57 }
            PathLine { x: 0.03; y: 0.35 }
            PathLine { x: 0.41; y: 0.35 }
            PathLine { x: 0.50; y: 0.00 }
        }
    }

    button {
        background.delegate: StyledItem {
            width: parent.width
            height: parent.height
            // Draw a star on top the default rendering
            Star {
                anchors.fill: parent
                color: "gold"
            }
        }
    }
}

注意： Qt.lab モジュールの型は、将来のバージョンでも互換性が保たれることを保証するものではありません。

オーバーレイ、アンダーレイ、シェーダー効果の例については、StyleKit Exampleを参照してください。

DelegateStyle 、delegate 、dataも参照して ください。

プロパティ・ドキュメント

delegateStyle : DelegateStyle

このアイテムがレンダリングするDelegateStyle 。

このプロパティは必須である。StyledItem がdelegate のルートアイテムの場合、自動的に設定されます。しかし、カスタムデリゲート内の子として使用する場合は、明示的に設定する必要があります。

以下のスニペットは、デフォルトのスライダーハンドルの下に星を描くカスタムデリゲートを使用しています。ルートアイテムはStyledItem ではないので、必須プロパティdelegateStyle を宣言し（これは自動的に割り当てられます）、子StyledItem に転送します：

Style {
    component Star : Shape {
        id: star
        property color color
        ShapePath {
            fillColor: star.color
            scale: Qt.size(star.width, star.height)
            PathMove { x: 0.50; y: 0.00 }
            PathLine { x: 0.59; y: 0.35 }
            PathLine { x: 0.97; y: 0.35 }
            PathLine { x: 0.66; y: 0.57 }
            PathLine { x: 0.78; y: 0.91 }
            PathLine { x: 0.50; y: 0.70 }
            PathLine { x: 0.22; y: 0.91 }
            PathLine { x: 0.34; y: 0.57 }
            PathLine { x: 0.03; y: 0.35 }
            PathLine { x: 0.41; y: 0.35 }
            PathLine { x: 0.50; y: 0.00 }
        }
    }

    slider.handle.delegate: Item {
        required property DelegateStyle delegateStyle

        implicitWidth: delegateStyle.implicitWidth
        implicitHeight: delegateStyle.implicitHeight
        width: parent.width
        height: parent.height
        scale: delegateStyle.scale
        rotation: delegateStyle.rotation
        visible: delegateStyle.visible

        // Draw a star underneath the default handle delegate
        Star {
            width: parent.width * 2
            height: parent.height * 2
            anchors.centerIn: parent
            color: "gold"
        }

        StyledItem {
            delegateStyle: parent.delegateStyle
        }
    }
}

DelegateStyle 、delegate 、dataも参照してください 。

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