GWT

Question

İç içe geçmiş bir div nasıl oluşturulur GWT'ye iç içe geçmiş bir div almak ve orada bir widget yerleştirmek istiyorum. Böyle bir şey:

<div id="container"> 
    <div id="content_left"> 
    </div> 
    ...other divs 
</div> 

Ben content_left almak ve orada bir widget koymak mümkün olmak istiyorum. Şimdiye kadar bütün RootPanel, etiketin içindeki divlardır. Ayrıca, DOM.getElementById (...) kullanmayı denedim ama add-add metodunun type parametresinde olması gereken giriş parametrelerini belirttiği için bir widget'ın nasıl yerleştirileceğini bilmiyorum.

Artık CSS ve konumlandırma hakkında pek bir şey bilmiyorum ve yukarıdaki stilleri yapmadım. Grafik tasarımcıdan aldığım bir şey. Sanırım bu, bir şeyleri dışarıda bırakma şekliydi. Zaten id = kapsayıcı ile div gibi bir dış div kullanmak zorunda kalmadan serme düşünmekteydim, bu yüzden ilk etapta bu sorunu olmazdı ama bu iyi bir fikir olup olmadığını duymak isterim.

Answer 1

GWT, bu tür şeyler için kapsayıcı widget'lar sağlar: Sizin için DIV'lerinizi oluştururlar ve bunları kendi kurallarına uygun olarak herhangi bir derinliğe yerleştirebilirsiniz. Hiçbir şey için açık DIV'leri kullanmanız gerekmez.

Sen

Şimdi CSS ve konumlandırma hakkında çok şey bilmiyorum ve ben yukarıdaki tasarımı yapmak gelmediğini söyledi.

GWT'nin konusu tam olarak budur: Gerek yoktur. GUI'nizi kod içinde bir araya getirin ve GWT'nin bunu CSS'ye nasıl çevireceği konusunda endişelenmesini sağlayın. İpucu: Bu çoğumuzun asla olamayacağından çok daha iyi. İnsanca mümkün olduğu kadar çapraz platform yapmak için pek çok bilinen tarayıcı tuhaflıkları için geçici çözümler var.

Answer 2

Sağladığınız HTML pasajı için belirli bir örnek, böyle bir şey olurdu. FlowPanels, onlara rastgele sayıların eklenmesini destekleyen divlardır. Eğer belirli bir divun sadece bir widget'ının olacağını biliyorsan, SimplePanel muhtemelen daha iyi bir seçim.

Yine de, ne yapmak istediğiniz, belirli bir DOM yapısını oluşturmak için GWT kodunu oluşturmak ve oluşturmak istediğiniz HTML'yi almaktır. Daha basit widget'larla nasıl başa çıkacağım konusunda iyi bir makale, tags first gwt. Eğer kaliteli düzen koduna üreten bir tasarımcı varsa

FlowPanel container = new FlowPanel(); 
container.setStyleName("container"); 

FlowPanel contentLeft = new FlowPanel(); 
contentLeft.setStyleName("content_left"); 
container.add(contentLeft); 

container.add(otherDivs); 


//elsewhere in your code: 
contentLeft.add(oneWidget); 
contentLeft.add(secondWidget); 

Answer 3

, sen ancak tüm risk ve uyumluluk sorunları farkında ve bakım veya test ettiğinizden kapasiteye sahip değiliz yalnızca kullanmalısınız. .

Im son derece verimli bu yaklaşımı bulma bütün bunları varsayarsak ..

yalnızca programlı ihtiyaç düzeninize temsil etmek First Class nesnelere takas dilek olarak Basitçe bir HTMLPanel'dir gelen widget'larınızı kurmak ve div'leri kullanmak kontrol

<g:HTMLPanel > 

      <div class="normal style classes {obfuscated.style.class}"> 
        <g:FlowPanel ui:field="programmaticPanel" stylePrimaryName="style"> 
          <g:HTMLPanel> 
            <p>CONTENT</p> 
          </g:HTMLPanel> 
        </g:FlowPanel> 
      </div> 

    </g:HTMLPanel > 

Ayrıca, gizlenmiş stillerinizi yine de vanilya/açıklık vb. Ile birlikte kullanabileceğinizi veya karıştırıp eşleştirebileceğinizi unutmayın!

Answer 4

Sen

<div id="container"> 
    <div id="content_left"> 
     <span id="qq"/> 
    </div> 
    ...other divs 
</div> 

için Ve kodu kullanılıyor sizin html değiştirme (veya değiştirmek için tasarımcı söylemek) olabilir:

FlowPanel panel = new FlowPanel(); 
RootPanel.get("qq").add(panel); 
panel.add(w1); 
panel.add(w2); 
... 

Answer 5

Welcome UiBinder http://www.gwtproject.org/doc/latest/DevGuideUiBinder.html

için özel HTML + destekler

"UI desi ile işbirliğini kolaylaştırır XML, HTML ve CSS ile Java kaynak kodundan daha rahat olan geler "