Reputation: 654
I have a problem with libgdx on html. I can not solve this problem two days. When i resize a browser the Gdx.graphics in my app does not change. I looked at source code GwtApplication, it was very difficult for me, and I understood Gdx.graphics must be change automatic, but it is not. Sorry for my bad english.
Upvotes: 6
Views: 1993
Reputation: 654
private WebSolve appResizeListner;
private GwtApplicationConfiguration cfg;
class ResizeListner implements ResizeHandler{
@Override
public void onResize(ResizeEvent event) {
int width = event.getWidth();
int height = event.getHeight();
appResizeListner.resize(width, height);
Gdx.graphics.setDisplayMode(width, height, false);
Gdx.gl.glViewport(0, 0, width, height);
Window.scrollTo((cfg.width - width)/2,(cfg.height - height)/2);
}
}
@Override
public GwtApplicationConfiguration getConfig () {
int w = Window.getClientWidth();
int h = Window.getClientHeight();
cfg = new GwtApplicationConfiguration(w, h);
Window.enableScrolling(false);
Window.setMargin("0");
Window.addResizeHandler(new ResizeListner());
return cfg;
}
@Override
public ApplicationListener getApplicationListener () {
appResizeListner = new WebSolve();
return appResizeListner;
}
-This should be write for correct show and resize
Upvotes: 0
Reputation: 3183
First look at how to resize on user input. In your shared project code you could do:
if(Gdx.app.getType() == ApplicationType.WebGL) {
InputAdapter webGlfullscreen = new InputAdapter() {
@Override
public boolean keyUp (int keycode) {
if (keycode == Keys.ENTER) {
if (!Gdx.graphics.isFullscreen()) Gdx.graphics.setDisplayMode(Gdx.graphics.getDisplayModes()[0]);
} else if(keycode == Keys.UP || keycode == Keys.W) {
Gdx.graphics.setDisplayMode(Gdx.graphics.getWidth()+100, Gdx.graphics.getHeight()+100, false);
} else if(keycode == Keys.DOWN || keycode == Keys.S) {
Gdx.graphics.setDisplayMode(Gdx.graphics.getWidth()-100, Gdx.graphics.getHeight()-100, false);
}
return true;
}
};
Gdx.input.setInputProcessor(webGlfullscreen);
}
Adding 100 to each dimension is only correct if you have a square viewport. Adjust for your desired ratio.
LibGDX does not handle GWT window resizing you have to add some code to the -html project because LibGDX doesn't listen for browser resizing so you'll have to add in some GWT code yourself. In your GwtApplication subclass do:
public class GwtLauncher extends GwtApplication {
@Override
public void onModuleLoad () {
super.onModuleLoad();
com.google.gwt.user.client.Window.addResizeHandler(new ResizeHandler() {
public void onResize(ResizeEvent ev) {
Gdx.graphics.setDisplayMode(ev.getWidth(),ev.getHeight(), false);
}
});
}
@Override
public GwtApplicationConfiguration getConfig () {
int height = com.google.gwt.user.client.Window.getClientHeight();
int width = com.google.gwt.user.client.Window.getClientWidth();
GwtApplicationConfiguration cfg = new GwtApplicationConfiguration(width, height);
return cfg;
}
@Override
public ApplicationListener getApplicationListener () {
return new GdxDemoGame();
}
}
Of course now you'll have to deal with aspect ratio issues just like you do on the desktop side.
p.s. I had to look in the GWT backend to figure out if there was already any resizing behavior. That is how I figured out that calls to setDisplayMode would adjust the resolution but also how I saw there was not already a resize listener. You can look yourself at https://github.com/libgdx/libgdx/blob/master/backends/gdx-backends-gwt/src/com/badlogic/gdx/backends/gwt/GwtApplication.java
Upvotes: 7