【问题标题】:Anchor-like functionality in Vaadin to jump/scroll to a certain pointVaadin 中类似锚点的功能,用于跳转/滚动到某个点
【发布时间】:2016-01-13 22:27:57
【问题描述】:

当单击按钮或链接组件时,vaadin 是否有办法滚动或跳转到视图(例如 Panel)内的某个点(例如 Label)?类似于网站上的锚点功能?

我正在使用 Vaadin 7.5.9

编辑: 我有一个HorizontalSplitPanel。它的第一个组件是用户可以进行选择的项目列表。被选中的项目是HorizontalSplitPanel 打开的第二个组件。第二个组件由包含标题和菜单的VerticalLayoutPanel 组成。如果菜单中有选择,则应将 Panel 滚动到引用的条目。

【问题讨论】:

    标签: java vaadin vaadin7 anchor-scroll


    【解决方案1】:

    您还可以从 Java Vaadin 代码中执行 JS 代码以滚动到组件。

    UI.getCurrent().getPage().executeJs("arguments[0].scrollIntoView(true);", componentToScrollTo);
    

    【讨论】:

      【解决方案2】:

      在 UI 类上有一个名为 scrollIntoView(Component) 的 API。就是这样称呼的

      private Label result;
      
      public void scrollToResult() {
        UI.getCurrent().scrollIntoView(result);
      }
      

      【讨论】:

      • 谢谢。它做了我想要实现的,但不完全是。我在HorizontalSplitPanel 的第二个组件中有一个VerticalLayoutVerticalLayout 包含一些内容和一个Panel。在这个Panel 中,我想跳到某个“锚点”。不幸的是,使用您建议的方法还会滚动HorizontalSplitPane 的第二个组件,而不仅仅是Panel 的内容,这是我想要实现的。请问有什么建议吗?
      • 尝试使用Link指向一个片段,并通过.setId(String)将ID给组件
      • 你是这个意思吗? Link link = new Link("LinkText", new ExternalResource("#destinationID")); 和目标组件 destComp.setId("destinationID");?因为这对我不起作用,因为我的网址类似于 .../start#actualContent
      • 感谢您的帮助。我能够解决这个问题。我需要更正我的 setExpandRatio 设置
      • 在更高版本的 Vaadin 中,scrollIntoView 方法不存在。有没有办法在较新版本的 Vaadin 中做到这一点?
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-02-04
      • 2014-05-24
      • 2012-05-24
      • 1970-01-01
      相关资源
      最近更新 更多