StyledItem QML Type

Renderiza un DelegateStyle. Más...

Import Statement:	`import Qt.labs.StyleKit`
Inherits:	Item

Lista de todos los miembros, incluidos los heredados

Propiedades

delegateStyle : DelegateStyle

Descripción detallada

StyledItem renderiza un DelegateStyle. Lee propiedades como color, border, gradient, y image, y crea internamente los elementos visuales correspondientes.

Si el delegate establecido en un DelegateStyle es null (por defecto), StyledItem se utilizará automáticamente para el renderizado.

Un delegate personalizado puede establecerse en cualquier Item. Pero combinado con un StyledItem, puede mantener el renderizado por defecto mientras añade efectos de sobreimpresión, subimpresión o sombreado. El siguiente fragmento muestra cómo dibujar un elemento adicional sobre el delegado predeterminado:

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

Nota: No se garantiza que los tipos de los módulos Qt.labs sigan siendo compatibles en futuras versiones.

Para ver más ejemplos de superposiciones, subcapas y efectos de sombreado, consulta el Ejemplo de StyleKit.

Véase también DelegateStyle, delegate, y data.

Documentación de propiedades

delegateStyle : DelegateStyle

La dirección DelegateStyle que muestra este elemento.

Esta propiedad es obligatoria. Cuando StyledItem es el elemento raíz de delegate, se establece automáticamente. Pero cuando se utiliza como elemento secundario dentro de un delegado personalizado, debe establecerse explícitamente.

El siguiente fragmento de código utiliza un delegado personalizado que dibuja una estrella debajo del control deslizante predeterminado. Como el elemento raíz no es un StyledItem, declara una propiedad obligatoria delegateStyle (que se asigna automáticamente), y la reenvía al elemento hijo 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
        }
    }
}

Ver también DelegateStyle, delegate, y 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.