From e2c67953cea0ba8ceec880d124c9e9c97ec55207 Mon Sep 17 00:00:00 2001 From: Charles Yin Date: Fri, 24 Jun 2011 11:10:58 +1000 Subject: update canvas example Change-Id: I901532eafabc0344f3978c0093ee56ed230c74b0 --- examples/declarative/canvas/svgpath/tiger.js | 27 ++++++++++++++------------ examples/declarative/canvas/svgpath/tiger.qml | 28 +++++++++++++++++---------- 2 files changed, 33 insertions(+), 22 deletions(-) diff --git a/examples/declarative/canvas/svgpath/tiger.js b/examples/declarative/canvas/svgpath/tiger.js index a3d79c9098..63a1e43cba 100644 --- a/examples/declarative/canvas/svgpath/tiger.js +++ b/examples/declarative/canvas/svgpath/tiger.js @@ -728,15 +728,19 @@ function draw(ctx, frame) if (frame > totalPaths) return; - - ctx.globalCompositeOperation = "source-over"; - ctx.clearRect(0, 0, 800, 800); - - ctx.strokeColor = Qt.rgba(133, 133, 133,1); - ctx.lineWidth = 1; + console.log(frame); + ctx.reset(); + ctx.globalCompositeOperation = "source-over"; + ctx.fillStyle = "rgba(0,0,0,0)"; + //ctx.fillRect(0, 0, 600, 600); + ctx.fillRect(0, 0, 1900, 1200); + ctx.strokeColor = Qt.rgba(133, 133, 133,1); + ctx.lineWidth = 1; + //ctx.translate(200, 200); + ctx.translate(750, 350); + ctx.scale(2,2); for (var i = 0; i < frame; i++) { - console.log("draw frame:" + i + " fill:" + tiger[i].fill + " stroke:" + tiger[i].stroke + " path:" + tiger[i].path + " width:" + tiger[i].width); if (tiger[i].width != undefined) ctx.lineWidth = tiger[i].width; @@ -748,12 +752,11 @@ function draw(ctx, frame) ctx.fill(); } - //if (tiger[i].stroke != undefined) { - // ctx.strokeStyle = tiger[i].stroke; + if (tiger[i].stroke != undefined) { + ctx.strokeStyle = tiger[i].stroke; ctx.stroke(); - // } - - } + } + } } diff --git a/examples/declarative/canvas/svgpath/tiger.qml b/examples/declarative/canvas/svgpath/tiger.qml index 440e81ef30..052c090708 100644 --- a/examples/declarative/canvas/svgpath/tiger.qml +++ b/examples/declarative/canvas/svgpath/tiger.qml @@ -3,23 +3,31 @@ import "tiger.js" as Tiger Canvas { id:canvas - width:800 - height:800 + width:1900 + height:1150 property int frame:0 Timer { repeat:true - interval:10 + interval:100 running:true onTriggered: { - frame++; - if (frame > Tiger.tiger.length) - frame = 0; - Tiger.draw(canvas.getContext(), canvas.frame); + canvas.frame++; + if (canvas.frame > Tiger.tiger.length) { + canvas.frame = 0; + } else { + Tiger.draw(canvas.getContext(), canvas.frame); + } } } - - /*onDrawRegion:{ +/* + onDrawRegion:{ Tiger.draw(context, canvas.frame); - }*/ + } +Text { + anchors.top : parent.top + font.pixelSize : 30 + text: "drawing path:" + canvas.frame + "/" + Tiger.tiger.length; +} +*/ } -- cgit v1.2.3