GWT视图导航基本示例

时间:2013-01-07 16:19:15

标签: gwt user-interface

我有一个带有Back / Forward按钮的导航面板(功能不重要,只是想让我的头围绕一个GWT页面交换面板)

NavigationButtonsPanel

public class NavigationButtonsPanel extends HTMLPanel
        {
            private Button btnA = new Button("Go back");
            private Button btnB = new Button("Go forward");

            public NavigationButtonsPanel( )
            {
                super("Navigation Panel");
                add(btnA);
                add(btnB);
            }

            public void setBackHandler( ClickHandler handler )
            {
                btnA.addClickHandler(handler);
            }

            public void setForwardHandler( ClickHandler handler )
            {
                btnB.addClickHandler(handler);
            }
        }

然后我有3个基本面板,A B和C使用它。我从A-B-C导航到B-A的工作正常。 我现在模拟用户在转到Panel B之前更改了某些内容。在这种情况下,PanelB中有一个Label。 我的最终应用程序显然会比这更复杂,但这是应用程序如何工作的典型。您可以通过同一面板中的用户交互或不同的面板修改Panel中的某些字段,加载新面板,进行更多交互,在不同面板中加载等等? 我只希望用户使用定义良好的导航路径,因此只有一个路径指向某个面板。

红砂糖

public class PanelA extends HTMLPanel
{
    private static PanelA panel;            
    private PanelA()
    {
        super("Panel A");
        final RootPanel rootPanel = RootPanel.get();

        NavigationButtonsPanel btnPanel = new NavigationButtonsPanel();
        btnPanel.setForwardHandler(new ClickHandler() {
            public void onClick(ClickEvent event) 
            {
                rootPanel.clear();
                PanelB.setMessageFromPreviousPage("Message set in Panel AAAAA");
                rootPanel.add( PanelB.getInstance() );
            }
        });

        add( btnPanel );
    }

    public static PanelA getInstance()
    {
        if (panel == null)
        {
            panel = new PanelA();
        }
        return panel;
    }
}

PanelB

    public class PanelB extends HTMLPanel
{
    private static PanelB panel; 
    private static String messageFromPreviousPage;

    private PanelB()
    {
        super("Panel B");
        final RootPanel rootPanel = RootPanel.get();

        Label messageLabel = new Label(messageFromPreviousPage);


        NavigationButtonsPanel btnPanel = new NavigationButtonsPanel();
        btnPanel.setBackHandler(new ClickHandler() {
            public void onClick(ClickEvent event) 
            {
                rootPanel.clear();
                rootPanel.add( PanelA.getInstance() );
            }
        });

        btnPanel.setForwardHandler(new ClickHandler() {
            public void onClick(ClickEvent event) 
            {
                rootPanel.clear();
                rootPanel.add( PanelC.getInstance() );
            }
        });

        add( btnPanel );
        add(messageLabel);
    }

    public static PanelB getInstance()
    {
        if (panel == null)
        {
            panel = new PanelB();
        }
        return panel;
    }

    public static void setMessageFromPreviousPage(
            String message)
    {
        messageFromPreviousPage = message;


}
    }

PanelC

public class PanelC extends HTMLPanel
        {
            private static PanelC panel;            
            private PanelC()
            {
                super("Panel C");
                final RootPanel rootPanel = RootPanel.get();

                NavigationButtonsPanel btnPanel = new NavigationButtonsPanel();
                btnPanel.setBackHandler(new ClickHandler() {
                    public void onClick(ClickEvent event) 
                    {
                        rootPanel.clear();
                        PanelB.setMessageFromPreviousPage("Message set in Panel CCCCCC");
                        rootPanel.add( PanelB.getInstance() );
                    }
                });

                add( btnPanel );
            }

            public static PanelC getInstance()
            {
                if (panel == null)
                {
                    panel = new PanelC();
                }
                return panel;
            }
        }

1 个答案:

答案 0 :(得分:0)

Any idea why Panel B does not update its UI? 

因为当使用PanelB创建第一次PanelB.getInstance()实例时,创建了messageLabel并且还设置了值。当您在更改消息后从PanelC调用第二次相同的方法时,此时,它使用相同的PanelB实例而不是新对象。根据您的编码,您正在更改messageFromPreviousPage变量的值而不是标签文本。所以你没有在UI上找到任何变化。

如果要更改标签文本,请将messageLabel声明为globel变量static并更改标签。即。

 private static Label messageLabel;
 private PanelB() 
{
//your code
}
 public static PanelB getInstance()
{
    if (panel == null)
    {
        panel = new PanelB();
    }
    else
    {
        messageLabel.setText(messageFromPreviousPage); //Require to set Text Again
    }
    return panel;
}