Marshal's Blog

为gwt树型应用增加历史回退功能

早期使用ajax开发的一个缺点是，当选择浏览器的回退按钮或者快捷键时，会跳出应用。而不是回退到上一步操作。

当前的ajax框架都提供了对这个问题的解决方案。gwt也不例外。

在在gwt树型菜单基础上动态加载视图基础上实现了这个功能。基本思路是，创建一个map，放置标记字符串和树型节点条目。其中标记会显示在地址栏中。

比如这里第一个菜单项的标记是字符串1，第二个是2。然后，通过：TreeItem.setUserObject()方法设置这个值。

当选择菜单项时，修改History的item。另外有一个对History的值改变监听器，根据标记字符串重新显示右边的内容。

和在gwt树型菜单基础上动态加载视图比较，只修改了java代码。

        this.initTreeDemo();
    }

    private Map<TreeItem, Widget> treeItems = new HashMap<TreeItem, Widget>();
    private Map<String, TreeItem> treeItemTokens = new HashMap<String, TreeItem>();
    private void initTreeDemo() {
        HorizontalPanel treeDemoPanel = new HorizontalPanel();
        RootPanel.get("treeDemo").add(treeDemoPanel);

        Tree mainMenu = new Tree();
        treeDemoPanel.add(mainMenu);

        TreeItem item = mainMenu.addItem("统计");
        TreeItem subItem=item.addItem("根据地域统计");
        subItem.setUserObject("1");
        treeItemTokens.put("1", subItem);
        treeItems.put(subItem, new HTML("》》根据地域统计"));
        subItem=item.addItem("根据产品统计");
        subItem.setUserObject("2");
        treeItemTokens.put("2", subItem);
        treeItems.put(subItem, new HTML("》》根据产品统计"));

        final SimplePanel panel = new SimplePanel();
        panel.add(treeItems.get(mainMenu.getItem(0).getChild(0)));
        History.addValueChangeHandler(new ValueChangeHandler<String>() {
            @Override
            public void onValueChange(ValueChangeEvent<String> event) {
                if (treeItemTokens.get(event.getValue()) != null) {
                    panel.clear();
                    panel.add(treeItems.get(treeItemTokens.get(event.getValue())));
                }
            }
        });

        mainMenu.addSelectionHandler(new SelectionHandler<TreeItem>() {

            @Override
            public void onSelection(SelectionEvent<TreeItem> event) {
                if (treeItems.get(event.getSelectedItem()) != null) {
                    History.newItem(event.getSelectedItem().getUserObject().toString());
                }
            }
        });

        treeDemoPanel.add(panel);
    }
}

   发送文章为PDF