smart-mobile-studio

Repaint AND resize in TW3CustomGameApplication?


SMS version 2.1.2.3592

How do I do a Repaint or call the PaintView method, when the application has been resized by the browser (in a TW3CustomGameApplication) ?

I am using the GameView.Width and GameView.Height properties to determine the dimensions of a lot of things in my app. When the applications size changes, I need to redraw or repaint

Doesn't look like there is a Resize event to override.

Questions

1.) How to trap the resize event?

2.) How do I repaint?


Solution

  • I'm not very familiar with the internals of the TW3CustomGameApplication class, but at any time it should be possible to add a dedicated event handler for every event that occurs on the JavaScript side.

    For example you can hook the resize event for underlying canvas element with code like this:

    GameView.Context.Handle.addEventListener('resize', @ResizeEvent);
    

    with ResizeEvent looking like

    procedure TYourClass.ResizeEvent(Event: JEvent);
    begin
      // handle resizing
    end;
    

    Alternatively you can also hook the global window resizing with this code:

    Window.addEventListener('resize', @ResizeEvent);
    

    This can be useful if you have a fixed size canvas and want to adjust it according to the window size manually.

    Since this hooks the underlying W3C low level APIs you might need to add the units W3C.HTML5 and W3C.DOM.

    The advantage of using the underlying low level APIs is the good documentation / specification by the W3C and others, like:

    The downside of this approach is that you need to do everything yourself (reinvent the wheel).

    For small size applications or a RAD workflow I would definitely suggest to stick with the code that TW3CustomGameApplication offers, but for a big project looking deeper makes probably more sense.