带有子菜单的 GwtBootstrap3 NavBar

Question

我开始使用 GWTBoostrap3，我最需要的是创建一个包含子菜单的菜单，而这个菜单需要是动态的，所以需要在 Java 中完成。就像 Gwt MenuBar

我的尝试....

final ListDropDown listDropDown = new ListDropDown();
AnchorButton anchorButton = new AnchorButton(ButtonType.INFO);
anchorButton.setText("btn1");
DropDownMenu dropDownMenu = new DropDownMenu();
AnchorListItem anchorListItemd = new AnchorListItem("Item 1");
dropDownMenu.add(anchorListItemd);
anchorButton.setDataToggle(Toggle.DROPDOWN);
listDropDown.add(anchorButton);
listDropDown.add(dropDownMenu);


final ListDropDown listDropDown2 = new ListDropDown();
final AnchorButton anchorButton2 = new AnchorButton(ButtonType.INFO);
anchorButton2.setText("Item 2");
DropDownMenu dropDownMenu2 = new DropDownMenu();
dropDownMenu2.setStyleName("dropdown-submenu");
dropDownMenu2.add(new AnchorListItem("Item 1"));
HTML child = new HTML();
child.addStyleName("caret");
anchorButton2.add(child);
anchorButton2.addClickHandler(new ClickHandler() {

    @Override
    public void onClick(ClickEvent event) {
        anchorButton2.removeStyleName("dropdown-toggle");
        listDropDown.addStyleName("open");
        if(!listDropDown2.getStyleName().contains("open")){
            listDropDown2.addStyleName("open");                 
        }else{
            listDropDown2.removeStyleName("open");
        }

    }
});
listDropDown2.add(anchorButton2);
anchorButton2.removeStyleName("dropdown-toggle");
listDropDown2.add(dropDownMenu2);


dropDownMenu.add(listDropDown2);

Answer 1

Bootstrap 3 does not support submenus。这是因为 Bootstrap 3 是移动优先框架，子菜单在移动设备上没有意义。

如果您仍想使用子菜单，可以easily add them yourself。您必须在您的应用程序中某处添加引用的 CSS 并创建一个 DropDownSubmenu 小部件，与 DropDownMenu 非常相似，但使用样式 dropdown-submenu，而不是 dropdown-menu.

带有子菜单的 GwtBootstrap3 NavBar

GwtBootstrap3 NavBar with submenu

gwt

gwtbootstrap3