p5.play p5.play

  • API Docs for Version: 3

    • Show:

    Group

    In p5.play groups are collections of sprites with similar behavior. For example a group may contain all the coin sprites that the player can collect.

    Group extends Array. You can use them in for loops just like arrays since they inherit all the properties of standard arrays such as group.length

    Since groups contain only references, a sprite can be in multiple groups and deleting a group doesn't affect the sprites themselves.

    sprite.remove() removes the sprite from all the groups it belongs to.

    Table of Contents

    Constructor

    Group ()

    Defined in v3/p5.play.js:2558

    Methods

    add
    (
    • s
    )

    Defined in v3/p5.play.js:2855

    Adds a sprite to the group. Returns true if the sprite was added because it was not already in the group.

    Parameters:

    • s Sprite

      The sprite to be added

    addAnimation
    (
    • label
    • animation
    )

    Defined in v3/p5.play.js:3043

    Adds an animation to the group. This function should be used in the preload p5.js function. You don't need to name the animation if the sprites in the group will only use one animation. See SpriteAnimation for more information.

    Uses:

    • group.addAnimation(label, animation);
    • group.addAnimation(label, firstFrame, lastFrame);
    • group.addAnimation(label, frame1, frame2, frame3...);

    Parameters:

    • label String

      SpriteAnimation identifier

    • animation SpriteAnimation

      The preloaded animation

    addImage
    (
    • label
    • img
    )

    Defined in v3/p5.play.js:3014

    Adds an image to the Group. An image will be considered a one-frame animation. The image should be preloaded in the preload() function using p5 loadImage. Animations require a identifying label (string) to change them. The image is stored in the Group but not necessarily displayed until Sprite.changeAnimation(label) is called

    Usages:

    • group.addImage(label, image);
    • group.addImage(image);

    If only an image is passed no label is specified

    Parameters:

    • label String | p5.Image

      Label or image

    • [img] p5.Image optional

      Image

    animation
    (
    • anim
    • x
    • y
    )

    Defined in v3/p5.play.js:3678

    Displays an animation. Similar to the p5.js image function.

    Parameters:

    • anim SpriteAnimation

      Animation to be displayed

    • x Number

      X coordinate

    • y Number

      Y coordinate

    background ()

    Defined in v3/p5.play.js:3853

    Just like the p5.js background function except it also accepts a color pallette code.

    bounce
    (
    • target
    • callback
    )
    deprecated

    Defined in v3/p5.play.js:2762

    Deprecated, use group.collide instead.

    Parameters:

    collide
    (
    • target
    • callback
    )

    Defined in v3/p5.play.js:2734

    Checks if a sprite in the group is colliding with another sprite or a group. The check is performed using the sprite's physics body (colliders).

    A callback function can be specified to perform additional operations when contact occurs. If the target is a group the function will be called for each single sprite colliding. The parameter of the function are respectively the current sprite and the colliding sprite.

    Since v3, this function only needs to be called once, it doesn't need to be used in the p5.js draw loop.

    Parameters:

    • target Sprite | Group

      Sprite or group to check against the current one

    • [callback] Function optional

      The function to be called when a collision occurs

    Example:

    group.collide(otherSprite, explosion);

