Browser window scroll event

Vaadin 6 / 7 / 8 Framework UI
1

Hi,

I’m trying to create a custom component to Vaadin that loads a component from the server side when the user has scrolled the browser window far enough to show the component. Is there a way of catching the window scroll event on the client side of Vaadin? The basic GWT way of doing it

 Window.addWindowScrollHandler(new Window.ScrollHandler() {

	@Override
	public void onWindowScroll(ScrollEvent event) {
		... some code ...

	}
});

does not seem to work as the body element of the document is never scrolled in Vaadin.

Is there a way of getting this to work?

Thanks.

2

Hi Petri,

You’ve stumbled upon a, yet another, Vaadin gotcha: the main scrollable element in Vaadin apps is not the BODY element, but a DIV element called VView. You should listen for that element’s scroll events.

But since VView is not a ScrollPanel and does not implement the HasScrollHandlers interface, adding a listener for its scroll events is basically impossible at the moment. The only option you have is to add the scroll event listener by using GWT’s native JS interface, which is almost always discouraged (and cumbersome too, I might add).

This is definitely worthy of a ticket, please create a new issue at
dev.vaadin.com

And regarding your custom widget: keep in mind that VView is not the only scrollable element in Vaadin apps. You have Panels and SplitPanels as well…

3

Ok, thanks.

Created a new
ticket
 .

Good point about the other scrollable widgets, have to keep that in mind when I start implementing the
on event
 part of my widget.

4

In case somebody else stumbles over this thread (even though its old)…

In current vaadin version (7.x) you can get scroll events on the client side as follows:

getConnection().getUIConnector().getWidget().addScrollHandler(new ScrollHandler() {
  @Override
  public void onScroll(ScrollEvent event) {
    // do something here..
  }
});