Revision control
Copy as Markdown
// Copyright (C) 2026 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial OR BSD-3-Clause
import QtQuick
import QtQuick.Shapes
import Qt.labs.StyleKit
ApplicationWindow {
id: app
width: 1024
height: 800
visible: true
StyleKit.style:
//! [underlay]
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 {
// Since the root item is not a StyledItem, the following
// required properties must be defined explicitly:
required property DelegateStyle delegateStyle
required property QtObject control
implicitWidth: delegateStyle.width
implicitHeight: delegateStyle.height
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 {
// Forward delegateStyle into StyledItem. StyledItem doesn't
// use 'control' for anything, so it can be omitted.
delegateStyle: parent.delegateStyle
}
}
}
//! [underlay]
// The rest of the file is not a part of the docs. It just implements a small
// UI to allow testing the style from the command line using the 'qml' app.
GroupBox {
title: "GroupBox"
Column {
spacing: 10
Button {
text: "Button"
}
Slider {
width: 200
}
}
}
}