Grid with rows in anchor not visible in GWT (UIBinder)

Question

In my GWT application in a composite class I am creating a Grid UI binder. In each cell of the grid I am adding an anchor UI Binder. When I load this page in the application, I see a table created but the anchor not visible. When I insert text in a row,the row with the text is visible but the Anchor is not visible.

The java file with the class

public class MetricsTicketsViewImpl extends Composite implements MetricsView {
    private static MetricsTicketsViewUiBinder uiBinder = GWT.create(MetricsTicketsViewUiBinder.class);


    public static final String link1 = "https://google.com";
    public static final String link2 = "https://google.com";
    public static final String link3 = "https://google.com";
    public static final String link4 = "https://google.com";
    public static final String link5 = "https://google.com";
    public static final String link6 = "https://google.com";
    public static final String link7 = "https://google.com";
    public static final String link8 = "https://google.com";
    public static final String link9 = "https://google.com";
    public static final String link10 = "https://google.com";
    public static final String link11 = "https://google.com";
    public static final String link12 = "https://google.com";


    interface MetricsTicketsViewUiBinder extends UiBinder<Widget, MetricsTicketsViewImpl> {
    }

    @UiField GalaxyHubbleHeaderWidget headerWidget;

    @UiField Anchor ticketMetricsGraphsLink;
    @UiField Anchor ticketQueueGraphsLink;

    @UiField Anchor linkk1 ;
    @UiField Anchor linkk2 ;
    @UiField Anchor linkk3 ;
    @UiField Anchor linkk4 ;
    @UiField Anchor linkk5 ;
    @UiField Anchor linkk6 ;
    @UiField Anchor linkk7 ;
    @UiField Anchor linkk8 ;
    @UiField Anchor linkk9 ;
    @UiField Anchor linkk10 ;
    @UiField Anchor linkk11 ;
    @UiField Anchor linkk12 ;


    @UiField Frame ticketMetricsFrame;
    @UiField Frame ticketQueueFrame;

    @UiField DisclosurePanel ttMetricsDisclosurePanel;
    @UiField DisclosurePanel ttQueueDisclosurePanel;

    @UiField Grid ticketTable;

    @UiField ImageAnchor galaxyTicketMetrics;

    private Presenter presenter;


    public MetricsTicketsViewImpl() {

        initWidget(uiBinder.createAndBindUi(this));
        headerWidget.setSelected(GalaxyHubbleHeaderWidget.TICKETS);

        ticketMetricsGraphsLink.setHref(ttMetricsUrl);

        linkk1.setHref(link1);
        linkk2.setHref(link2);
        linkk3.setHref(link3);
        linkk4.setHref(link4);
        linkk5.setHref(link5);
        linkk6.setHref(link6);
        linkk7.setHref(link7);
        linkk8.setHref(link8);
        linkk9.setHref(link9);
        linkk10.setHref(link10);
        linkk11.setHref(link11);
        linkk12.setHref(link12);

        ticketTable = new Grid(13,1);
        ticketTable.setSize("10px","10px");

        ticketTable.setWidget(0, 0, linkk1);
        ticketTable.setWidget(1, 0, linkk2);
        ticketTable.setWidget(2, 0, linkk3);
        ticketTable.setWidget(3, 0, linkk4);
        ticketTable.setWidget(4, 0, linkk5);
        ticketTable.setWidget(5, 0, linkk6);
        ticketTable.setWidget(6, 0, linkk7);
        ticketTable.setWidget(7, 0, linkk8);
        ticketTable.setWidget(8, 0, linkk9);
        ticketTable.setWidget(9, 0, linkk10);
        ticketTable.setWidget(10, 0, linkk11);
        ticketTable.setWidget(11, 0, linkk12);
        ticketTable.setText(12, 0, "linkk2");

        ttMetricsDisclosurePanel.setSize("100%", "100%");
        ttMetricsDisclosurePanel.setAnimationEnabled(true);
        ttQueueDisclosurePanel.setSize("100%", "100%");
        ttQueueDisclosurePanel.setAnimationEnabled(true);

        ticketMetricsFrame.setSize("95%","600px");
        ticketMetricsFrame.setUrl(ttMetricsUrl);
        ticketQueueFrame.setSize("95%","600px");




        ttMetricsDisclosurePanel.setOpen(false);
        ttQueueDisclosurePanel.setOpen(false);
    }







