無法使SplitLayoutPanel工作 - GWT + UIBinder讓我瘋狂

... 
<g:VerticalPanel styleName="{style.mainVerticalPanel}"> 
    <g:SplitLayoutPanel> 
    <g:north size="700"> 
     <g:VerticalPanel> 
       <g:ScrollPanel styleName="{style.conversationPanelContainer}"> 
        <g:FlexTable ui:field="conversationPanel" styleName="{style.conversationPanel}"></g:FlexTable> 
       </g:ScrollPanel> 
       <g:HorizontalPanel styleName="{style.messageTextAndSendPanel}"> 
        <g:TextBox ui:field="messageText" styleName="{style.messageText}"></g:TextBox><g:Button ui:field="sendButton">Send</g:Button> 
       </g:HorizontalPanel> 
     </g:VerticalPanel> 
    </g:north> 
    <g:south size="300"> 
    <g:button>TestButton</g:button> 
    </g:south> 
    </g:SplitLayoutPanel> 
</g:VerticalPanel> 
...

任何東西看起來不對？我所要做的只是做一個簡單的拆分面板，但每當我運行這一切，我得到的是一個空白頁面。沒有任何的東西，它工作正常。 DockLayoutPanel也是如此。無法使SplitLayoutPanel工作 - GWT + UIBinder讓我瘋狂

來源

2010-03-22 Matthew H

沒有例外？（無論是在DevMode的和螢火蟲/其他瀏覽器控制檯） – 2010-03-22 20:41:25

我從我目前的工作電腦了，所以我不能肯定地說，但我記得看到一些RPC調用在Firebug控制檯窗口分派（我儘管缺少UI，但每個x分鐘都會執行一次RPC調用）。如果有例外，什麼都不會運行，對吧？ – 2010-03-22 21:18:01

好，我知道它的工作（見年長以前嘗試的這個答案的版本;））。

我的解決方案基於Mail example。工作代碼：

public class SplitTest implements EntryPoint { 

    private static TestUiBinder uiBinder = GWT.create(TestUiBinder.class); 

    interface TestUiBinder extends UiBinder<SplitLayoutPanel, SplitTest> { 
    } 

    /** 
    * This is the entry point method. 
    */ 
    public void onModuleLoad() { 
     SplitLayoutPanel outer = uiBinder.createAndBindUi(this); 

     RootLayoutPanel.get().add(outer); 
    } 
}

UiBinder的* .ui.xml：

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent"> 
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder" 
    xmlns:g="urn:import:com.google.gwt.user.client.ui"> 
    <ui:style> 
    .conversationPanelContainer, .conversationPanel, .messageTextAndSendPanel, .messageText { 
     font-weight: bold; 
    } 
    </ui:style> 
    <g:SplitLayoutPanel> 
    <g:north size="700"> 
     <g:VerticalPanel> 
       <g:ScrollPanel styleName="{style.conversationPanelContainer}"> 
        <g:FlexTable ui:field="conversationPanel" styleName="{style.conversationPanel}"></g:FlexTable> 
       </g:ScrollPanel> 
       <g:HorizontalPanel styleName="{style.messageTextAndSendPanel}"> 
        <g:TextBox ui:field="messageText" styleName="{style.messageText}"></g:TextBox><g:Button ui:field="sendButton">Send</g:Button> 
       </g:HorizontalPanel> 
     </g:VerticalPanel> 
    </g:north> 
    <g:south size="300"> 
    <g:Button>TestButton</g:Button> 
    </g:south> 
    </g:SplitLayoutPanel> 
</ui:UiBinder>

注意一些事情：

首先：你在UiBinder的XML有一個錯誤模板：這是<g:Button>，不是<g:button>（區分大小寫）
使用RootLayoutPanel代替我們UAL RootPanel
我還是有點困惑整個LayoutPanel小號啄 - 在Mail example他們使用嵌套在一個DockLayoutPanelSplitLayoutPanel，但只有DockLayoutPanel被明確添加到RootLayoutPanel - 我是明白，SplitLayoutPanel自動地也被添加（以便它可以接收調整大小事件等）？那麼在主LayoutPanel中嵌套的其他Widget如何呢？是否必須將它們明確地添加到RootLayoutPanel或者只有它們是該Widget/Composite的根部，或者甚至不可能？我真的沒有時間atm進一步追求 - 我會留下它作爲別人的功課;）

順便說一句：我檢查了這個代碼在怪癖模式和標準模式下 - 我不'看不到差別，都工作O_O（雖然，這是一個簡單的使用SplitLayoutPanel - 更復雜的例子可能會導致怪癖模式和/或渲染錯誤一些怪異的行爲）

來源

2010-03-22 20:43:43

我想我在試圖讓DockLayoutPanel工作時已經嘗試過，但當我回到工作PC時，我會再試一次。謝謝。 :) – 2010-03-22 21:18:48

應該類似於DockLayoutPanel。見http://stackoverflow.com/questions/2493101/how-do-i-use-splitlayoutpanel-with-uibinder – Carnell 2010-03-22 21:48:01

你也檢查它在IE的怪癖模式？它通常在Firefox的怪癖模式下工作。 – 2010-03-23 13:32:20

您正在使用哪種文件類型？這些面板只能在標準模式下工作（至少在一些連接器上）。如果您使用怪異模式，那麼經常會發生這種情況，您會在這些面板中看到一個空白頁面。

檢查您的HTML文件。它應該理想地開始：

<!DOCTYPE html>

或可替代導致標準模式的一些其他的doctype（但要確保它在100％逐字輸入），請參閱http://hsivonen.iki.fi/doctype/

來源

2010-03-22 20:31:01

嗨，我的文檔類型設置爲您的建議，但不幸的是它仍然無法正常工作。 :( – 2010-03-22 20:34:37

只是爲了確保：這是在生成的HTML的第一行是在發送到瀏覽器（也有可能甚至不是它上面的註釋） – 2010-03-22 20:52:46

您也可以快速檢查的模式火狐呈現頁面的？右擊 - >查看頁面信息並檢查渲染模式值。 – 2010-03-22 22:08:03

無法使SplitLayoutPanel工作 - GWT + UIBinder讓我瘋狂

回答

相關問題