function explosion(spriteA, spriteB) {
  spriteA.remove();
  spriteB.score++;
}
    colorPal
    (
    • c
    • palette
    )

    Defined in v3/p5.play.js:3502

    Gets a color from a color palette

    Parameters:

    • c String

      A single character, a key found in the color palette object.

    • palette Number | Object

      Can be a palette object or number index in the system's palettes array.

    Returns:

    a hex color string for use by p5.js functions

    contains
    (
    • sprite
    )
    Number

    Defined in v3/p5.play.js:2825

    Checks if the group contains a sprite.

    Parameters:

    • sprite Sprite

      The sprite to search

    Returns:

    Number:

    Index or -1 if not found

    createTiles
    (
    • tiles
    )

    Defined in v3/p5.play.js:3263

    Parameters:

    • tiles String | Array

      String or array of strings

    cull
    (
    • top|size
    • bottom|cb
    • left
    • right
    • cb(sprite)
    )

    Defined in v3/p5.play.js:2884

    Remove sprites that go outside the culling boundary

    Parameters:

    • top|size Number

      The distance that sprites can move below the p5.js canvas before they are removed. OR The distance sprites can travel outside the screen on all sides before they get removed.

    • bottom|cb Number

      The distance that sprites can move below the p5.js canvas before they are removed.

    • [left] Number optional

      The distance that sprites can move beyond the left side of the p5.js canvas before they are removed.

    • [right] Number optional

      The distance that sprites can move beyond the right side of the p5.js canvas before they are removed.

    • [cb(sprite)] Function optional

      The callback is given the sprite that passed the cull boundary, if no callback is given the sprite is removed by default

    displace
    (
    • target
    • callback
    )
    deprecated

    Defined in v3/p5.play.js:2774

    Deprecated, use group.collide instead.

    Parameters:

    drawSprites
    (
    • group
    )

    Defined in v3/p5.play.js:3576

    This function is called automatically at the end of the p5.js draw loop unless it was already called in the draw loop.

    Parameters:

    • group Group

      of sprites, allSprites by default

    fill ()

    Defined in v3/p5.play.js:3871

    Just like the p5.js fill function except it also accepts a color pallette code.

    get
    (
    • i
    )
    deprecated

    Defined in v3/p5.play.js:2814

    Gets the member at index i.

    Parameters:

    • i Number

      The index of the object to retrieve

    getKeyCode
    (
    • keyName
    )
    Number

    Defined in v3/p5.play.js:3786

    Get the keyCode of a key

    Parameters:

    • keyName String

    Returns:

    Number:

    keyCode

    getSpriteAt
    (
    • x
    • y
    )

    Defined in v3/p5.play.js:3305

    Returns the sprite at

    Parameters:

    • x Number
    • y Number

    Returns:

    keyIsDown
    (
    • keyName
    )
    Boolean

    Defined in v3/p5.play.js:3806

    Check if key is down.

    Parameters:

    • keyName String

    Returns:

    Boolean:

    true if key is down

    loadAnimation () SpriteAnimation

    Defined in v3/p5.play.js:3618

    Loads an animation. Use this in the preload p5.js function.

    Returns:

    SpriteAnimation
    loadSpriteSheet () SpriteSheet

    Defined in v3/p5.play.js:3607

    Loads a Sprite Sheet. Use this in the preload p5.js function.

    Returns:

    SpriteSheet
    maxDepth () Number

    Defined in v3/p5.play.js:2983

    Returns the highest depth in a group

    Returns:

    Number:

    The depth of the sprite drawn on the top

    minDepth () Number

    Defined in v3/p5.play.js:2998

    Returns the lowest depth in a group

    Returns:

    Number:

    The depth of the sprite drawn on the bottom

    overlap
    (
    • target
    • callback
    )

    Defined in v3/p5.play.js:2786

    Checks if a sprite in the group is overlapping with another sprite or a group. The check is performed using the sprite's physics body (colliders).

    A callback function can be specified to perform additional operations when contact occurs. If the target is a group the function will be called for each single sprite overlapping. The parameter of the function are respectively the current sprite and the overlapping sprite.

    Since v3, this function only needs to be called once, it doesn't need to be used in the p5.js draw loop.

    Parameters:

    • target Sprite | Group

      Sprite or group to check against the current one

    • [callback] Function optional

      The function to be called if overlap is positive

    Example:

    group.overlap(otherSprite, pickup);

function pickup(spriteA, spriteB) {
  spriteA.remove();
  spriteB.itemCount++;
}
    play
    (
    • sound
    )
    Promise

    Defined in v3/p5.play.js:3729

    Awaitable function for playing sounds.

    Parameters:

    • sound p5.Sound

    Returns:

    Promise
    push
    (
    • s
    )

    Defined in v3/p5.play.js:2836

    Adds a sprite to the group. Returns true if the sprite was added because it was not already in the group.

    Parameters:

    • s Sprite

      The sprite to be added

    remove
    (
    • item
    )
    Boolean

    Defined in v3/p5.play.js:2950

    Removes a sprite from the group. Does not remove the actual sprite, only the reference.

    Parameters:

    • item Sprite

      The sprite to be removed

    Returns:

    Boolean:

    true if sprite was found and removed

    removeAll ()

    Defined in v3/p5.play.js:2938

    Removes all the sprites in the group from the scene.

    removeSprites ()

    Defined in v3/p5.play.js:2928

    Removes all the sprites in the group from the scene.

    size ()

    Defined in v3/p5.play.js:2866

    Same as group.length

    spriteArt
    (
    • txt
    • scale
    • palette
    )

    Defined in v3/p5.play.js:3521

    Create pixel art images from a string. Each character in the input string represents a color value defined in the palette object.

    Parameters:

    • txt String

      Each character represents a pixel color value

    • scale Number

      The scale of the image

    • palette Number | Object

      Color palette

    Returns:

    A p5.js Image

    Example:

    let str = ...yyyy .yybyybyy yyyyyyyyyy yybyyyybyy .yybbbbyy ...yyyy;

    let img = spriteArt(str);

    stroke ()

    Defined in v3/p5.play.js:3889

    Just like the p5.js stroke function except it also accepts a color pallette code.

    updateSprites
    (
    • timeStep
    • velocityIterations
    • positionIterations
    )

    Defined in v3/p5.play.js:3271

    This function is automatically called at the end of the p5.js draw loop, unless it was already called in the draw loop.

    Parameters:

    • timeStep Number
    • velocityIterations Number
    • positionIterations Number

    Properties

    allSprites

    Unknown

    Defined in v3/p5.play.js:3911

    A group of all the sprites.

    animations

    Object

    Defined in v3/p5.play.js:2581

    Keys are the animation label, values are SpriteAnimation objects.

    collides

    Unknown

    Defined in v3/p5.play.js:2589

    Contains all the collision callback functions for this sprite when it comes in contact with other sprites or groups.

    gravity

    Unknown

    Defined in v3/p5.play.js:3189

    Gravity vector

    layer

    Unknown

    Defined in v3/p5.play.js:2628

    The default layer for sprites in the group.

    offset.x

    Unknown

    Defined in v3/p5.play.js:3118

    offset.y

    Unknown

    Defined in v3/p5.play.js:3128

    overlaps

    Unknown

    Defined in v3/p5.play.js:2596

    Contains all the overlap callback functions for this sprite when it comes in contact with other sprites or groups.