如何使ScrollPanel仅在其内部窗口小部件高于它时才可见;内部小部件比它短的时候不可见？

Question

好吧，说我有一个高度=“500px”的ScrollPanel。 ScrollPanel内部有一个HTMLPanel。

有时，HTMLPanel有更多内容，因此它将高于“500px”，例如：700px。另一方面，HTMLPanel的内容较少，因此它将比“500px”短，例如300px。

当HTMLPanel高于500px时，会出现一个滚动条。这是有道理的。没问题。

然而，问题是当HTMLPanel短于500px（例如，300px）时，没有出现滚动条，但ScrollPanel仍然显示高度为500px。所以有200px高度差距未使用，＆amp;这是浪费空间和不能接受的。

请看这张照片

那么，如何使ScrollPanel仅在其内部窗口小部件高于它时才可见;内部小部件比它短的时候不可见？

我们可以通过Css或编码修复它吗？

Answer 1

是的，你可以这样做。您可以为ScrollPanel指定最大高度。

ScrollPanel p = new ScrollPanel();
p.getElement().getStyle().setProperty( "maxHeight", "500px" );

因此，当您的HTML面板为300px时，滚动面板的高度将为300px。当HTML面板高度> 500px然后ScrollPanel将显示滚动条

另一种方式：

假设你有一个类添加到ScrollPanel，名为.scp，那么css将是

.scp
{
  max-height: 500px
}

然后将该类添加到滚动面板

ScrollPanel p = new ScrollPanel();
p.addStyleName( "scp" );