如何连接GWT超链接点击处理程序？

Question

我是GWT的新手，正在努力实现以下目标：

​

​

下面是我做的代码：

public class MyWebApp implements EntryPoint {
    // The main container for everything the user sees (the "view")
    private LayoutPanel mainPanel;

    // Simple HTML for the header ("MyWebApp") and subsequent <hr/>
    private SafeHtml header;

    // The three links "Dashboard", "Monitors" and "Help Desk"
    private HorizontalPanel navMenu;

    // The empty content that gets populated when user clicks one of
    // the 3 links.
    private Panel menuContent;

    @Override
    public void onModuleLoad() {
        // The initial fragment contains the header, nav menu and empty "content" div.
        // Each menu/screen then fills out content div.
        initMainPanel();

        RootPanel.get().add(mainPanel);
    }

    private void initMainPanel() {
        SafeHtmlBuilder headerBuilder = new SafeHtmlBuilder();
        navMenu = new HorizontalPanel();

        // Leaving null until user clicks on one of the 3 menus.
        // Then the menu will decide what panel gets injected for
        // this panel.
        menuContent = null;

        // Create the simple HTML for the header.
        headerBuilder.append("<h1>MyWebApp</h1><hr/>");

        // Create the navMenu items.
        Hyperlink dashboardLink, monitorsLink, helpDeskLink;

        // Homepage is http://www.mywebapp.com
        // I want the dashboardLink to inject menuContent and "redirect" user to
        // http://www.mywebapp.com/dashboard
        dashboardLink = new Hyperlink("???", "???");

        // http://www.mywebapp.com/monitors
        monitorsLink = new Hyperlink("???", "???");

        // http://www.mywebapp.com/help-desk
        helpDeskLink = new Hyperlink("???", "???");
        navMenu.add(dashboardLink);
        navMenu.add(monitorsLink);
        navMenu.add(helpDeskLink);

        // Add all widgets to the mainPanel.
        mainPanel.add(new HTML(headerBuilder.toSafeHtml().toString()));
        mainPanel.add(navMenu);
        mainPanel.add(menuContent);

        // Position and size the widgets (omitted for brevity).
        // mainPanel.setWidgetHorizontalPosition(...);
    }

    private HTML getDashboardMenuContent() {
        return new HTML("This is the dashboard.");
    }

    private HTML getMonitorsMenuContent() {
        return new HTML("These are the monitors.");
    }

    private HTML getHelpDeskMenuContent() {
        return new HTML("This is the help desk.");
    }
}

最重要的是：

• 如何“连接”Hyperlink，以便当用户单击它们时，我可以调用适当的getXXXMenuContent()方法，然后将其添加到menuContent中。

但也包括：

• 我觉得我在这里做错了什么：mainPanel.add(new HTML(headerBuilder.toSafeHtml().toString())); -如果是，那是什么？！？我应该如何以一种安全的方式添加一个简单的<h1>和<hr/> (因此可以使用安全*对象)、高效和符合推荐的实践？
• 我应该在这里实现UiBinder吗？如果是这样的话，我会为每个菜单的内容或整个mainPanel制作mainPanel，还是两者都做？

提前感谢！

Answer 1

有点像

dashboardLink.addClickHandler( 
   new ClickHandler() 
   {
       public void onClick( ClickEvent event ) 
       {
           mainPanel.setWidget( getDashboardMenuContent() );
       }
   } );

您应该注意到，Hyperlink.addClickHandler(...)是不推荐的，建议使用Anchor.addClickHandler(...)。

至于其他问题:用UIBinder构建UI要优雅得多，也更容易，所以一定要研究这一点，但一定要让" It“工作，以避免增加.ui.xml设置的复杂性：)

干杯,

Answer 2

Hyperlink小部件触发导航。您不希望处理对它们的单击，您希望处理导航(这可以通过单击Hyperlink或使用浏览器的后退/转发按钮、书签或来自其他地方的链接-including Ctrl+clicking a Hyperlink在新窗口/选项卡中打开它等方式触发)。

要对这些导航事件作出反应，请使用History.addValueChangeHandler；并在应用程序启动时处理初始导航，调用History.fireCurrentHistoryState() (当然是在添加处理程序之后)。

更多细节见：https://developers.google.com/web-toolkit/doc/latest/DevGuideCodingBasicsHistory

最好把其他问题分给..。还有其他问题，但以下是答案：

我觉得我在这里做错了什么：mainPanel.add(new HTML(headerBuilder.toSafeHtml().toString())); -如果是，那是什么？！？我应该如何以一种安全的方式添加一个简单的<h1>和<hr/> (因此可以使用安全*对象)、高效和符合推荐的实践？

HTML小部件有一个接受SafeHtml的构造函数，因此不需要调用toString()。

如果只使用常量，则不需要SafeHtmlBuilder；而是使用SafeHtmlUtils。但是，无论是否使用SafeHtml，常量都是不安全的，SafeHtml只会使在代码中查找所有HTML的出现变得更容易，有助于对应用程序进行安全检查(BTW，我们正在做HTML，所以是<hr>，而不是<hr/>；如果您真的希望它看起来像XML/XHTML，那么就使用<hr />，但您只是这里的欺骗自己 )。

我应该在这里实现UiBinder吗？如果是这样的话，我会为每个菜单的内容或整个mainPanel制作mainPanel，还是两者都做？

如果您不觉得需要UiBinder，就不必使用它。但在这种情况下，它不会改变任何事情:您不是在处理小部件事件，而是处理历史事件。

Answer 3

我有一个简单的建议要给你。使用框架所提供的内容。

HTML小部件应该是最后一次转义。有如此多的小部件，所以您几乎不需要在代码中的任何地方编写html。

因此，您可以使用下面的代码来代替headerBuilder

Label header = new Label("MyWebApp");
header.setStyleName("headerStyle",true);

您可以在外部Css文件中设置样式属性，并在基本html文件或gwt.xml文件中添加引用。这就回答了你关于mainPanel.add(new HTML(headerBuilder.toSafeHtml().toString()));的问题

关于超级链接。如果您选择使用超链接，请记住，最有效的使用方式是MVP模式，即场所和活动(网络上的大量信息)。

如果您想要更简单的东西，那么MenuBar和MenuItem类应该能做到这一点。

有关如何使用这里控制应用程序的示例，请参阅MenuBar。还有很多其他的方法，但是为什么不使用提供的工具呢？

此外，UIBinder与Designer/Classes方法在堆栈溢出上进行了广泛的讨论，导致了选择和编程熟悉/偏好的问题。