Q.Sprite Class
Basic sprite class - will render either and asset or a frame from a sprite sheet.
Auto sets the width and height (p.w and p.h) from the provided image asset and
centers the sprite so 0,0 is the center of the provide image.
Most of the times you'll sub-class Q.Sprite
Item Index
Methods
add
-
components
Adds one or more components to an object. Accepts either a comma separated string or an array of strings that map to component names.
Instantiates a new component object of the correct type (if the component exists) and then triggers an addComponent event.
For example:
this.add("2d, aiBounce")Returns the object to allow chaining.
Parameters:
-
componentsString- comma separated list of components to add
Returns:
returns this for chaining purposes
asset
-
[name] -
[resize]
Get or set the asset associate with this sprite
Parameters:
-
[name]String optional- leave empty to return the asset, add to set the asset
-
[resize]Boolean optional- force a call to
size()and_generatePoints
- force a call to
center
()
Center sprite inside of it's container (or the stage)
debind
()
debind is called to remove any listeners an object had
on other objects. The most common case is when an object is
destroyed you'll want all the event listeners to be removed
for you.
del
-
components
Removes one or more components from an object. Accepts the
same style of parameters as add. Triggers a delComponent event
and and calls destroy on the component.
Returns the element to allow chaining.
Parameters:
-
componentsString- comma separated list of components to remove
Returns:
returns this for chaining purposes
draw
-
ctx
Draw the asset on the stage. the context passed in is alreay transformed.
All you need to do is a draw the sprite centered at 0,0
Parameters:
-
ctxContext2D
extend
-
className -
properties -
[classMethods]
Create a new Class that inherits from this class
Parameters:
-
classNameString -
propertiesObject- hash of properties (init will be the constructor)
-
[classMethods]Object optional- optional class methods to add to the class
has
-
component
Simple check to see if a component already exists on an object by searching for a property of the same name.
Parameters:
-
componentString- name of component to test against
Returns:
hide
()
Hide the sprite (render returns without rendering)
init
-
props -
[defaultProps]
Default sprite constructor, takes in a set of properties and a set of default properties (useful when you create a subclass of sprite) Default properties:
{
asset: null, // asset to use
sheet: null, // sprite sheet to use (overrides asset)
x: 0,
y: 0,
z: 0,
w: 0, // width, set from p.asset or p.sheet
h: 0, // height, set from p.asset or p.sheet
cx: w/2, // center x, defaults to center of the asset or sheet
cy: h/2, // center y, default same as cx
// points defines the collision shape, override to customer the collision shape,
// must be a convex polygon in clockwise order
points: [ [ -w/2, -h/2 ], [ w/2, -h/2 ], [ w/2, h/2 ], [ -w/2, h/2 ] ],
opacity: 1,
angle: 0,
frame: 0
type: Q.SPRITE_DEFAULT | Q.SPRITE_ACTIVE,
name: '',
sort: false, // set to true to force children to be sorted by theier p.z,
hidden: false, // set to true to hide the sprite
flip: "" // set to "x", "y", or "xy" to flip sprite over that dimension
}Parameters:
-
propsObject- property has that will be turned into
p
- property has that will be turned into
-
[defaultProps]Object optional- default properties that are assigned only if there's not a corresponding value in
props
- default properties that are assigned only if there's not a corresponding value in
isA
-
className
See if a object is a specific class
Parameters:
-
classNameString- class to check against
off
-
event -
[target] -
[callback]
Unbinds an event. Can be called with 1, 2, or 3 parameters, each of which unbinds a more specific listener.
Parameters:
-
eventString- name of event
-
[target]Object optional- optionally limit to a specific target
-
[callback]Function optional- optionally limit to one specific callback
on
-
event -
[target] -
[callback]
Binds a callback to an event on this object. If you provide a
target object, that object will add this event to it's list of
binds, allowing it to automatically remove it when it is destroyed.
Parameters:
-
eventString- name or comma separated list of events
-
[target]Object optional- optional context for callback, defaults to the Evented
-
[callback]Function optional- callback (optional - defaults to name of event on context
render
-
ctx
Default render method for the sprite. Don't overload this unless you want to
handle all the transform and scale stuff yourself. Rather overload the draw method.
Parameters:
-
ctxContext2D- context to render to
set
-
properties
Set a set of p properties on a Sprite
Parameters:
-
propertiesObject- hash of properties to set
sheet
-
[name] -
[resize]
Get or set the sheet associate with this sprite
Parameters:
-
[name]String optional- leave empty to return the sprite sheet, add to resize
-
[resize]Boolean optional- force a resize
show
()
Show the sprite
size
-
force
Resets the width, height and center based on the asset or sprite sheet
Parameters:
-
forceBoolean- force a reset (call if w or h changes)
trigger
-
event -
[data]
Triggers an event, passing in some optional additional data about the event.
Parameters:
-
eventString- name of event
-
[data]Object optional- optional data to pass to the callback
update
-
dt
Update method is called each step with the time elapsed since the last step.
Doesn't do anything other than trigger events, call a step method if defined
and run update on all its children.
Generally leave this method alone and define a step method that will be called
Parameters:
-
dtFloat- time elapsed since last call