How to draw a h2d.Graphics that updates on every frame

Actually I want to have a little rectangle pulled by the mouse so the user can select something, just like when you select multiple files on your OS’s desktop. I was thinking I just draw something and then like “flush” or “clear” the Object’s render pane, I really don’t know. I tried the following code (this is just e.g. so you can try it yourself):

import hxd.Event;

class TestApp01 extends hxd.App {
    var helloGraphics : h2d.Graphics;

    override function init(){
        helloGraphics = new h2d.Graphics( s2d );
        helloGraphics.lineStyle(1, 0x00FF00);
        hxd.Window.getInstance().addEventTarget(onEvent); // (just to use the onEvent function)

    override function update(dt:Float) {
        helloGraphics.drawRect( 32, 32, s2d.mouseX , s2d.mouseY );

    function onEvent(event : hxd.Event) {
        if(event.button == 1){ // on right mouse button
            // helloGraphics.flush(); // this ??
             helloGraphics.clear(); // or this maybe ??? but then it can't draw anymore! :o
            // so do I then need to re-render stuff like:
            // helloGraphics.draw( new h2d.RenderContext( new Scene() ) ); // ??????

    static function main() {
        new TestApp01();


So, thanks in advance. :slightly_smiling_face:

Yes you clear and do again lineStyle and drawRect for example

1 Like

Fundamentally, clearing and redrawing is how most rendering works :wink:

1 Like

The answer is so simple, yet didn’t see it. Thank you!

Now in this context, it seems logical to me when I think about it.

1 Like