How to get Browser Screen Width & Height .....

Good Morning,

actually I need to create a GridLayout where some Panels get placed. The panels need to have a width between 250px and 300px and a height proportion of width / 3*2. this is needed cause it has the best design and usabilitty.

As so far, I need to know the clients resolution (Browser.InnerWidth & browser.InnerHeight) when the Web-page gets loaded. Is there any way to get the Screen Details? In our former Intranet we used PHP, JavaScript and Ajax which made a reload on the first load which transferred the Screen Resolution. But I have no idea how to solve this in VAADIN.

Regards
Dirk

Hi,

please see
this message
for a possible solution.

Good morning,

the example was not working, … width & height where always 0.
Any other idea?

Regards,
Dirk

If I remember correctly, they are not yet available at application init().

However, they might be available when a component is attached to the main layout, so you might want to hook into the attach() method.

Yeah, that example seems to be a bit outdated, sorry about that.

Looks like you can get the client width and height from the main window (or any other application-level window) by calling Window.getBrowserWindowHeight() and Window.getBrowserWindowWidth() methods. Do note that this information is not available during the init() run of the application, but only after the window has been attached and shown to the user.

To get constant updates on window resizes, you must set the main window immediate and add a Window.ResizeListener to it and handle the issue there.

fine, that was working! thanx…

and for anyone with the same problem:


import com.vaadin.Application;
import com.vaadin.ui.*;
import com.vaadin.ui.Window.ResizeEvent;

public class BrowserApplication extends Application 
{		
	private static final long serialVersionUID = 1L;
	private Window cMainWindow;
	private Label cTest;
	
	@Override
	public void init() 
	{
		this.cMainWindow = new Window("Test-Window");
		this.cMainWindow.setImmediate(true);
		cTest = new Label("empty");
		this.cMainWindow.addComponent(cTest);
		
		this.cMainWindow.addListener(new Window.ResizeListener() 
		{
			private static final long serialVersionUID = 1L;

			public void windowResized(ResizeEvent e) 
			{
				cTest.setValue("Resolution: " + Integer.toString(cMainWindow.getBrowserWindowWidth()) + " / " + Integer.toString(cMainWindow.getBrowserWindowHeight()));
			}
		});
		
		setMainWindow(this.cMainWindow);
	}

}