Pixi.js: Start text animation at specific monent

[chilin99999]

I need to start text animation at specific moment.
The following is my code, and I don't know if it is a appropriate way to achieve that.
Because the animation speed may has a bit different in every devices, and it causes text is out of sync with the animation.

const text = new PIXI.Text(string);
this.addChild(text);
let tick = 0;
PIXI.ticker.shared.add(function textRotate() {
  tick += 1;
  if(tick >= 120) {
    text.rotation += 0.00175;
    text.y -= 0.19;
  }
  if(tick >= 144) {
    PIXI.ticker.shared.remove(textRotate);
  }
});
// I've tried using setTimeout to control, but there's still the same problem

• pixi.js version: 4.8.6

[themoonrat]

You don't want to do timings based on the number of 'ticks'. The basic example https://pixijs.io/examples/#/basics/basic.js shows how to use a delta to make any movement / timing framerate independent.

Your issue at https://github.com/pixijs/pixi.js/issues/5470 I believe is a similar issue. The rate of updating is being done on a 'how many ticks' have taken place basis, which means that if a device has a low fps, it's get less ticks. Using a time delta is one of the ways to get around this.

I'd recommend doing some googleing of 'framerate independent game loop' :)

[ivanpopelyshev]

delta that is passed inside equals to 1 if everything is OK. You can just specify tick += delta and that'll do it.

[chilin99999]

Thank you!
Your applies really help me a lot!

[themoonrat]

glad to help :)

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.