Set frame rate

[MonsieurPixel]

Hi guys,

 

I'm currently making a platformer. I start having a lot of sprites, mainly because every object is animated on 40 frames.

 

My spritesheet just crossed the 2048x2048 limit and it seems that Pixi (or the browser, for all I know) won't accept my 4096x2048 spritesheet.

 

From there, two options :

- stick to one Spritesheet and decrease the animation framerate tp 30fps (as it can be done in EaselJS for example). Then divide my number of sprites by two. The engine would still run at 60fps but would play 1 image every two frames.

- start using more than one Spritesheet and add all this via assetToLoader. Would be quite easy but what happens to the performances when you start using more than one big texture ? And when, for example, a MovieClip jumps from one to another when displaying animations ?

 

Thank you for helping me, have a nice day !

[d13]

 

- start using more than one Spritesheet 

 

This seems like the obvious solution and I can't think of any practical reason why not to do it.

Try it and let us know what happens

 

PS:

When you say "set framerate" do you mean the frame rate of MovieClip keyframe animations, or the frame rate of the game loop?

[MonsieurPixel]

Ok so I tested the second solution (having two different json pointing to two different spritesheet) and it turned out OK first.

 

But I can notice a few glitches from time to time that weren't present before. Some textures disappearing (for like 1 frame). 

 

When I choose to use the CanvasRenderer only, the problems diseappear but with webgl it appears from time to time.

 

So either I can decrease the animation framerate, either I'm stuck ^^

[MonsieurPixel]

This seems like the obvious solution and I can't think of any practical reason why not to do it.

Try it and let us know what happens

 

PS:

When you say "set framerate" do you mean the frame rate of MovieClip keyframe animations, or the frame rate of the game loop?

 

Hi ! I was speaking of the frame rate of MovieClips. I can chose to render only half the frames from within the game loop too I guess.

[MonsieurPixel]

Also, I just tested to call renderer.render(stage); only 30 times/sec. It works. But it's so much less smooth I canceled the first idea immediately.

 

So now either I can solve the little webgl glitch, choose to live with it, or reduce the size or the time of animation of my clips...

[MonsieurPixel]

And sorry for the multiposts but I just noticed the animationSpeed property on MovieClips.

 

I'm going to test lowering the speed of less important clips individually.

[d13]

 

But I can notice a few glitches from time to time that weren't present before. Some textures disappearing (for like 1 frame). 

 

When I choose to use the CanvasRenderer only, the problems diseappear but with webgl it appears from time to time.

.

Is this a black frame, or do the textures just disappear?

 

I'm glad you found `animationSpeed`.

 

If you need more control you can use this custom `addStatePlayer` function:

 

https://gist.github.com/kittykatattack/13a53d0dbc32ce2a0a17

 

It's a slightly more advanced frame player and state manager for MovieClip sprites.

It lets you set a precise fps, play any sequence of frames, and stop at specific frames 

Use it like this:

//Add the advanced state player to a PIXI.MovieClipaddStatePlayer(movieClipSprite);//Set the frame ratemovieClipSprite.fps = 12;//Play any sequence of frames//(provide a start frame and end frame as two element array)movieClipSprite.playSequence([startFrameNumber, endFrameNumber]);//Show a specific frame (this is a convenience wrapper for `gotoAndStop`)movieClipSprite.show(anyFrameNumber);

[MonsieurPixel]

 

Is this a black frame, or do the textures just disappear?

 

I'm glad you found `animationSpeed`.

 

If you need more control you can use this custom `addStatePlayer` function:

 

https://gist.github.com/kittykatattack/13a53d0dbc32ce2a0a17

 

It's a slightly more advanced frame player and state manager for MovieClip sprites.

It lets you set a precise fps, play any sequence of frames, and stop at specific frames 

Use it like this:

//Add the advanced state player to a PIXI.MovieClipaddStatePlayer(movieClipSprite);//Set the frame ratemovieClipSprite.fps = 12;//Play any sequence of frames//(provide a start frame and end frame as two element array)movieClipSprite.playSequence([startFrameNumber, endFrameNumber]);//Show a specific frame (this is a convenience wrapper for `gotoAndStop`)movieClipSprite.show(anyFrameNumber);

 

Thanks for the help. The glitch is a black frame but that affects just a portion of the screen. Like a black flash on some sprites (could even be a zone, not directly sprites). Happened in webgl mode, in Chrome and FF.

 

Solved my problem reducing all my sprites' width by 70%. As I was already testing the game at 0.7 scale for the past month and it looked fine, it was not too much of a pain in the ass. But still, I may be confronted again to thr problem.

[d13]

Thanks for the help. The glitch is a black frame but that affects just a portion of the screen. Like a black flash on some sprites (could even be a zone, not directly sprites). Happened in webgl mode, in Chrome and FF.

I had a similar bug a few days ago with MoiveClip frames using the WebGLRender (the CanvasRender was fine.)

I could't figure out exactly what was causing it but I think it had something to do with the textures not initializing properly.

(I simplified my code a bit and it went away.)

If you're able to submit a bug report that might help the Pixi team fix it:

 

https://github.com/GoodBoyDigital/pixi.js/issues?state=open