2013-09-30 34 views
1

好吧,說我有一個ScrollPanel高度=「500px」。 ScrollPanel內部有一個HTMLPanel。如何使ScrollPanel僅在內部小部件高於內部時纔可見並且內部部件比內部小部件短時不可見?

有時,HTMLPanel有更多的內容,所以它會比「500像素」,前高:700像素。另一次,HTMLPanel的內容較少,所以它會比「500px」,例如:300px更短。

當HTMLPanel比500像素高,有一個滾動條出現。這是有道理的。沒有任何問題。

然而,問題是當HTMLPanel短於500像素(例如,300像素),沒有滾動條出現,但ScrollPanel仍顯示在高度500像素。所以有200px的高度缺口留下未使用,&這是浪費空間&不可接受的。

PLS看到這張照片 enter image description here

因此,如何使ScrollPanel唯一可見的,當其內部部件是高於它&當其內部部件是比它短的不可見的?

我們可以通過CSS或編碼解決?

回答

1

是的,你可以做到這一點。你可以給你的ScrollPanel一個最大高度。

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

所以當你的HTML面板是300px,你的滾動面板的高度將是300px。當HTML面板高度> 500像素,然後ScrollPanel將顯示滾動條

另一種方式:

假設你有加入ScrollPanel一類名爲.scp那麼CSS就會被

.scp 
{ 
    max-height: 500px 
} 

然後將該類添加到您的滾動條上

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

可以提供css代碼嗎? – Kiti

+0

您可以直接從gwt設置css屬性。 p.getElement()。getStyle()。setProperty(「maxHeight」,「500px」); – Dilantha

+0

它的工作正如我所料,非常感謝你 – Kiti