Doc: Add an example customization for an indeterminate ProgressBar
The indeterminate state for a ProgressBar control was not mentioned
in the customization documentation. Adapt an animation from the old
Qt Quick Controls 1 customization and link to the indeterminate
property documentation.
Fixes: QTBUG-116306
Pick-to: 6.6 6.5
Change-Id: I56d2c7fe4b326637806edd85d40be040b7fdb3f6
Reviewed-by: Mitch Curtis <mitch.curtis@qt.io>
(cherry picked from commit 57f5f462fc
)
Reviewed-by: Qt Cherry-pick Bot <cherrypick_bot@qt-project.org>
This commit is contained in:
parent
1e21dc3326
commit
38f167d3c6
|
@ -21,11 +21,40 @@ ProgressBar {
|
||||||
implicitWidth: 200
|
implicitWidth: 200
|
||||||
implicitHeight: 4
|
implicitHeight: 4
|
||||||
|
|
||||||
|
// Progress indicator for determinate state.
|
||||||
Rectangle {
|
Rectangle {
|
||||||
width: control.visualPosition * parent.width
|
width: control.visualPosition * parent.width
|
||||||
height: parent.height
|
height: parent.height
|
||||||
radius: 2
|
radius: 2
|
||||||
color: "#17a81a"
|
color: "#17a81a"
|
||||||
|
visible: !control.indeterminate
|
||||||
|
}
|
||||||
|
|
||||||
|
// Scrolling animation for indeterminate state.
|
||||||
|
Item {
|
||||||
|
anchors.fill: parent
|
||||||
|
visible: control.indeterminate
|
||||||
|
clip: true
|
||||||
|
|
||||||
|
Row {
|
||||||
|
spacing: 20
|
||||||
|
|
||||||
|
Repeater {
|
||||||
|
model: control.width / 40 + 1
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
color: "#17a81a"
|
||||||
|
width: 20
|
||||||
|
height: control.height
|
||||||
|
}
|
||||||
|
}
|
||||||
|
XAnimator on x {
|
||||||
|
from: 0
|
||||||
|
to: -40
|
||||||
|
loops: Animation.Infinite
|
||||||
|
running: control.indeterminate
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -761,6 +761,9 @@
|
||||||
|
|
||||||
\snippet qtquickcontrols-progressbar-custom.qml file
|
\snippet qtquickcontrols-progressbar-custom.qml file
|
||||||
|
|
||||||
|
Above, the content item is also animated to represent an
|
||||||
|
\l {ProgressBar::}{indeterminate} progress bar state.
|
||||||
|
|
||||||
|
|
||||||
\section2 Customizing RadioButton
|
\section2 Customizing RadioButton
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue