【问题标题】:Multiple Html page in GwtGwt中的多个Html页面
【发布时间】:2013-06-05 21:48:06
【问题描述】:

我正在尝试在 GWT 中开发网站,我必须在其中制作 2 个 html 页面。 第一个 html 页面是主欢迎页面,第二个 html 页面是调用 GWT 的所有小部件的主页面。

我必须从第二个 html 页面调用项目的入口点类,因此我必须提供脚本

<script type="text/javascript" language="javascript" src="firstpage/firstpage.nocache.js"></script>

所以我的项目统计来自欢迎页面,然后重定向到第二个 html 页面。 但是从第二个 html 页面我无法调用入口点类,因为我上面的脚本无法正常工作。

请帮我从第二个 html 页面执行脚本。提前谢谢你。

【问题讨论】:

    标签: java html gwt


    【解决方案1】:

    鉴于您希望将“html 页面”添加到现有 GWT 应用程序,我建议操作 DOM 而不是创建第二个入口点。如果您需要为此应用程序创建联系页面、关于页面和隐私页面,该怎么办?

    Chris 的 SO answer on GWT navigation 为在 GWT 应用程序中维护多个状态提供了一个非常好的解决方案。


    我已经根据克里斯的回答实现了自己的变体;在这里,我只进一步详细说明我的实现细节。我发现这对于在具有 history 支持的 GWT 应用程序中管理 多个状态 非常有效。

    按照建议,我使用以下 HTML:

    <table id="wrapper">
        <!-- Header row -->
        <tr style="height: 60px;">
            <td colspan="2" id="header"></td>
        </tr>
    
        <!-- Body row and left nav row -->
        <tr style="vertical-align: top;">
            <td id="leftnav"></td>
            <td id="content"></td>
        </tr>
    </table>
    

    然后我定义了一个顶级复合类,每个单独的页面在应用程序中继承:

    public abstract class Content extends Composite{
        public abstract String getToken();  
        public abstract String getWindowTitle();
    }
    

    每个页面的标记和窗口标题都在一个名为 PageDefs 的类中定义:

    public class PageDefs{
        public static final String WelcomeToken = "WELCOME";
        public static final String WelcomeTitle = "Welcome to My App";
        public static final String AppToken = "APP";
        public static final String AppTitle = "My App";
    }
    

    Content 类被单例 ContentContainer 抽象使用:

    public class ContentContainer implements ValueChangeHandler<String> {
    
        @Override
        public void onValueChange(ValueChangeEvent<String> event) {
            String token = (String) event.getValue();
            this.setContentByToken(token);
        }
    
        public void setContentByToken(String token) {
            if (token.equals(PageDefs.WelcomeToken)) {
                this.setContent(new WelcomePage());
            } else if (token.equals(PageDefs.AppToken)) {
                this.setContent(new MyApp());
            } else {
                Window.alert("Error in parsing history token: '" + token + "'");
            }
        }
    
        private void setContent(Content content) {
            RootPanel contentRoot = RootPanel.get("content");
            contentRoot.clear();
            this.content = content;
            History.newItem(content.getToken(), false);
            // check for special initializations:
            if (content.getToken().equals(PageDefs.AppToken)) {
                ((MyApp) content).MyInit();
            }
            contentRoot.add(content);
            header.setHeader(content.getWindowTitle());
            Window.setTitle(content.getWindowTitle());
            Window.scrollTo(0, 0);
        }
    
        private static ContentContainer myInstance = new ContentContainer();
        public static synchronized ContentContainer getInstance() {
            return myInstance;
        }
        private ContentContainer() {
            History.addValueChangeHandler(this);
        }
    
        private Header header;
        private Content content;
    
        public void setHeader(Header h) {
            this.header = h;
        }
    }
    

    ContentContainer 保持对标头类的本地引用。这是因为我需要一个取决于应用程序状态的动态标题和窗口标题。此外,从管理应用程序的内容、标题、窗口标题和历史记录等所有内容都包含在一个类中
    在我的实际实现中,ContentContainer 还跟踪用户的会话。因此,如果用户的会话不存在或过期,ContentContainer 的onValueChange 方法会强制加载登录页面。

    标头是一个带有一个 InlineHTML 变量的 UI 活页夹,其 HTML 由 setHeader 方法设置。对于左侧导航菜单,我还使用带有 GWT 锚点的 UI 活页夹,其中 #WELCOME#APP 作为 href 值。

    最后,我们需要在入口点加载应用程序的各个部分:

    public void onModuleLoad() {
        Header h = new Header();
        h.setHeader(PageDefs.WelcomeTitle);
        RootPanel.get("header").add(h);
        ContentContainer.getInstance().setHeader(h);
        RootPanel.get("leftnav").add(new NavMenu());
        String token = Window.Location.getHash().length() == 0? 
            PageDefs.WelcomeToken : Window.Location.getHash();
        ContentContainer.getInstance().setContentByToken(PageDefs.SignupToken);
    }
    

    这就是我在 GWT 应用程序中管理多个页面的方式。这项额外的工作可能看起来很艰巨,但我发现这是值得的。如果您的应用程序处理一些输入,并可视化输出,前进和后退按钮是表单和可视化之间的直观导航工具。

    【讨论】:

      【解决方案2】:

      您的第二个 html 页面应包含 iframe 条目。

           <!-- OPTIONAL: include this if you want history support -->
      
      <iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1'  
      style="position:absolute;width:0;height:0;border:0"></iframe>``
      

      【讨论】:

        猜你喜欢
        • 2014-07-02
        • 2011-06-10
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2010-12-26
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多