diff options
Diffstat (limited to 'basicsuite/Qt5Everywhere/demos/canvasclock/canvasClock.qml')
-rw-r--r-- | basicsuite/Qt5Everywhere/demos/canvasclock/canvasClock.qml | 404 |
1 files changed, 0 insertions, 404 deletions
diff --git a/basicsuite/Qt5Everywhere/demos/canvasclock/canvasClock.qml b/basicsuite/Qt5Everywhere/demos/canvasclock/canvasClock.qml deleted file mode 100644 index e2b3bb0..0000000 --- a/basicsuite/Qt5Everywhere/demos/canvasclock/canvasClock.qml +++ /dev/null @@ -1,404 +0,0 @@ -/**************************************************************************** -** -** Copyright (C) 2013 Digia Plc and/or its subsidiary(-ies). -** Contact: http://www.qt-project.org/legal -** -** This file is part of the examples of the Qt Toolkit. -** -** $QT_BEGIN_LICENSE:BSD$ -** You may use this file under the terms of the BSD license as follows: -** -** "Redistribution and use in source and binary forms, with or without -** modification, are permitted provided that the following conditions are -** met: -** * Redistributions of source code must retain the above copyright -** notice, this list of conditions and the following disclaimer. -** * Redistributions in binary form must reproduce the above copyright -** notice, this list of conditions and the following disclaimer in -** the documentation and/or other materials provided with the -** distribution. -** * Neither the name of Digia Plc and its Subsidiary(-ies) nor the names -** of its contributors may be used to endorse or promote products derived -** from this software without specific prior written permission. -** -** -** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS -** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT -** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR -** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT -** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, -** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT -** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, -** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY -** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT -** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE -** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE." -** -** $QT_END_LICENSE$ -** -****************************************************************************/ - -import QtQuick 2.0 - -Rectangle { - id: root - anchors.fill: parent - property color rimColor: Qt.rgba(1,0,0,1) //'#ff0000' - property color dialColor: Qt.rgba(0.2,0.2,0.2,1) //'#333333' - property color bgcolor: Qt.rgba(1,1,1,1) - property int dialStyle: 0 - color: "#333333" - - Text{ - id: codeText - anchors {fill:parent} - text: "" - rotation: 10 - color: "#666666" - font.pixelSize: root.height*.05 - - verticalAlignment:Text.AlignBottom - - property int pos: 0 - - property string code: " -var ctx = clockCanvas.getContext('2d') -ctx.clearRect(0,0,clockContainer.clockRadius,clockContainer.clockRadius) - -var gradient = ctx.createRadialGradient(clockContainer.clockRadius/4, clockContainer.clockRadius/4, 0, clockContainer.clockRadius/4, clockContainer.clockRadius/4, clockContainer.clockRadius) -gradient.addColorStop(0, '#ffffff') -gradient.addColorStop(1, '#888888') - -ctx.fillStyle = gradient -ctx.arc(clockContainer.clockRadius/2, clockContainer.clockRadius/2, clockContainer.clockRadius*.475, 0, 360, false) -ctx.fill() - -drawDials(ctx) - -var gradient2 = ctx.createLinearGradient(0, 0, clockContainer.clockRadius, clockContainer.clockRadius) -gradient2.addColorStop(0, Qt.rgba(0,0,0,.5)) -gradient2.addColorStop(.5, Qt.rgba(1,1,1,.5)) -gradient2.addColorStop(1, Qt.rgba(0,0,0,.5)) - -var gradient3 = ctx.createLinearGradient(0, 0, clockContainer.clockRadius, clockContainer.clockRadius) -gradient3.addColorStop(0, Qt.rgba(1,1,1,.5)) -gradient3.addColorStop(.5, Qt.rgba(0,0,0,.5)) -gradient3.addColorStop(1, Qt.rgba(1,1,1,.5)) - -ctx.lineWidth = clockContainer.clockRadius*.05 -ctx.strokeStyle = root.rimColor - -ctx.beginPath() -ctx.arc(clockContainer.clockRadius/2, clockContainer.clockRadius/2, clockContainer.clockRadius*.45, 0, 360, false) -ctx.stroke() - -ctx.strokeStyle = gradient2 -ctx.arc(clockContainer.clockRadius/2, clockContainer.clockRadius/2, clockContainer.clockRadius*.45, 0, 360, false) -ctx.stroke() - -ctx.beginPath() -ctx.strokeStyle = root.rimColor -ctx.arc(clockContainer.clockRadius/2, clockContainer.clockRadius/2, clockContainer.clockRadius*.475, 0, 360, false) -ctx.stroke() - -ctx.strokeStyle = gradient3 -ctx.arc(clockContainer.clockRadius/2, clockContainer.clockRadius/2, clockContainer.clockRadius*.475, 0, 360, false) -ctx.stroke() -ctx.closePath() - -function drawPointer(context, angle, len, thickness, color){ - context.beginPath() - context.lineWidth = thickness - context.strokeStyle = color - context.moveTo(clockContainer.clockRadius/2, clockContainer.clockRadius/2) - var x1=Math.cos(angle*0.01745)*len - var y1=Math.sin(angle*0.01745)*len - context.lineTo(clockContainer.clockRadius/2+.5+x1,clockContainer.clockRadius/2+.5+y1) - context.stroke() - context.closePath() -}" - - Timer{ - id: textTimer - interval: 10 - onTriggered: { - codeText.pos++ - if (codeText.pos >= codeText.code.length)codeText.pos=0 - codeText.text+=codeText.code.charAt(codeText.pos) - if (codeText.text.length >1000){ - codeText.text=codeText.text.substring(codeText.text.length-1000) - } - } - repeat: true - running: true - } - } - - Rectangle { - anchors.fill: parent - gradient: Gradient { - GradientStop {position: .0; color :"black"} - GradientStop {position: .5; color :"transparent"} - GradientStop {position: 1.0; color :"black"} - - } - opacity: .5 - } - - Item { - id: clockContainer - width: 2* Math.min(root.width*.8, root.height*.8) - height: width - scale: 0.5 - anchors.centerIn: parent - property int clockRadius: width - - ShaderEffectSource{ - id: clockBg - anchors.fill: parent - sourceItem: clockCanvas - hideSource: true - live: false - } - - Canvas { - id: clockCanvas - anchors.fill: parent - onPaint: { - var ctx = clockCanvas.getContext('2d') - - ctx.clearRect(0,0,clockContainer.clockRadius,clockContainer.clockRadius) - - var gradient = ctx.createRadialGradient(clockContainer.clockRadius/4, clockContainer.clockRadius/4, 0, clockContainer.clockRadius/4, clockContainer.clockRadius/4, clockContainer.clockRadius) - - ctx.fillStyle = root.bgcolor - ctx.arc(clockContainer.clockRadius/2, clockContainer.clockRadius/2, clockContainer.clockRadius*.475, 0, 360, false) - ctx.fill() - - gradient.addColorStop(0, Qt.rgba(0,0,0,0)) - gradient.addColorStop(1, Qt.rgba(0,0,0,.5)) - - ctx.fillStyle = gradient - ctx.arc(clockContainer.clockRadius/2, clockContainer.clockRadius/2, clockContainer.clockRadius*.475, 0, 360, false) - ctx.fill() - - drawDials(ctx) - - var gradient2 = ctx.createLinearGradient(0, 0, clockContainer.clockRadius, clockContainer.clockRadius) - gradient2.addColorStop(0, Qt.rgba(0,0,0,.5)) - gradient2.addColorStop(.5, Qt.rgba(1,1,1,.5)) - gradient2.addColorStop(1, Qt.rgba(0,0,0,.5)) - - var gradient3 = ctx.createLinearGradient(0, 0, clockContainer.clockRadius, clockContainer.clockRadius) - gradient3.addColorStop(0, Qt.rgba(1,1,1,.5)) - gradient3.addColorStop(.5, Qt.rgba(0,0,0,.5)) - gradient3.addColorStop(1, Qt.rgba(1,1,1,.5)) - - ctx.lineWidth = clockContainer.clockRadius*.05 - - ctx.strokeStyle = root.rimColor - ctx.beginPath() - ctx.arc(clockContainer.clockRadius/2, clockContainer.clockRadius/2, clockContainer.clockRadius*.45, 0, 360, false) - ctx.stroke() - - ctx.strokeStyle = gradient2 - ctx.arc(clockContainer.clockRadius/2, clockContainer.clockRadius/2, clockContainer.clockRadius*.45, 0, 360, false) - ctx.stroke() - - ctx.beginPath() - ctx.strokeStyle = root.rimColor - ctx.arc(clockContainer.clockRadius/2, clockContainer.clockRadius/2, clockContainer.clockRadius*.475, 0, 360, false) - ctx.stroke() - - ctx.strokeStyle = gradient3 - - ctx.arc(clockContainer.clockRadius/2, clockContainer.clockRadius/2, clockContainer.clockRadius*.475, 0, 360, false) - ctx.stroke() - ctx.closePath() - - - clockBg.scheduleUpdate() - } - - function drawDials(context){ - - context.strokeStyle = "#888888" - context.fillStyle = root.dialColor - context.lineWidth = 2 - context.beginPath() - for (var i=1; i<=60; i++){ - var x1=Math.cos(((i)*6)*0.01745)*clockContainer.clockRadius*.4 - var y1=Math.sin(((i)*6)*0.01745)*clockContainer.clockRadius*.4 - - var x2=Math.cos(((i)*6)*0.01745)*clockContainer.clockRadius*.45 - var y2=Math.sin(((i)*6)*0.01745)*clockContainer.clockRadius*.45 - - context.moveTo(clockContainer.clockRadius/2+.5+x1,clockContainer.clockRadius/2+.5+y1) - context.lineTo(clockContainer.clockRadius/2+.5+x2,clockContainer.clockRadius/2+.5+y2) - context.stroke() - } - context.closePath() - - context.beginPath() - - var romans = ['I','II', 'III', 'IV', 'V', 'VI', 'VII', 'VIII', 'IX', 'X', 'XI', 'XII'] - - for (i=1; i<=12; i++){ - x1=Math.cos((-90+(i)*30)*0.01745)*clockContainer.clockRadius*.35 -clockContainer.width*0.03 - y1=Math.sin((-90+(i)*30)*0.01745)*clockContainer.clockRadius*.35 +clockContainer.height*0.04 - - if (root.dialStyle === 1) x1-=clockContainer.width*0.01 - - context.font = 'bold '+Math.floor(clockContainer.width*.1)+'px Arial' - - - if (i >= 10) - x1 -= clockContainer.width*0.02 - context.textAlign = 'center'; - context.textBaseline = 'middle' - - var dial = i - - if (root.dialStyle === 1) dial = romans[i-1] - context.text(dial,clockContainer.clockRadius/2+x1,clockContainer.clockRadius/2+y1) - - context.fill() - context.stroke() - } - context.closePath() - } - } - - Canvas { - id: clockPointers - anchors.fill: parent - antialiasing: true - renderTarget: Canvas.Image - onPaint: { - var ctx = clockPointers.getContext('2d') - ctx.clearRect(0,0,clockContainer.clockRadius,clockContainer.clockRadius) - ctx.lineCap = 'round' - drawPointer(ctx, -90+clock.hours*30, clockContainer.clockRadius*.25, clockContainer.clockRadius*.05, "#000000") - drawPointer(ctx, -90+clock.minutes*6, clockContainer.clockRadius*.375, clockContainer.clockRadius*.025, "#333333") - drawPointer(ctx, -90+clock.seconds*6, clockContainer.clockRadius*.40, 4, "#aa0000") - - // Draw nail - ctx.beginPath() - ctx.fillStyle = "#535353" - ctx.ellipse(clockContainer.clockRadius/2-16,clockContainer.clockRadius/2-16,32,32) - ctx.fill() - ctx.closePath() - } - - function drawPointer(context, angle, len, thickness, color){ - context.beginPath() - context.lineWidth = thickness - context.strokeStyle = color - context.moveTo(clockContainer.clockRadius/2, clockContainer.clockRadius/2) - var x1=Math.cos(angle*0.01745)*len - var y1=Math.sin(angle*0.01745)*len - context.lineTo(clockContainer.clockRadius/2+.5+x1,clockContainer.clockRadius/2+.5+y1) - context.stroke() - context.closePath() - } - } - - Timer{ - id: clock - interval: 1000 - repeat: true - running: !mouseArea.pressed - - property int hours: 0 - property int minutes: 0 - property int seconds: 0 - - onTriggered: { - seconds ++ - if (seconds == 60) seconds = 0 - - if (seconds == 0) minutes++ - if (minutes == 60) { - hours++ - minutes=0 - } - - if (hours >= 12) hours=0 - - clockPointers.requestPaint() - } - } - } - - MouseArea { - id: mouseArea - anchors.fill: clockContainer - property bool grabbed: false - - onPressed: { - - var temp = clockContainer.clockRadius/2 - var ang = (90+Math.atan2((mouseY-temp), (mouseX-temp))*57.2957795) - if (ang <0) ang+=360 - - if (ang/6 > clock.minutes-2 && ang/6<clock.minutes+2){ - - grabbed = true - return; - } else { - var y = mouseY-temp - var x = mouseX-temp - var dist = Math.sqrt(y*y+x*x) - - if (dist>clockContainer.clockRadius*.42*clockContainer.scale){ - root.rimColor = newColor() - clockCanvas.requestPaint() - return; - }else if (dist>clockContainer.clockRadius*.32*clockContainer.scale) { - root.dialStyle = Math.round(Math.random()) - root.dialColor = newColor() - clockCanvas.requestPaint() - }else{ - root.bgcolor = newColor() - clockCanvas.requestPaint() - } - } - } - - onPositionChanged: { - if (grabbed) { - var temp = clockContainer.clockRadius/2 - var ang = (90+Math.atan2((mouseY-temp), (mouseX-temp))*57.2957795) - if (ang <0) ang+=360 - - var oldMinutes = clock.minutes - clock.minutes=ang/6 - - if (oldMinutes>55 && clock.minutes <5) clock.hours++ - if (oldMinutes<5 && clock.minutes >50) clock.hours-- - if (clock.hours >12) clock.hours=1 - if (clock.hours <0) clock.hours=11 - - - clockPointers.requestPaint() - } - } - onReleased: grabbed = false; - } - - function newColor(){ - var r=Math.random() - var g=Math.random() - var b=Math.random() - return Qt.rgba(r,g,b,1) - } - - Component.onCompleted: { - var d = new Date() - clock.hours = d.getHours() - if (clock.hours>=12)clock.hours-=12 - clock.minutes = d.getMinutes() - clock.seconds = d.getSeconds() - clockCanvas.requestPaint() - } -} |