import QtQuick 2.0
import QtQuick.Controls 1.0
import HsQML.Canvas 1.0
Column {
width: 500;
Item {
width: 500; height: 500;
Rectangle {
anchors.top: parent.top; anchors.left: parent.left;
anchors.topMargin: 50; anchors.leftMargin: 50;
width: 100; height: 100; color: "black";
Text {
anchors.centerIn: parent; font.pixelSize: 30;
text: "Below"; color: "white";
}
}
HaskellCanvas {
id: canvas;
x: 125; y: 125;
width: 250; height: 250;
delegate: myDelegate;
model: t;
property real t; // Can't animate model directly
SequentialAnimation on t {
paused: modelAnimationOff.checked;
loops: Animation.Infinite;
NumberAnimation {
from: 0; to: 1; duration: 2500;
}
NumberAnimation {
from: 1; to: 0; duration: 2500;
}
}
PathAnimation {
target: canvas;
running: true;
paused: sgAnimationOff.checked;
loops: Animation.Infinite;
duration: 5000;
orientation: PathAnimation.Fixed;
anchorPoint: Qt.point(canvas.width/2, canvas.height/2);
path: Path {
startX: 250; startY: 250;
PathLine { x: 200; y: 200; }
PathLine { x: 200; y: 300; }
PathLine { x: 300; y: 300; }
PathLine { x: 300; y: 200; }
PathLine { x: 250; y: 250; }
}
}
}
Rectangle {
anchors.top: parent.top; anchors.right: parent.right;
anchors.topMargin: 50; anchors.rightMargin: 50;
width: 100; height: 100; color: "black";
Text {
anchors.centerIn: parent; font.pixelSize: 30;
text: "Above"; color: "white";
}
}
}
GroupBox {
title: "Display Mode";
Row {
ExclusiveGroup {id: displayModeGrp;}
RadioButton {
text: "Above";
exclusiveGroup: displayModeGrp;
onCheckedChanged: {
if (checked) canvas.displayMode = HaskellCanvas.Above;}
}
RadioButton {
text: "Inline";
exclusiveGroup: displayModeGrp;
checked: true;
onCheckedChanged: {
if (checked) canvas.displayMode = HaskellCanvas.Inline;}
}
RadioButton {
text: "Below";
exclusiveGroup: displayModeGrp;
onCheckedChanged: {
if (checked) canvas.displayMode = HaskellCanvas.Below;}
}
}
}
GroupBox {
title: "Model Animation (Colour)";
Row {
ExclusiveGroup {id: modelAnimationGrp;}
RadioButton {
text: "On";
exclusiveGroup: modelAnimationGrp;
checked: true;
}
RadioButton {
id: modelAnimationOff;
text: "Off";
exclusiveGroup: modelAnimationGrp;
}
}
}
GroupBox {
title: "Scenegraph Animation (Position)";
Row {
ExclusiveGroup {id: sgAnimationGrp;}
RadioButton {
text: "On";
exclusiveGroup: sgAnimationGrp;
checked: true;
}
RadioButton {
id: sgAnimationOff;
text: "Off";
exclusiveGroup: sgAnimationGrp;
}
}
}
}