phaser/docs/Phaser.FrameData.html

1848 lines
No EOL
27 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Phaser Class: FrameData</title>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/sunlight.default.css">
<link type="text/css" rel="stylesheet" href="styles/site.cerulean.css">
</head>
<body>
<div class="container-fluid">
<div class="navbar navbar-fixed-top navbar-inverse">
<div class="navbar-inner">
<a class="brand" href="index.html">Phaser</a>
<ul class="nav">
<li class="dropdown">
<a href="namespaces.list.html" class="dropdown-toggle" data-toggle="dropdown">Namespaces<b
class="caret"></b></a>
<ul class="dropdown-menu ">
<li>
<a href="Phaser.html">Phaser</a>
</li>
</ul>
</li>
<li class="dropdown">
<a href="classes.list.html" class="dropdown-toggle" data-toggle="dropdown">Classes<b
class="caret"></b></a>
<ul class="dropdown-menu ">
<li>
<a href="Phaser.Animation.html">Animation</a>
</li>
<li>
<a href="Phaser.AnimationManager.html">AnimationManager</a>
</li>
<li>
<a href="Phaser.AnimationParser.html">AnimationParser</a>
</li>
<li>
<a href="Phaser.Cache.html">Cache</a>
</li>
<li>
<a href="Phaser.Camera.html">Camera</a>
</li>
<li>
<a href="Phaser.Canvas.html">Canvas</a>
</li>
<li>
<a href="Phaser.Circle.html">Circle</a>
</li>
<li>
<a href="Phaser.Color.html">Color</a>
</li>
<li>
<a href="Phaser.Device.html">Device</a>
</li>
<li>
<a href="Phaser.Easing.html">Easing</a>
</li>
<li>
<a href="Phaser.Easing.Back.html">Back</a>
</li>
<li>
<a href="Phaser.Easing.Bounce.html">Bounce</a>
</li>
<li>
<a href="Phaser.Easing.Circular.html">Circular</a>
</li>
<li>
<a href="Phaser.Easing.Cubic.html">Cubic</a>
</li>
<li>
<a href="Phaser.Easing.Elastic.html">Elastic</a>
</li>
<li>
<a href="Phaser.Easing.Exponential.html">Exponential</a>
</li>
<li>
<a href="Phaser.Easing.Linear.html">Linear</a>
</li>
<li>
<a href="Phaser.Easing.Quadratic.html">Quadratic</a>
</li>
<li>
<a href="Phaser.Easing.Quartic.html">Quartic</a>
</li>
<li>
<a href="Phaser.Easing.Quintic.html">Quintic</a>
</li>
<li>
<a href="Phaser.Easing.Sinusoidal.html">Sinusoidal</a>
</li>
<li>
<a href="Phaser.Frame.html">Frame</a>
</li>
<li>
<a href="Phaser.FrameData.html">FrameData</a>
</li>
<li>
<a href="Phaser.Game.html">Game</a>
</li>
<li>
<a href="Phaser.Group.html">Group</a>
</li>
<li>
<a href="Phaser.Input.html">Input</a>
</li>
<li>
<a href="Phaser.InputHandler.html">InputHandler</a>
</li>
<li>
<a href="Phaser.Key.html">Key</a>
</li>
<li>
<a href="Phaser.Keyboard.html">Keyboard</a>
</li>
<li>
<a href="Phaser.LinkedList.html">LinkedList</a>
</li>
<li>
<a href="Phaser.Loader.html">Loader</a>
</li>
<li>
<a href="Phaser.LoaderParser.html">LoaderParser</a>
</li>
<li>
<a href="Phaser.Math.html">Math</a>
</li>
<li>
<a href="Phaser.Mouse.html">Mouse</a>
</li>
<li>
<a href="Phaser.MSPointer.html">MSPointer</a>
</li>
<li>
<a href="Phaser.Net.html">Net</a>
</li>
<li>
<a href="Phaser.Particles.html">Particles</a>
</li>
<li>
<a href="Phaser.Particles.Arcade.Emitter.html">Emitter</a>
</li>
<li>
<a href="Phaser.Plugin.html">Plugin</a>
</li>
<li>
<a href="Phaser.PluginManager.html">PluginManager</a>
</li>
<li>
<a href="Phaser.Point.html">Point</a>
</li>
<li>
<a href="Phaser.Pointer.html">Pointer</a>
</li>
<li>
<a href="Phaser.QuadTree.html">QuadTree</a>
</li>
<li>
<a href="Phaser.RandomDataGenerator.html">RandomDataGenerator</a>
</li>
<li>
<a href="Phaser.Rectangle.html">Rectangle</a>
</li>
<li>
<a href="Phaser.RequestAnimationFrame.html">RequestAnimationFrame</a>
</li>
<li>
<a href="Phaser.Signal.html">Signal</a>
</li>
<li>
<a href="Phaser.Sound.html">Sound</a>
</li>
<li>
<a href="Phaser.SoundManager.html">SoundManager</a>
</li>
<li>
<a href="Phaser.Stage.html">Stage</a>
</li>
<li>
<a href="Phaser.StageScaleMode.html">StageScaleMode</a>
</li>
<li>
<a href="Phaser.State.html">State</a>
</li>
<li>
<a href="Phaser.StateManager.html">StateManager</a>
</li>
<li>
<a href="Phaser.Time.html">Time</a>
</li>
<li>
<a href="Phaser.Touch.html">Touch</a>
</li>
<li>
<a href="Phaser.Tween.html">Tween</a>
</li>
<li>
<a href="Phaser.TweenManager.html">TweenManager</a>
</li>
<li>
<a href="Phaser.Utils.html">Utils</a>
</li>
<li>
<a href="Phaser.Utils.Debug.html">Debug</a>
</li>
<li>
<a href="Phaser.World.html">World</a>
</li>
<li>
<a href="SignalBinding.html">SignalBinding</a>
</li>
</ul>
</li>
<li class="dropdown">
<a href="global.html" class="dropdown-toggle" data-toggle="dropdown">Global<b
class="caret"></b></a>
<ul class="dropdown-menu ">
<li>
<a href="global.html#HEXtoRGB">HEXtoRGB</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
<div class="row-fluid">
<div class="span8">
<div id="main">
<h1 class="page-title">Class: FrameData</h1>
<section>
<header>
<h2>
<span class="ancestors"><a href="Phaser.html">Phaser</a>.</span>
FrameData
</h2>
<div class="class-description"><p>Phaser.FrameData</p></div>
</header>
<article>
<div class="container-overview">
<dt>
<h4 class="name" id="FrameData"><span class="type-signature"></span>new FrameData<span class="signature">()</span><span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>FrameData is a container for Frame objects, which are the internal representation of animation data in Phaser.</p>
</div>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="FrameData.js.html">animation/FrameData.js</a>, <a href="FrameData.js.html#sunlight-1-line-13">line 13</a>
</li></ul></dd>
</dl>
</dd>
</div>
<h3 class="subsection-title">Members</h3>
<dl>
<dt>
<h4 class="name" id="total"><span class="type-signature">&lt;readonly> </span>total<span class="type-signature"></span></h4>
</dt>
<dd>
<dl class="details">
<h5 class="subsection-title">Properties:</h5>
<dl>
<table class="props table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>total</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="description last"><p>The total number of frames in this FrameData set.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="FrameData.js.html">animation/FrameData.js</a>, <a href="FrameData.js.html#sunlight-1-line-226">line 226</a>
</li></ul></dd>
</dl>
</dd>
</dl>
<h3 class="subsection-title">Methods</h3>
<dl>
<dt>
<h4 class="name" id="addFrame"><span class="type-signature"></span>addFrame<span class="signature">(frame)</span><span class="type-signature"> &rarr; {<a href="Phaser.Frame.html">Phaser.Frame</a>}</span></h4>
</dt>
<dd>
<div class="description">
<p>Adds a new Frame to this FrameData collection. Typically called by the Animation.Parser and not directly.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>frame</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Frame.html">Phaser.Frame</a></span>
</td>
<td class="description last"><p>The frame to add to this FrameData set.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="FrameData.js.html">animation/FrameData.js</a>, <a href="FrameData.js.html#sunlight-1-line-32">line 32</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
<p>The frame that was just added.</p>
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type"><a href="Phaser.Frame.html">Phaser.Frame</a></span>
</dd>
</dl>
</dd>
<dt>
<h4 class="name" id="checkFrameName"><span class="type-signature"></span>checkFrameName<span class="signature">(name)</span><span class="type-signature"> &rarr; {boolean}</span></h4>
</dt>
<dd>
<div class="description">
<p>Check if there is a Frame with the given name.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>name</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last"><p>The name of the frame you want to check.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="FrameData.js.html">animation/FrameData.js</a>, <a href="FrameData.js.html#sunlight-1-line-90">line 90</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
<p>True if the frame is found, otherwise false.</p>
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">boolean</span>
</dd>
</dl>
</dd>
<dt>
<h4 class="name" id="getFrame"><span class="type-signature"></span>getFrame<span class="signature">(index)</span><span class="type-signature"> &rarr; {<a href="Phaser.Frame.html">Phaser.Frame</a>}</span></h4>
</dt>
<dd>
<div class="description">
<p>Get a Frame by its numerical index.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>index</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="description last"><p>The index of the frame you want to get.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="FrameData.js.html">animation/FrameData.js</a>, <a href="FrameData.js.html#sunlight-1-line-54">line 54</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
<p>The frame, if found.</p>
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type"><a href="Phaser.Frame.html">Phaser.Frame</a></span>
</dd>
</dl>
</dd>
<dt>
<h4 class="name" id="getFrameByName"><span class="type-signature"></span>getFrameByName<span class="signature">(name)</span><span class="type-signature"> &rarr; {<a href="Phaser.Frame.html">Phaser.Frame</a>}</span></h4>
</dt>
<dd>
<div class="description">
<p>Get a Frame by its frame name.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>name</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last"><p>The name of the frame you want to get.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="FrameData.js.html">animation/FrameData.js</a>, <a href="FrameData.js.html#sunlight-1-line-72">line 72</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
<p>The frame, if found.</p>
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type"><a href="Phaser.Frame.html">Phaser.Frame</a></span>
</dd>
</dl>
</dd>
<dt>
<h4 class="name" id="getFrameIndexes"><span class="type-signature"></span>getFrameIndexes<span class="signature">(frames, <span class="optional">useNumericIndex</span>, <span class="optional">output</span>)</span><span class="type-signature"> &rarr; {Array}</span></h4>
</dt>
<dd>
<div class="description">
<p>Returns all of the Frame indexes in this FrameData set.
The frames indexes are returned in the output array, or if none is provided in a new Array object.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>frames</code></td>
<td class="type">
<span class="param-type">Array</span>
</td>
<td class="attributes">
</td>
<td class="default">
</td>
<td class="description last"><p>An Array containing the indexes of the frames to retrieve. If the array is empty then all frames in the FrameData are returned.</p></td>
</tr>
<tr>
<td class="name"><code>useNumericIndex</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="default">
true
</td>
<td class="description last"><p>Are the given frames using numeric indexes (default) or strings? (false)</p></td>
</tr>
<tr>
<td class="name"><code>output</code></td>
<td class="type">
<span class="param-type">Array</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="default">
</td>
<td class="description last"><p>If given the results will be appended to the end of this array otherwise a new array will be created.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="FrameData.js.html">animation/FrameData.js</a>, <a href="FrameData.js.html#sunlight-1-line-177">line 177</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
<p>An array of all Frame indexes matching the given names or IDs.</p>
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">Array</span>
</dd>
</dl>
</dd>
<dt>
<h4 class="name" id="getFrameRange"><span class="type-signature"></span>getFrameRange<span class="signature">(start, end, <span class="optional">output</span>)</span><span class="type-signature"> &rarr; {Array}</span></h4>
</dt>
<dd>
<div class="description">
<p>Returns a range of frames based on the given start and end frame indexes and returns them in an Array.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>start</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="attributes">
</td>
<td class="description last"><p>The starting frame index.</p></td>
</tr>
<tr>
<td class="name"><code>end</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="attributes">
</td>
<td class="description last"><p>The ending frame index.</p></td>
</tr>
<tr>
<td class="name"><code>output</code></td>
<td class="type">
<span class="param-type">Array</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>If given the results will be appended to the end of this array otherwise a new array will be created.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="FrameData.js.html">animation/FrameData.js</a>, <a href="FrameData.js.html#sunlight-1-line-108">line 108</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
<p>An array of Frames between the start and end index values, or an empty array if none were found.</p>
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">Array</span>
</dd>
</dl>
</dd>
<dt>
<h4 class="name" id="getFrames"><span class="type-signature"></span>getFrames<span class="signature">(frames, <span class="optional">useNumericIndex</span>, <span class="optional">output</span>)</span><span class="type-signature"> &rarr; {Array}</span></h4>
</dt>
<dd>
<div class="description">
<p>Returns all of the Frames in this FrameData set where the frame index is found in the input array.
The frames are returned in the output array, or if none is provided in a new Array object.</p>
</div>
<h5>Parameters:</h5>
<table class="params table table-striped">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Argument</th>
<th>Default</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>frames</code></td>
<td class="type">
<span class="param-type">Array</span>
</td>
<td class="attributes">
</td>
<td class="default">
</td>
<td class="description last"><p>An Array containing the indexes of the frames to retrieve. If the array is empty then all frames in the FrameData are returned.</p></td>
</tr>
<tr>
<td class="name"><code>useNumericIndex</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="default">
true
</td>
<td class="description last"><p>Are the given frames using numeric indexes (default) or strings? (false)</p></td>
</tr>
<tr>
<td class="name"><code>output</code></td>
<td class="type">
<span class="param-type">Array</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="default">
</td>
<td class="description last"><p>If given the results will be appended to the end of this array otherwise a new array will be created.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="FrameData.js.html">animation/FrameData.js</a>, <a href="FrameData.js.html#sunlight-1-line-130">line 130</a>
</li></ul></dd>
</dl>
<h5>Returns:</h5>
<div class="param-desc">
<p>An array of all Frames in this FrameData set matching the given names or IDs.</p>
</div>
<dl>
<dt>
Type
</dt>
<dd>
<span class="param-type">Array</span>
</dd>
</dl>
</dd>
</dl>
</article>
</section>
</div>
<div class="clearfix"></div>
<footer>
<span class="copyright">
Phaser Copyright © 2012-2013 Photon Storm Ltd.
</span>
<br />
<span class="jsdoc-message">
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.2.0-dev</a>
on Wed Oct 23 2013 13:52:00 GMT+0100 (BST) using the <a href="https://github.com/terryweiss/docstrap">DocStrap template</a>.
</span>
</footer>
</div>
<div class="span3">
<div id="toc"></div>
</div>
<br clear="both">
</div>
</div>
<script src="scripts/sunlight.js"></script>
<script src="scripts/sunlight.javascript.js"></script>
<script src="scripts/sunlight-plugin.doclinks.js"></script>
<script src="scripts/sunlight-plugin.linenumbers.js"></script>
<script src="scripts/sunlight-plugin.menu.js"></script>
<script src="scripts/jquery.min.js"></script>
<script src="scripts/jquery.scrollTo.js"></script>
<script src="scripts/jquery.localScroll.js"></script>
<script src="scripts/bootstrap-dropdown.js"></script>
<script src="scripts/toc.js"></script>
<script> Sunlight.highlightAll({lineNumbers:true, showMenu: true, enableDoclinks :true}); </script>
<script>
$( function () {
$( "#toc" ).toc( {
selectors : "h1,h2,h3,h4",
showAndHide : false,
scrollTo : 60
} );
$( "#toc>ul" ).addClass( "nav nav-pills nav-stacked" );
$( "#main span[id^='toc']" ).addClass( "toc-shim" );
} );
</script>
</body>
</html>