Question

想知道是否还有其他人注意到这一点。我可以使用setInterval来制作动画，但时间并不像我想的那样精确。但由于某种原因，我无法获得requestAnimationFrame做任何事情。

以下代码的目的是让屏幕每250毫秒闪烁两种不同的颜色，虽然这不是我最终想要实现的，我正在使用这个简化的概念来试图获得动画工作的概念。（如果有人想破解它，我试图让黑色背景闪烁红色100ms，每400ms）。

不可否认，我对javascript很新，但我想知道是否有其他人注意到这样的事情？

代码我正在尝试，点击按钮调用sayHello（）;

function sayHello(){
  var start = window.performance.now();
  var runStart = window.performance.now();
  var my_canvas = app.pages.Run.children.Panel1.children.Canvas.getElement().getElementsByTagName("CANVAS")[0];
  var requestId1;
  var totalDuration = 5000;
  var currentColor = '#000000';

  function animate1(now){
    my_canvas.style.backgroundColor = currentColor;
    console.log('animate now: ' + now + 'win' + windows.performance.now());
    if (now > start+250){
      start = now;
      now = 0;
      if (currentColor === '#ff0000') currentColor = '#000000';
      else currentColor = '#ff0000';
      console.log('switch: ' + window.performance.now());
    }

    if ((window.performance.now - runStart) > totalDuration){
      window.cancelAnimationFrame(requestId1); 
      console.log('done');
    }
    else{
      requestAnimationFrame(animate1);
      console.log('not done');
    }
  }

  function sayGoodbye(){
    window.cancelAnimationFrame(requestId1);
  }

  requestId1 = requestAnimationFrame(animate1);
  console.log('start app' + requestId1);
  console.log('info: ' + start + ' ' + runStart + ' ' + totalDuration);

}

Answer 1

你快到了。

只需替换

窗口的取值 .performance.now（）

与

window.performance.now（）

希望它有所帮助。

在google appmaker中，无法获取requestAnimationFrame工作

1 个答案: