Dynamic Texture Camera Control

Demonstrates how to use the internal camera of a Dynamic Texture to offset and position content rendered within it.

800 × 600

class Example extends Phaser.Scene
{
    constructor ()
    {
        super();
    }

    preload ()
    {
        this.load.setBaseURL('https://cdn.phaserfiles.com/v410');
        this.load.atlas('banner', 'assets/atlas/banners.png', 'assets/atlas/banners.json');
    }

    create ()
    {
        const banner = this.textures.addDynamicTexture('playerBanner', 512, 512);

        banner.camera.scrollY -= 100;

        banner.stamp('banner', 'Banner_02', 256, 256).render();

        this.add.sprite(400, 300, 'playerBanner');
    }
}

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

const game = new Phaser.Game(config);

More in Dynamic Textures7 examples

Dynamic Texture StampingCreate custom textures at runtime by compositing multiple frames from an atlas using the stamp method, featuring custom blend modes, alpha settings, and sprite-like origins.

Get Pixel From Dynamic TextureDemonstrates how to retrieve color data from a specific coordinate within a Dynamic Texture using the snapshotPixel method.

Masked Sprite to Dynamic TextureDemonstrates how to apply an external mask to a sprite and draw the resulting masked image into a Dynamic Texture.

Multiple Dynamic TexturesCreate and manage multiple unique textures at runtime by composing atlas frames. Demonstrates using the stamp method to draw, scale, and blend multiple assets onto new dynamic texture instances.