phaser/docs/Phaser.Button.html

4130 lines
No EOL
59 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Phaser Class: Button</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.BitmapText.html">BitmapText</a>
</li>
<li>
<a href="Phaser.Button.html">Button</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.Events.html">Events</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.GameObjectFactory.html">GameObjectFactory</a>
</li>
<li>
<a href="Phaser.Graphics.html">Graphics</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.Physics.html">Physics</a>
</li>
<li>
<a href="Phaser.Physics.Arcade.html">Arcade</a>
</li>
<li>
<a href="Phaser.Physics.Arcade.Body.html">Body</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.Polygon.html">Polygon</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.RenderTexture.html">RenderTexture</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.Sprite.html">Sprite</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.Text.html">Text</a>
</li>
<li>
<a href="Phaser.TileSprite.html">TileSprite</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#bottom">bottom</a>
</li>
<li>
<a href="global.html#HEXtoRGB">HEXtoRGB</a>
</li>
<li>
<a href="global.html#right">right</a>
</li>
</ul>
</li>
</ul>
</div>
</div>
<div class="row-fluid">
<div class="span8">
<div id="main">
<h1 class="page-title">Class: Button</h1>
<section>
<header>
<h2>
<span class="ancestors"><a href="Phaser.html">Phaser</a>.</span>
Button
</h2>
<div class="class-description"><p>Phaser.Button</p></div>
</header>
<article>
<div class="container-overview">
<dt>
<h4 class="name" id="Button"><span class="type-signature"></span>new Button<span class="signature">(game, <span class="optional">x</span>, <span class="optional">y</span>, <span class="optional">key</span>, <span class="optional">callback</span>, <span class="optional">callbackContext</span>, <span class="optional">overFrame</span>, <span class="optional">outFrame</span>, <span class="optional">downFrame</span>)</span><span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>Create a new <code>Button</code> object. A Button is a special type of Sprite that is set-up to handle Pointer events automatically. The four states a Button responds to are:
'Over' - when the Pointer moves over the Button. This is also commonly known as 'hover'.
'Out' - when the Pointer that was previously over the Button moves out of it.
'Down' - when the Pointer is pressed down on the Button. I.e. touched on a touch enabled device or clicked with the mouse.
'Up' - when the Pointer that was pressed down on the Button is released again.
You can set a unique texture frame and Sound for any of these states.</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>game</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Game.html">Phaser.Game</a></span>
</td>
<td class="attributes">
</td>
<td class="description last"><p>Current game instance.</p></td>
</tr>
<tr>
<td class="name"><code>x</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>X position of the Button.</p></td>
</tr>
<tr>
<td class="name"><code>y</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>Y position of the Button.</p></td>
</tr>
<tr>
<td class="name"><code>key</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>The image key as defined in the Game.Cache to use as the texture for this Button.</p></td>
</tr>
<tr>
<td class="name"><code>callback</code></td>
<td class="type">
<span class="param-type">function</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>The function to call when this Button is pressed.</p></td>
</tr>
<tr>
<td class="name"><code>callbackContext</code></td>
<td class="type">
<span class="param-type">object</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>The context in which the callback will be called (usually 'this').</p></td>
</tr>
<tr>
<td class="name"><code>overFrame</code></td>
<td class="type">
<span class="param-type">string</span>
|
<span class="param-type">number</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>This is the frame or frameName that will be set when this button is in an over state. Give either a number to use a frame ID or a string for a frame name.</p></td>
</tr>
<tr>
<td class="name"><code>outFrame</code></td>
<td class="type">
<span class="param-type">string</span>
|
<span class="param-type">number</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>This is the frame or frameName that will be set when this button is in an out state. Give either a number to use a frame ID or a string for a frame name.</p></td>
</tr>
<tr>
<td class="name"><code>downFrame</code></td>
<td class="type">
<span class="param-type">string</span>
|
<span class="param-type">number</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>This is the frame or frameName that will be set when this button is in a down state. Give either a number to use a frame ID or a string for a frame name.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-28">line 28</a>
</li></ul></dd>
</dl>
</dd>
</div>
<h3 class="subsection-title">Members</h3>
<dl>
<dt>
<h4 class="name" id="forceOut"><span class="type-signature"></span>forceOut<span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>When the Button is clicked you can optionally force the state to &quot;out&quot;.</p>
</div>
<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>forceOut</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="description last"></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-default">Default Value:</dt>
<dd class="tag-default"><ul class="dummy"><li>true</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-177">line 177</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="freezeFrames"><span class="type-signature"></span>freezeFrames<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>freezeFrames</code></td>
<td class="type">
<span class="param-type">boolean</span>
</td>
<td class="description last"><p>When true the Button will cease to change texture frame on all events (over, out, up, down).</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-170">line 170</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onDownSound"><span class="type-signature"></span>onDownSound<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>onDownSound</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Sound.html">Phaser.Sound</a></span>
</td>
<td class="description last"><p>The Sound to be played when this Buttons Down state is activated.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-default">Default Value:</dt>
<dd class="tag-default"><ul class="dummy"><li>null</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-115">line 115</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onDownSoundMarker"><span class="type-signature"></span>onDownSoundMarker<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>onDownSoundMarker</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last"><p>The Sound Marker used in conjunction with the onDownSound.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-139">line 139</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onInputDown"><span class="type-signature"></span>onInputDown<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>onInputDown</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Signal.html">Phaser.Signal</a></span>
</td>
<td class="description last"><p>The Signal (or event) dispatched when this Button is in an Down state.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-160">line 160</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onInputOut"><span class="type-signature"></span>onInputOut<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>onInputOut</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Signal.html">Phaser.Signal</a></span>
</td>
<td class="description last"><p>The Signal (or event) dispatched when this Button is in an Out state.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-155">line 155</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onInputOver"><span class="type-signature"></span>onInputOver<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>onInputOver</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Signal.html">Phaser.Signal</a></span>
</td>
<td class="description last"><p>The Signal (or event) dispatched when this Button is in an Over state.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-150">line 150</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onInputUp"><span class="type-signature"></span>onInputUp<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>onInputUp</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Signal.html">Phaser.Signal</a></span>
</td>
<td class="description last"><p>The Signal (or event) dispatched when this Button is in an Up state.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-165">line 165</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onOutSound"><span class="type-signature"></span>onOutSound<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>onOutSound</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Sound.html">Phaser.Sound</a></span>
</td>
<td class="description last"><p>The Sound to be played when this Buttons Out state is activated.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-default">Default Value:</dt>
<dd class="tag-default"><ul class="dummy"><li>null</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-109">line 109</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onOutSoundMarker"><span class="type-signature"></span>onOutSoundMarker<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>onOutSoundMarker</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last"><p>The Sound Marker used in conjunction with the onOutSound.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-133">line 133</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onOverSound"><span class="type-signature"></span>onOverSound<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>onOverSound</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Sound.html">Phaser.Sound</a></span>
</td>
<td class="description last"><p>The Sound to be played when this Buttons Over state is activated.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-default">Default Value:</dt>
<dd class="tag-default"><ul class="dummy"><li>null</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-103">line 103</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onOverSoundMarker"><span class="type-signature"></span>onOverSoundMarker<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>onOverSoundMarker</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last"><p>The Sound Marker used in conjunction with the onOverSound.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-127">line 127</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onUpSound"><span class="type-signature"></span>onUpSound<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>onUpSound</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Sound.html">Phaser.Sound</a></span>
</td>
<td class="description last"><p>The Sound to be played when this Buttons Up state is activated.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-default">Default Value:</dt>
<dd class="tag-default"><ul class="dummy"><li>null</li></ul></dd>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-121">line 121</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onUpSoundMarker"><span class="type-signature"></span>onUpSoundMarker<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>onUpSoundMarker</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="description last"><p>The Sound Marker used in conjunction with the onUpSound.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-145">line 145</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="type"><span class="type-signature"></span>type<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>type</code></td>
<td class="type">
<span class="param-type">number</span>
</td>
<td class="description last"><p>The Phaser Object Type.</p></td>
</tr>
</tbody>
</table>
</dl>
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-41">line 41</a>
</li></ul></dd>
</dl>
</dd>
</dl>
<h3 class="subsection-title">Methods</h3>
<dl>
<dt>
<h4 class="name" id="onInputOverHandler"><span class="type-signature">&lt;protected> </span>onInputOverHandler<span class="signature">(pointer)</span><span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>Internal function that handles input events.</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>pointer</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Pointer.html">Phaser.Pointer</a></span>
</td>
<td class="description last"><p>The Pointer that activated the Button.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-401">line 401</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onInputOverHandler"><span class="type-signature">&lt;protected> </span>onInputOverHandler<span class="signature">(pointer)</span><span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>Internal function that handles input events.</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>pointer</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Pointer.html">Phaser.Pointer</a></span>
</td>
<td class="description last"><p>The Pointer that activated the Button.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-433">line 433</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onInputOverHandler"><span class="type-signature">&lt;protected> </span>onInputOverHandler<span class="signature">(pointer)</span><span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>Internal function that handles input events.</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>pointer</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Pointer.html">Phaser.Pointer</a></span>
</td>
<td class="description last"><p>The Pointer that activated the Button.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-465">line 465</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="onInputOverHandler"><span class="type-signature">&lt;protected> </span>onInputOverHandler<span class="signature">(pointer)</span><span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>Internal function that handles input events.</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>pointer</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Pointer.html">Phaser.Pointer</a></span>
</td>
<td class="description last"><p>The Pointer that activated the Button.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-497">line 497</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="setDownSound"><span class="type-signature"></span>setDownSound<span class="signature">(sound, <span class="optional">marker</span>)</span><span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>The Sound to be played when a Pointer clicks on this Button.</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>sound</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Sound.html">Phaser.Sound</a></span>
</td>
<td class="attributes">
</td>
<td class="description last"><p>The Sound that will be played.</p></td>
</tr>
<tr>
<td class="name"><code>marker</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>A Sound Marker that will be used in the playback.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-377">line 377</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="setFrames"><span class="type-signature"></span>setFrames<span class="signature">(<span class="optional">overFrame</span>, <span class="optional">outFrame</span>, <span class="optional">downFrame</span>)</span><span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>Used to manually set the frames that will be used for the different states of the button
exactly like setting them in the constructor.</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>overFrame</code></td>
<td class="type">
<span class="param-type">string</span>
|
<span class="param-type">number</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>This is the frame or frameName that will be set when this button is in an over state. Give either a number to use a frame ID or a string for a frame name.</p></td>
</tr>
<tr>
<td class="name"><code>outFrame</code></td>
<td class="type">
<span class="param-type">string</span>
|
<span class="param-type">number</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>This is the frame or frameName that will be set when this button is in an out state. Give either a number to use a frame ID or a string for a frame name.</p></td>
</tr>
<tr>
<td class="name"><code>downFrame</code></td>
<td class="type">
<span class="param-type">string</span>
|
<span class="param-type">number</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>This is the frame or frameName that will be set when this button is in a down state. Give either a number to use a frame ID or a string for a frame name.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-200">line 200</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="setOutSound"><span class="type-signature"></span>setOutSound<span class="signature">(sound, <span class="optional">marker</span>)</span><span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>The Sound to be played when a Pointer moves out of this Button.</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>sound</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Sound.html">Phaser.Sound</a></span>
</td>
<td class="attributes">
</td>
<td class="description last"><p>The Sound that will be played.</p></td>
</tr>
<tr>
<td class="name"><code>marker</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>A Sound Marker that will be used in the playback.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-329">line 329</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="setOverSound"><span class="type-signature"></span>setOverSound<span class="signature">(sound, <span class="optional">marker</span>)</span><span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>The Sound to be played when a Pointer moves over this Button.</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>sound</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Sound.html">Phaser.Sound</a></span>
</td>
<td class="attributes">
</td>
<td class="description last"><p>The Sound that will be played.</p></td>
</tr>
<tr>
<td class="name"><code>marker</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>A Sound Marker that will be used in the playback.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-305">line 305</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="setSounds"><span class="type-signature"></span>setSounds<span class="signature">(<span class="optional">overSound</span>, <span class="optional">overMarker</span>, <span class="optional">downSound</span>, <span class="optional">downMarker</span>, <span class="optional">outSound</span>, <span class="optional">outMarker</span>, <span class="optional">upSound</span>, <span class="optional">upMarker</span>)</span><span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>Sets the sounds to be played whenever this Button is interacted with. Sounds can be either full Sound objects, or markers pointing to a section of a Sound object.
The most common forms of sounds are 'hover' effects and 'click' effects, which is why the order of the parameters is overSound then downSound.
Call this function with no parameters at all to reset all sounds on this Button.</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>overSound</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Sound.html">Phaser.Sound</a></span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>Over Button Sound.</p></td>
</tr>
<tr>
<td class="name"><code>overMarker</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>Over Button Sound Marker.</p></td>
</tr>
<tr>
<td class="name"><code>downSound</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Sound.html">Phaser.Sound</a></span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>Down Button Sound.</p></td>
</tr>
<tr>
<td class="name"><code>downMarker</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>Down Button Sound Marker.</p></td>
</tr>
<tr>
<td class="name"><code>outSound</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Sound.html">Phaser.Sound</a></span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>Out Button Sound.</p></td>
</tr>
<tr>
<td class="name"><code>outMarker</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>Out Button Sound Marker.</p></td>
</tr>
<tr>
<td class="name"><code>upSound</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Sound.html">Phaser.Sound</a></span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>Up Button Sound.</p></td>
</tr>
<tr>
<td class="name"><code>upMarker</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>Up Button Sound Marker.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-281">line 281</a>
</li></ul></dd>
</dl>
</dd>
<dt>
<h4 class="name" id="setUpSound"><span class="type-signature"></span>setUpSound<span class="signature">(sound, <span class="optional">marker</span>)</span><span class="type-signature"></span></h4>
</dt>
<dd>
<div class="description">
<p>The Sound to be played when a Pointer clicks on this Button.</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>sound</code></td>
<td class="type">
<span class="param-type"><a href="Phaser.Sound.html">Phaser.Sound</a></span>
</td>
<td class="attributes">
</td>
<td class="description last"><p>The Sound that will be played.</p></td>
</tr>
<tr>
<td class="name"><code>marker</code></td>
<td class="type">
<span class="param-type">string</span>
</td>
<td class="attributes">
&lt;optional><br>
</td>
<td class="description last"><p>A Sound Marker that will be used in the playback.</p></td>
</tr>
</tbody>
</table>
<dl class="details">
<dt class="tag-source">Source:</dt>
<dd class="tag-source"><ul class="dummy"><li>
<a href="Button.js.html">gameobjects/Button.js</a>, <a href="Button.js.html#sunlight-1-line-353">line 353</a>
</li></ul></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.3.0-dev</a>
on Thu Nov 07 2013 06:07:34 GMT-0000 (GMT) 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>