Phaser home
Log in

Image Alpha

Demonstrates how to change the transparency of an image by setting its alpha property.

Image Alpha, running
800 × 600
GitHub
class Example extends Phaser.Scene
{
    preload ()
    {
        this.load.setBaseURL('https://cdn.phaserfiles.com/v410');
        this.load.image('bunny', 'assets/sprites/bunny.png');
    }

    create ()
    {
        const bunny = this.add.image(400, 300, 'bunny');

        bunny.alpha = 0.5;
    }
}

const config = {
    scale: { mode: Phaser.Scale.FIT },
    type: Phaser.WEBGL,
    parent: 'game-container',
    width: 800,
    height: 600,
    scene: Example
};

const game = new Phaser.Game(config);

More in Images16 examples

Image BoundsDemonstrates how to retrieve and visualize the axis-aligned bounding box (AABB) of rotating and scaling images using the getBounds method.Image Edge PointsDemonstrates how to retrieve the world coordinates of an Image's corners and center edges using methods like getTopLeft and getBottomRight, even as the object rotates and scales.Image OffsetDemonstrates how to position multiple images at specific X and Y coordinates within a scene.Image RotationRotate an image by incrementing its rotation property inside the update loop.