css - GWT - 隐藏水平滚动条

Question

我想知道...有没有办法用 GWT 标准隐藏水平滚动条 ScrollPane ？ 我的意思是也许不使用外部 CSS 样式等？或者您可以推荐一种更优化的方式来实现效果？

...关于 CSS，现在我尝试为我的 ScrollPane 设置这样的样式

.a-scroll {
overflow-y: scroll;
overflow-x: hidden;
}

...但它似乎不起作用并且水平滚动条仍然可见 :S 那么有解决方法吗？

谢谢

Answer 1

默认情况下，ScrollPanel 的 overflow 属性设置为 auto(即，滚动条将根据需要出现)以获得最跨浏览器解决方案。因此，由浏览器决定何时显示此类滚动条。此外，调用 scrollPanel.setAlwaysShowScrollBars(false) 是无用的，因为它已在构建时调用(在 initialize() 方法中)。

无论如何我发现你要求的是一个known issue .

如果您想始终隐藏水平滚动条，您需要在ScrollPanel 的可滚动元素上设置overflow-x: hidden 属性>(正如您所尝试的那样，但是这样的面板不是一个带有 overflow 属性的简单 div)。尝试:

public class MyScrollPanel extends ScrollPanel {

  public void setAlwaysHideHorizontalScrollBar(boolean alwaysHide) {
    getScrollableElement().getStyle().setOverflowX(alwaysHide ? Overflow.HIDDEN : Overflow.AUTO);
  }
  // ... and the like.
}

请记住，如果您设置以上内容，在某些浏览器中您将无法再水平滚动。此外，overflow-x/y 是 CSS3 属性，而 overflow 是 CSS2。所以这可能不是您想要的。

在这种情况下，一些 CSS 技巧可以帮助隐藏滚动条但仍允许滚动，例如 this .

Anothe 选项可以使用 CustomScrollPanel 小部件，除其他外，它允许通过提供具有零不透明度样式的自定义滚动条来隐藏滚动条(不是最好的东西，很难).

当然，另一种选择可能是使用您需要的所有样式推出您自己的基于 div 的小部件(可能扩展 SimplePanel)，如问题中所建议的。