Skip to content

Instantly share code, notes, and snippets.

@danieloneill
Created June 25, 2015 17:05
Show Gist options
  • Save danieloneill/35a8df515eecbed8847d to your computer and use it in GitHub Desktop.
Save danieloneill/35a8df515eecbed8847d to your computer and use it in GitHub Desktop.
QML Pie (Quick and DIrty)
import QtQuick 2.0
import QtGraphicalEffects 1.0
Item {
id: slicePart
anchors.centerIn: parent
width: 200
height: 200
property real offset: 0.20
property real size: 0.3
property alias color: slice.color
Rectangle {
id: slice
visible: false;
radius: 100
anchors.fill: parent
color: '#aa8888';
}
Rectangle {
id: donutHole
color: 'transparent'
visible: false
radius: 100
anchors.centerIn: parent
width: parent.width * 0.80
height: parent.height * 0.80
border.width: parent.width * 0.20
border.color: 'black'
}
OpacityMask {
id: punchedOut
anchors.fill: parent
maskSource: donutHole
source: slice
visible: false
}
ConicalGradient {
id: angleShape
visible: false
angle: slicePart.offset * 360
anchors.fill: parent
gradient: Gradient {
GradientStop { position: 0.0; color: 'transparent' }
GradientStop { position: 0.0001; color: 'black' }
GradientStop { position: slicePart.size; color: 'black' }
GradientStop { position: slicePart.size + 0.0001; color: 'transparent' }
GradientStop { position: 1.0; color: 'transparent' }
}
}
OpacityMask {
id: sliceShaped
anchors.fill: parent
maskSource: angleShape
source: punchedOut
}
}
import QtQuick 2.4
import QtQuick.Window 2.0
import QtGraphicalEffects 1.0
Window {
width: 480
height: 480
PiePart {
offset: 0
size: 0.215
color: 'red'
anchors.centerIn: parent
}
PiePart {
offset: 0.22
size: 0.415
color: 'blue'
anchors.centerIn: parent
}
PiePart {
offset: 0.64
size: 0.355
color: 'green'
anchors.centerIn: parent
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment