JohnJensen on DeviantArthttps://www.deviantart.com/johnjensen/art/Exploding-Circles-with-time-options-time-step-340319551JohnJensen

Deviation Actions

JohnJensen's avatar

Exploding Circles with time options! (time step!)

By
Published:
3.1K Views

Description

Try changing the timeFactor slider and the explosionInterval slider! It's fun to have the explosionInterval at "many" (actually low on the slider, lol) and then the timeFactor being low, then it's cool slow motioooon.

Nerdy stuff:
I was playing around with using time based programming instead of frame based. An example: Let's say I have a player in a game. I know it's a 30 fps game, and that I want the player to move 300 pixels a second. So I type "player.x += 10;" 10 because 300/30=10. But what if I don't know the fps or it's changing? Then we can use a technique called time step! So instead of typing the amount we want to move every frame, we have a variable called dt (delta time) which we multiply the amount we want to move every second with. So the code becomes "player.x += 300 * dt;" so no matter what fps we're on, he'll always move the same amount every frame. Cool, huh? So how is delta time calculated? What I've done is just find the difference between the timestamps between two frames. (currentTime-previousFrameTime) being dt. So we use elapsed time between each frame to update the new frame.

Here's the main code, which you can use as a reference. It won't work if you just paste this code in, you've gotta setup the same sliders and have the FancyExplosion class to get it to work exactly as mine works.


var timeFactor:Number = 1;
var newObjectTime:Number = 0;
var newObjectInterval:Number = 0.2;
var objects:Vector.<FancyExplosion> = new Vector.<FancyExplosion>();
var lastDtTime:Number = 0;

function main(e:Event):void
{
    var dt:Number = ((getTimer() - lastDtTime) / 1000) * timeFactor;
    lastDtTime = getTimer();
    
    graphics.clear();
    
    if(objects.length > 0)
    {
        for(var i:int = objects.length-1; i >= 0; i--)
        {
            var o:
FancyExplosion = objects[i];
            
            graphics.beginFill(o.c);
            graphics.drawCircle(o.x, o.y, o.r);
            graphics.drawCircle(o.x, o.y, o.r * o.a);
            graphics.endFill();
            
            o.r += 25 * dt;
            o.a += dt;
            
            if(o.a > 1)
                objects.splice(i, 1);
        }
    }
    
    newObjectTime += dt;
    
    while(newObjectTime >= newObjectInterval)
    {
        newObjectTime -= newObjectInterval;
        objects.push(new FancyExplosion());
    }
    
    timeFactor = timeSlider.value * 0.001;
    newObjectInterval = expSlider.value * 0.001;
    deltaTime.text = "deltaTime (dt * timeFactor) = " + dt.toFixed(3);
}

stage.addEventListener(Event.ENTER_FRAME, main);



Anyway have fun and stuff.
Image size
640x480px 19.6 KB
© 2012 - 2024 JohnJensen
Comments0
Join the community to add your comment. Already a deviant? Log In