Skip to main content
P
Paul Darky
Inspiring
September 26, 2018
Answered

Is there a way to change the frame rate at runtime?

  • September 26, 2018
  • 5 replies
  • 10618 views

Is there a way to change the frame rate at runtime in Adobe Animate CC?

I have an app to practice reading sheet music and I want to make it possible for the users to change the speed of each exercise to make it faster or slower.

Lets say the normal speed is 24 FPS and I want the users to be able to gradually slow it (22, 20, 18, 16, 14, 12) or make it faster (24, 26, 28, 30, 32, 34, 36).

I will appreciate any help.

This topic has been closed for replies.
Correct answer JoãoCésar17023019

Hi João,

Thanks for your reply.

The thing is that I don´t know where should I indicate the 24 FPS. If you see my code, the only part where "24" is written is on the name of the button:

import flash.events.MouseEvent;

function changeFPS(e:MouseEvent):void

{

var fps:uint = uint(e.currentTarget.name.replace("fps", ""));

stage.frameRate = fps;

}

fps24.addEventListener(MouseEvent.CLICK, changeFPS);

I don´t know on which specific part of the code I have to indicate the change to 24 FPS. That´s why nothing seems to happen when I click on the button.

Best,

Paul


Hi, Paul.

The code gets de fps value from the button name itself.

It gets the string "24fps", removes the "fps" part and turn the remaining part into a unsigned integer. But this is only a suggestion.

If you prefer, you can create a function for each framerate value. Like this:

import flash.events.MouseEvent;
function changeTo12FPS(e:MouseEvent):void
{
    stage.frameRate = 12;
}
function changeTo24FPS(e:MouseEvent):void
{
    stage.frameRate = 24;
}
function changeTo30FPS(e:MouseEvent):void
{
    stage.frameRate = 30;
}
function changeTo60FPS(e:MouseEvent):void
{
    stage.frameRate = 60;
}
fps12.addEventListener(MouseEvent.CLICK, changeTo12FPS);
fps24.addEventListener(MouseEvent.CLICK, changeTo24FPS);
fps30.addEventListener(MouseEvent.CLICK, changeTo30FPS);
fps60.addEventListener(MouseEvent.CLICK, changeTo60FPS);

You can download a sample from my GitHub repo:

adobe/animate cc/as3/change_fps at master · joao-cesar/adobe · GitHub

Regards,

JC

5 replies

P
Paul DarkyAuthor
Inspiring
July 16, 2019

I am asking for help once again as I had not been able to solve this issue.

I need to make possible for users of one of my apps to change the Frame Rate at runtime. Let´s say Frame Rate is 12, so I want to make users able to change that Frame Rate to 16, 20, 24, 30.

Any advice?

JoãoCésar17023019
Community Expert
JoãoCésar17023019Community Expert
Community Expert
July 16, 2019

Hi.

Do you want the user to do this using buttons or input texts?

Because if you're going to use buttons, one approach will be to have a button for each FPS value you wish to provide.

Let's say you have four buttons named like: fps12, fps24, fps30, fps60.

Your code could be:

import flash.events.MouseEvent;
function changeFPS(e:MouseEvent):void
{
    var fps:uint = uint(e.currentTarget.name.replace("fps", ""));
    stage.frameRate = fps;
}
fps12.addEventListener(MouseEvent.CLICK, changeFPS);
fps24.addEventListener(MouseEvent.CLICK, changeFPS);
fps30.addEventListener(MouseEvent.CLICK, changeFPS);
fps60.addEventListener(MouseEvent.CLICK, changeFPS);

Please let me know if this helps you.

Regards,

JC

    P
    Paul DarkyAuthor
    Inspiring
    July 23, 2019

    Hi JoãoCésar,

    Thanks for your reply.

    Sorry for being so ignorant on AS3.

    - The FPS of my swf is set to 12 in the Properties panel

    - I added a button to the stage named: fps24

    - I want to make a test changing the original FPS from 12 to 24 when cliking that button at runtime

    - Can you please tell me how I need to adjust the following code?

    import flash.events.MouseEvent;

    function changeFPS(e:MouseEvent):void

    {

    var fps:uint = uint(e.currentTarget.name.replace("fps", ""));

    stage.frameRate = fps;

    }

    fps24.addEventListener(MouseEvent.CLICK, changeFPS);

    I will appreciate your help.

    Best,

    P
    Paul DarkyAuthor
    Inspiring
    September 26, 2018

    Hi JoaoCésar and nickg28,

    I´m talking about making it possible for the user to change the frame rate at runtime.

    Hi ClayUUID,

    I work only with the main timeline (no movie clips). Can you tell me what is THAT possible way?

    Best,

    JoãoCésar17023019
    Community Expert
    JoãoCésar17023019Community Expert
    Community Expert
    September 26, 2018

    You need to change those properties in order to accomplish what you want.

    Say for example you have a button that changes the framerate to 20 fps. You would write:

    AS3

    import flash.events.MouseEvent;
    button20FPS.addEventListener(MouseEvent.CLICK, function(e:MouseEvent):void{stage.frameRate = 20;});

    HTML5

    this.button20FPS.addEventListener("click", function(e){createjs.Ticker.framerate = 20;});

    Regards,

    JC

    C
    ClayUUID
    Legend
    September 26, 2018

    While this is one possible way to accomplish your goal, it's also the worst possible way, because it will slow down the frame rate of everything. Every frame-based animation will become coarse and jumpy.

    Anything time-based should be using timers, which can then be sped up or slowed down independent of the frame rate.

    N
    Community Expert
    Nick GioiaCommunity Expert
    Community Expert
    September 26, 2018

      JoãoCésar17023019
      Community Expert
      JoãoCésar17023019Community Expert
      Community Expert
      September 26, 2018

      Hi.

      Yeah. There is.

      In AS3 documents, change the stage.frameRate property.

      In HTML5 documents, change the createjs.Ticker.framerate property.

      Regards,

      JC

        Terms & ConditionsAccessibility statement
        Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices