Cómo crear un péndulo realista en ActionScript 3

En este tip vamos crear un objeto que oscile como un péndulo de manera realista utilizando ecuaciones físicamente coherentes en ActionScript 3. Aunque la explicación de esas ecuaciones no viene al caso, diré que están basadas en una aproximación y que no son ni mucho menos exactas, ya que requerirían conocimientos avanzados de cálculo diferencial para poder obtenerlas. No obstante, la aproximación es bastante buena y no se pierde un ápice de realismo.

Para comenzar, vamos a crear un documento nuevo de AS3 y vamos a dibujar nuestro péndulo en posición vertical, es decir, con el origen de coordenadas arriba en el centro. Ponemos la velocidad de fotogramas a 30, aunque en realidad puedes escoger el valor que más te convenga. Después de ajustar el punto de registro en el lugar donde queremos que esté el punto de rotación, le damos el nombre de instancia pendulo y escribimos este código en el único fotograma de la línea de tiempo:

Código :

import flash.events.Event.ENTER_FRAME;

addEventListener(Event.ENTER_FRAME, onEnterFrame);

with ( pendulo )
{
const g:Number = 9.8 * 300; // g = 9,8 m/s*s * 300 px/m
var t:Number = 0; // t = 0s
var l:Number = pendulo.height; // l = altura px
var phi = pendulo.rotation * Math.PI / 180; // phi = 0 rad
var omega = 0; // omega = 0 rad/s
}

function onEnterFrame(e:Event):void
{
with(pendulo)
{
t = 1 / 30; // t = 1 / 30 s porque 30 es la velocidad de fotogramas por segundo
phi = rotation * Math.PI / 180;
omega += ((-g * t) / l) * Math.sin(phi);
phi += omega * t;
rotation = phi * 180 / Math.PI;
}
}

Y ya está. Ya he dicho que en principio no explicaré las ecuaciones; si alguien tiene curiosidad puede preguntar en los comentarios. Ahora si giramos levemente nuestro péndulo y probamos nuestra película:



Pero claro, esto va a estar moviéndose hasta el día del juicio final por la tarde. Ahora podemos añadir un comportamiento que "empuje" el péndulo al hacer click, y rozamiento con el aire (que es proporcional al cuadrado de la velocidad):

Código :

import flash.events.Event.ENTER_FRAME;
import flash.events.MouseEvent.CLICK;

addEventListener(Event.ENTER_FRAME, onEnterFrame);
stage.addEventListener(MouseEvent.CLICK, onClick);

with ( pendulo )
{
const g:Number = 9.8 * 300; // g = 9,8 m/s*s * 300 px/m
var t:Number = 0; // t = 0s
var l:Number = pendulo.height; // l = altura px
var phi = pendulo.rotation * Math.PI / 180; // phi = 0 rad
var omega = 0; // omega = 0 rad/s

var signo:int;
var drag:Number;
}

function onClick(e:MouseEvent):void
{
with(pendulo)
{
omega -= Math.PI * 1.5;
}
}

function onEnterFrame(e:Event):void
{
with(pendulo)
{
t = 1 / 30; // t = 1 / 30 s porque 30 es la velocidad de fotogramas por segundo
signo = (omega < 0) ? -1 : 1;
drag = omega * omega / 300;
phi = rotation * Math.PI / 180;
omega += ((-g * t) / l) * Math.sin(phi) - signo * drag;
phi += omega * t;
rotation = phi * 180 / Math.PI;
}
}

Y ahora sí, si publicamos la película:



¡Ya lo tenemos! Fácil, rápido y para toda la familia

Espero que os sea útil, ¡saludos!

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.