2014-04-09 17 views
13

Kullanıcıların Vaadin düzenlerindeki kaydırma çubuklarını nasıl gizleyeceğini sordukları birçok soru buldum, ancak benim sorunum Vaadin'in kaydırma çubuğu göstermemesi. Mesela ben bu kodu olabilir:Vaadin düzenine kaydırma çubuğu nasıl eklenir

HorizontalLayout layout = new HorizontalLayout(); 
layout.setSizeUndefined(); // I also tried setSizeFull() 
for(Integer i = 1; i <= 15; i++) { 
    layout.addComponent(new Button("Test button #" + i.toString()); 
} 

Ama bu kodu çalıştırdığınızda tarayıcı penceresi hepsini göstermek için çok küçük olduğunda, sayfadaki düğmeleri basitçe kesilir. Hiç kaydırma çubuğu görünmeyecek.

Ayrıca, Panel'i oluşturmaya çalıştım ve sonra da düzenimi bu panele ekleyin. Her ikisini de test ettim - panel.addComponent(foo) ve ayrıca panel.setContent(foo) ve ben de panel.setScrollable(true)'u ayarlamaya çalıştım. Herhangi bir başarı olmadan.

Bir çeşit Vaadin düzenine kaydırma çubuğu eklemenin herhangi bir yolu var mı? Vaadin 6.8.7 kullanıyorum. Şimdiden teşekkürler!


benim tam kodu vardır:

private ComponentContainer openZoomifyLayout() { 
    Panel panel = new Panel(); 
    Panel panel2 = new Panel(); 

    middlePanel = new MiddlePanel(); 

    VerticalLayout mw = new VerticalLayout(); 
    mw.setSizeFull(); 

    HorizontalLayout sp = new HorizontalLayout(); 
    Panel photos = new Panel(); 
    photos.setSizeUndefined(); 

    mw.addComponent(panel); 
    mw.addComponent(panel2); 
    mw.addComponent(sp); 

    mw.setExpandRatio(sp, 99); 
    mw.setExpandRatio(panel, 0); 
    mw.setExpandRatio(panel2, 0); 

    panel2.addComponent(middlePanel); 

    mw.setComponentAlignment(panel, Alignment.TOP_CENTER); 
    mw.setComponentAlignment(panel2, Alignment.TOP_CENTER); 

    photos.setContent(table); 
    photos.setScrollable(true); 
    sp.addComponent(photos); 
    sp.addComponent(createMainDetail()); 

    return mw; 
} 

Bu yöntem Pencere uzanır sınıfta kullanılan ve böylece başlatma zamanında orada olup: setContent(openZoomifyLayout());

+0

Ana düzeninizi gösterebilir misiniz?Muhtemelen orada sabit bir yüksekliğe sahip bir eleman düzeni zinciri –

+0

bir yere kadar var Ben ana düzen kodunu ekledim .. :-) – Firzen

cevap

17

spHorizontalLayout ve photosPanel ürününüzün tam boyutlu olması gerekir. panel yönde boyut tanımlanmamış olması halinde dikey varsayılan olarak sahip olduğu

Eğer Vaadin Kitap bölüm 6.6.1

Normalde okumak gibi, bu içerik boyutuna uyacak ve büyüyecek olarak içerik büyür. Bununla birlikte, sabit veya yüzde boyutuna ve içeriğine sahipse, içeriği içerik alanına sığmayacak kadar büyük hale gelirse, belirli bir yön için kaydırma çubuğu görünecektir. Paneldeki kaydırma çubukları, CSS'deki taşma: auto özelliği ile tarayıcı tarafından doğal olarak ele alınan 'dur.

+0

Bu kesinlikle mükemmel! Beni kurtardın! İyi çalışıyor. Teşekkür ederim. – Firzen

5

Bir panele gerekecektir. Ayrıca panelin boyutunun sabit olduğundan ve "doğal" olmadığından emin olmanız gerekir. Boyutu "doğal" ise, içeriği tam olarak görüntüleninceye kadar panel genişleyecektir. Paneller için varsayılan boyut doğaldır ve herhangi bir kaydırma çubuğu görmemenizin nedeni budur.

3

aşağıdaki adımları: ilgili yönde

  • dış düzeni ihtiyacı sabit veya Percentual boyutu
  • iç düzeni bu yönde
  • tanımlanmamış boyutu gerektirir (VerticalLayout sabit veya Percentual yüksekliği gerektirir)
  • dış düzen ihtiyaçları

v-scrollable stylename örn

public class SomeView extends CustomComponent implements View 
{ 
     this.addStyleName("v-scrollable"); 
     this.setHeight("100%"); 
     VerticalLayout content = new VerticalLayout(); 
     // content has undefined height by default - just don't set one 
     setCompositionRoot(content); 
... 
} 

Bu gerektiğinde content büyür iken CustomComponent bir kaydırma çubuğunu göstermek yapacaktır.