如何使用setInterval动画画布

我试图使用画布库绘制弧线。我得到要绘制的第一个蓝色圆弧，但是在setInterval内部没有发生任何事情（与setTimeout具有相同的行为）。我如何使用Canvas动态构建东西？如何使用setInterval动画画布

这里是我的代码：

var canvas = Canvas.createView(); 

canvas.begin(); 

canvas.arc(120, 120, 50, 0 * Math.PI, 2 * Math.PI, 0); 
canvas.lineWidth(10); 
canvas.strokeStyle('blue'); 
canvas.stroke(); 

var pointFrom = 1.5; 

var interval = setInterval(function() { 
    var pointTo = pointFrom - 0.5; 

    console.log('pointFrom : ' + pointFrom); 
    console.log('pointTo : ' + pointTo); 
    canvas.arc(120, 120, 50, pointFrom * Math.PI, pointTo * Math.PI, 1); 
    canvas.lineWidth(15); 
    canvas.strokeStyle('red'); 
    canvas.stroke(); 

    pointFrom = pointTo; 

    if (pointFrom < 0) clearInterval(interval); 
}, 2000); 

my_view.add(canvas); 

Thanks

来源

2013-10-17 Vincent Peres

是'if（point from＃< 0）'您的实际代码还是只是一个复制/粘贴错误？ – mwfire

'console.log'？为什么不''Ti.API.info' –

@JosiahHester我从本地工作，不介意console.log（但它工作）:) –

的

canvas.begin() 
canvas.arc(120, 120, 50, pointFrom * Math.PI, pointTo * Math.PI, 1) 
canvas.stroke() 
canvas.commit()

必须在间隔功能。

来源

2014-02-24 00:43:14

如何使用setInterval动画画布

回答

相关问题