は、コンポーネント

Question

私は2つの（大きな）成分を含むVerticalLayoutを持っているの交換時Vaadinがスクロールしないことを確認します。 グラフは、グリッドの選択に従って更新されます。私はこのためメソッドVerticalLayoutのreplaceComponentを使用しています。したがって、グリッド内の項目を選択すると、図表が更新されますが、ブラウザの代わりにの代わりにがスクロールしてスクロールします。これはおそらく、Vaadinが最初にDOMからチャートを削除し、新しいチャートを追加するためです。

コンポーネントの交換中にスクロール位置を維持できますか？

これまでのところ、ネット上で何の回答も見つかりませんでした。必要に応じてSSCCEを作成することができます。

Answer 1

Andréのおかげで、交換されたコンポーネントの固定高さを設定すると問題が解決されたことがわかりました。 SSCCEは次のとおりです。

@Override 
protected void init(VaadinRequest request) { 
    VerticalLayout layout = new VerticalLayout(); 
    layout.setMargin(true); 
    layout.setSpacing(true); 
    setContent(layout); 

    TextField t1 = new TextField("Big field (1)"); 
    t1.setWidth("300px"); 
    t1.setHeight("1000px"); 
    layout.addComponent(t1); 

    TextField t2 = new TextField("Big field (2)"); 
    t2.setWidth("300px"); 
    t2.setHeight("1000px"); 
    layout.addComponent(t2); 

    final Component[] toReplace = new Component[] { t2 }; 

    Button button = new Button("Click Me"); 
    button.addClickListener(event -> { 
     Table t = new Table(); 
     t.addContainerProperty("Name", String.class, null); 
     for (int i = 0; i < 20; i++) { 
      t.addItem(new Object[] { "" + i }, i); 
     } 
     //t.setHeight("200px"); 

     layout.replaceComponent(toReplace[0], t); 
     toReplace[0] = t; 
    }); 
    layout.addComponent(button); 

    setContent(layout); 
} 

高さが設定されていないと、スクロールの問題が発生します。

Answer 2

UI objectは、getScrollTopおよびsetScrollTopの方法を有する。

これにより、要件を満たすことが可能になるはずです。 コンポーネントを削除する前にgetScrollTopを使用してスクロールバーの位置を取得し、オブジェクトを変更した後に、以前に保存した値にsetScrollTopを使用します。