Basic example for using h2d.Camera to move the world but keep the HUD in place?

I’ve been trying to wrap my head around using the h2d.Camera but I can’t quite get it just yet. Is there any basic example of using it so that my in-game elements are being followed while the HUD elements do not scroll with the background?

Actually once you’ve seen it it’s quite simple. You split the rendering for the scene that shows your game’s world and the scene that has the HUD/GUI. Like so:

// this method is from the hxd.App class, so override it in the class extending it
override function render(e:Engine) {
        // all here are extending h2d.Scene (or h3d.Scene):
        world.render(e); // your game's world, by default is the s2d scene and which has the camera
        general_user_interface.render(e); // your HUD so to speak
    }

Hope it works for you. Then you should be able to treat them separatedly.


import h3d.Engine;
import h2d.Scene;

class SomeApp extends hxd.App {

    private var hud : h2d.Scene;

    override function render(e:Engine) {
        s2d.render(e);
        hud.render(e);
    }

    override function update(dt:Float) {
        moveCameraAround();
    }

    private function moveCameraAround() {

        var c = s2d.camera;
        if(hxd.Key.isPressed( hxd.Key.MOUSE_WHEEL_UP ))
            c.scale(1.25, 1.25);
        if(hxd.Key.isPressed( hxd.Key.MOUSE_WHEEL_DOWN ))
            c.scale(0.8, 0.8);

        var moveMapSpeed = 10;
        if(hxd.Key.isDown( hxd.Key.RIGHT ))
            c.x += moveMapSpeed / c.scaleX;
        if(hxd.Key.isDown( hxd.Key.LEFT ))
            c.x -= moveMapSpeed / c.scaleX;
        if(hxd.Key.isDown( hxd.Key.DOWN ))
            c.y += moveMapSpeed / c.scaleY;
        if(hxd.Key.isDown( hxd.Key.UP ))
            c.y -= moveMapSpeed / c.scaleY;

    }

    override function init() {

        // world
        var t = new h2d.Text( hxd.res.DefaultFont.get(), s2d );
        t.setPosition( s2d.width/2, s2d.height/2 );
        t.text = 'I´m fixed in the world';
        
        // hud
        this.hud = new MyHUD();
        this.sevents.addScene( hud ); // otherwise the HUD cannot get evented by App.hxd, doesn't receive mouse interaction etc.
    }

    static function main() {
        new SomeApp();
    }
}

class MyHUD extends h2d.Scene {
    public function new() {
        super();
        var ia = new h2d.Interactive( 200, 50, this );
        ia.backgroundColor = 0xFFAAAAAA;
        var t = new h2d.Text( hxd.res.DefaultFont.get(), ia );
        t.text = "Button stays in HUD";
    }
}

Oh, I was going to say that I was using the camera.follow function to focus on the player entity and after I’ve overridden render, it did work but some things like my ScaleMode goes funky and inconsistently behaving

Ok, I see. You could also ask in #Heaps on the discord server for Haxe.

1 Like