    @Override
    public void clearMsgBox() {
        headerWidget.clearMsgBox(); 
    }

    @Override
    public void setErrorMsg(String msg) {
        headerWidget.setErrorMsg(msg);
    }

    @Override
    public void setLoading(boolean visible) {
        headerWidget.setLoading(visible);
    }

    @Override
    public void setPresenter(Presenter presenter) {
        this.presenter = presenter;
    }


    }       
}

The corresponding xml file :

<g:Grid ui:field = "ticketTable" styleName="myGrid" cellSpacing='50'>
                <g:row>
                    <g:customCell>  
                        <g:Anchor ui:field="linkk1" styleName="myMidLabel">Link 1</g:Anchor>

                    </g:customCell>
                </g:row>

                <g:row>
                    <g:customCell>  
                        <g:Anchor ui:field="linkk2" styleName="myMidLabel">Link 2</g:Anchor>
                    </g:customCell>
                </g:row>
                <g:row>
                    <g:customCell>  
                        <g:Anchor ui:field="linkk3" styleName="myMidLabel">Link 3</g:Anchor>
                    </g:customCell>
                </g:row>
                <g:row>
                    <g:customCell>  
                        <g:Anchor ui:field="linkk4" styleName="myMidLabel">Link 4</g:Anchor>
                    </g:customCell>
                </g:row>
                <g:row>
                    <g:customCell>  
                        <g:Anchor ui:field="linkk5" styleName="myMidLabel">Link 5</g:Anchor>
                    </g:customCell>
                </g:row>
                <g:row>
                    <g:customCell>  
                        <g:Anchor ui:field="linkk6" styleName="myMidLabel">Link 5</g:Anchor>
                    </g:customCell>
                </g:row>
                <g:row>
                    <g:customCell>  
                        <g:Anchor ui:field="linkk7" styleName="myMidLabel">Link 6</g:Anchor>
                    </g:customCell>
                </g:row>
                <g:row>
                    <g:customCell>  
                        <g:Anchor ui:field="linkk8" styleName="myMidLabel">Link 7</g:Anchor>
                    </g:customCell>
                </g:row>
                <g:row>
                    <g:customCell>  
                        <g:Anchor ui:field="linkk9" styleName="myMidLabel">Link 8</g:Anchor>
                    </g:customCell>
                </g:row>
                <g:row>
                    <g:customCell>  
                        <g:Anchor ui:field="linkk10" styleName="myMidLabel">Link 9</g:Anchor>
                    </g:customCell>
                </g:row>
                <g:row>
                    <g:customCell>  
                        <g:Anchor ui:field="linkk11" styleName="myMidLabel">Link 11</g:Anchor>
                    </g:customCell>
                </g:row>
                <g:row>
                    <g:customCell>  
                        <g:Anchor ui:field="linkk12" styleName="myMidLabel">Link 2</g:Anchor>
                    </g:customCell>
                </g:row>
                <g:row>
                    <g:cell>
                        <div>foo</div>
                    </g:cell>
                </g:row>
            </g:Grid>

The corresponding css file

  .myGrid {
    margin: auto;
    height: 100%;
}

.myMidLabel {
    font-size: 20pt;
}

Answer 1

You create your ticketTable and your links with UiBinder (createAndBindUi) and then you create a new Grid (re-assigning the ticketTable field BTW) and move your links to it (setWidget), but you never actually use that Grid anywhere.

So, basically, you've moved your links to somewhere that's never displayed, so they don't show. QED.