5

Is there a way in vaadin to scroll or jump to a certain point (e.g. a Label) inside a view (e.g. a Panel)when a button or link component is clicked? Similar to the anchors functionality on a website?

I'm using Vaadin 7.5.9

EDIT: I have a HorizontalSplitPanel. Its first component is a list of items where a user can make a selection. Is an item selected the second component of the HorizontalSplitPanel opens. The second component consists of a VerticalLayout containing a heading and a menu and a Panel. If there is a selection in the menu the Panel should be scrolled to the referred entry.

st.huber
  • 1,481
  • 2
  • 24
  • 45

2 Answers2

11

There's an API on the UI class called scrollIntoView(Component). This is how one calls it

private Label result;

public void scrollToResult() {
  UI.getCurrent().scrollIntoView(result);
}
Raffaele
  • 20,627
  • 6
  • 47
  • 86
  • 1
    Thank you. It does what I want to achive, but not exactly. I have a `VerticalLayout` in the second component of a `HorizontalSplitPanel`. The `VerticalLayout` contains some content and a `Panel`. Within this `Panel` I want to jump to a certain "anchor". Using your suggested method unfortunately also scrolls the second component of the `HorizontalSplitPane` and not just the content of the `Panel`, which is what I'd like to achieve. Any suggestion for that, please? – st.huber Jan 14 '16 at 10:23
  • Try to use a `Link` pointing to a fragment, and give the ID to the component via `.setId(String)` – Raffaele Jan 14 '16 at 10:25
  • Do you mean like that? `Link link = new Link("LinkText", new ExternalResource("#destinationID"));` and for destination component `destComp.setId("destinationID");`? Because that didn't work for me as my url is similar to `.../start#actualContent`. – st.huber Jan 14 '16 at 10:30
  • Thanks for your help. I was able to solve the issue. I needed to correct my `setExpandRatio` settings – st.huber Jan 14 '16 at 11:08
  • 1
    In later version of Vaadin the `scrollIntoView` method is not present. Is there a way to do this in newer version of Vaadin? – Jose Martinez Dec 30 '20 at 23:15
1

You can also execute JS code from your Java Vaadin code to scroll to a Component.

UI.getCurrent().getPage().executeJs("arguments[0].scrollIntoView(true);", componentToScrollTo);
Jose Martinez
  • 11,452
  • 7
  • 53
  • 68