GWT UiBinder HTML not showing up

Question

working on my first GWT project and having some trouble with the UiBinder. When I load my module not even HTML is showing up, I just see a blank page. Anyone know why? What am I leaving out?

I haven't grasped the concept of panels yet, is RootPanel the ScrollPanel? Or mainPanel because I gave it an identifier?

edit: I've run into the error: this panel does not support no-arg add. The error doesn't say which one though. Any tips on how to get the layout I want?

Thanks in advance.

UiBinder class DoraTheExplora.ui.xml:

<g:ScrollPanel>
    <g:VerticalPanel ui:field="mainPanel">
    <!-- Header of Dora website -->
    <g:HorizontalPanel ui:field="headerPanel">
    <g:HTMLPanel styleName="{resource.style.siteHeader}">
        Welcome to Dora!
    </g:HTMLPanel>
...

EntryPoint class :

...
public void onModuleLoad() {
    RootLayoutPanel.get().add(new DoraTheExplora());
}
...

DoraTheExplora class:

...
public class DoraTheExplora extends Composite {

// UIBinder instance.
@UiTemplate("DoraTheExplora.ui.xml")
interface DoraTheExploraUiBinder extends UiBinder<Widget, DoraTheExplora> {
}
private static DoraTheExploraUiBinder uiBinder = GWT.create(DoraTheExploraUiBinder.class);

@UiField
VerticalPanel mainPanel;
@UiField
HorizontalPanel headerPanel;
...

public DoraTheExplora() {
    initWidget(uiBinder.createAndBindUi(this));
...
    }
}

Answer 1

I figured it out. I had a FlexTable nested deep into my ui.xml file which was throwing the no-args error.

I thought it had something to do with the root panel but I was wrong. If someone still wants to explain to me the concept of the root panel that would be much appreciated!!