{"id":415,"date":"2009-09-23T11:02:18","date_gmt":"2009-09-23T18:02:18","guid":{"rendered":"https:\/\/actionsnippet.com\/?p=2246"},"modified":"2009-09-23T11:02:18","modified_gmt":"2009-09-23T18:02:18","slug":"timebased-animation-idea-frim-quickbox2d","status":"publish","type":"post","link":"https:\/\/actionsnippet.com\/?p=415","title":{"rendered":"Timebased Animation Idea (FRIM &#038; QuickBox2D)"},"content":{"rendered":"<pre class=\"brush: as3; title: ; notranslate\" title=\"\">\r\nimport com.actionsnippet.qbox.*;\r\n\r\n\/\/ change the frame rate and test...\r\nstage.frameRate = 60;\r\n\r\n&#x5B;SWF(width = 800, height=600)]\r\n\r\nvar sim:QuickBox2D = new QuickBox2D(this);\r\n\r\n\r\nvar circle:Shape = Shape(addChild(new Shape()));\r\nwith(circle.graphics) beginFill(0), drawCircle(0,0,50);\r\ncircle.x = 100, circle.y = 100;\r\n\r\n\r\nsim.start();\r\n\r\nvar startTime:Number;\r\n\/\/ delay the start a bit\r\nsetTimeout(function():void {\r\n  startTime = getTimer();\r\n  sim.addEventListener(QuickBox2D.STEP, onTimeStep);\r\n}, 500);\r\n\r\nfunction onTimeStep(evt:Event):void{\r\n\t\r\n\tcircle.x += (600 - circle.x) \/ 12;\r\n\t\r\n\tif ((600 - circle.x) &lt; 1.5){\r\n\t\ttrace(&quot;frameRate: &quot;, stage.frameRate);\r\n\t\ttrace(&quot;totalTime: &quot;, getTimer() - startTime +&quot; ms&quot;);\r\n\t\ttrace(&quot;totalTimeSteps: &quot;, sim.totalTimeSteps);\r\n\t\tsim.removeEventListener(QuickBox2D.STEP, onTimeStep);\r\n\t}\r\n}\r\n<\/pre>\n<p><i>Note: This snippet requires <a href=\"https:\/\/actionsnippet.com\/?page_id=1391\" target=\"blank\">QuickBox2D 1.0 or greater<\/a><\/i><\/p>\n<p>Really not sure how I didn&#8217;t think of doing this before last night&#8230; I realized that the simple FRIM code inside of QuickBox2D can be used to make any standard frame-based style ActionScript animation time-based. In this snippet I do a simple ease out one liner:<\/p>\n<p>circle.x += (600 &#8211; circle.x) \/ 12;<\/p>\n<p>Code like that on an enterFrame would run at different speeds depending on your framerate. However, if you run it on QuickBox2D&#8217;s STEP event it runs independent of fram-erate. I&#8217;m obviously going to just wrap this up into it&#8217;s own mini-library separate from QuickBox2D and do a more in depth post about it&#8230; but for now, this snippet just traces out the results. These are my results from my macbook pro dual 2.4 intel&#8230;.<\/p>\n<p>frameRate:  12<br \/>\ntotalTime:  1165 ms<br \/>\ntotalTimeSteps:  93<\/p>\n<p>frameRate:  24<br \/>\ntotalTime:  1162 ms<br \/>\ntotalTimeSteps:  93<\/p>\n<p>frameRate:  30<br \/>\ntotalTime:  1166 ms<br \/>\ntotalTimeSteps:  91<\/p>\n<p>frameRate:  60<br \/>\ntotalTime:  1167 ms<br \/>\ntotalTimeSteps:  93<\/p>\n<p>frameRate:  120<br \/>\ntotalTime:  1168 ms<br \/>\ntotalTimeSteps:  91<\/p>\n<p>Anyway&#8230; will peel the FRIM code out of QuickBox2D and wrap it up in its own library sometime soon&#8230;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>import com.actionsnippet.qbox.*; \/\/ change the frame rate and test&#8230; stage.frameRate = 60; &#x5B;SWF(width = 800, height=600)] var sim:QuickBox2D = new QuickBox2D(this); var circle:Shape = Shape(addChild(new Shape())); with(circle.graphics) beginFill(0), drawCircle(0,0,50); circle.x = 100, circle.y = 100; sim.start(); var startTime:Number; \/\/ delay the start a bit setTimeout(function():void { startTime = getTimer(); sim.addEventListener(QuickBox2D.STEP, onTimeStep); }, 500); function onTimeStep(evt:Event):void{ [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[13],"tags":[3,14,4],"class_list":["post-415","post","type-post","status-publish","format-standard","hentry","category-motion","tag-actionscript","tag-as3","tag-flash"],"_links":{"self":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts\/415","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=415"}],"version-history":[{"count":0,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=\/wp\/v2\/posts\/415\/revisions"}],"wp:attachment":[{"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=415"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=415"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/actionsnippet.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=415"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}