GWT MenuBar.Resources... ignored?

Question

I'm creating a MenuBar, and I want to have it display a little icon when there are sub-elements to be displayed. I thought I could achieve this like so:

interface ActionHeroResources extends ClientBundle, MenuBar.Resources
{
    @Source("actionhero.css")
    public ActionHeroCSS css();

    @Override
    @Source("agw-dropdown.png")
    ImageResource menuBarSubMenuIcon();
}

private static final ActionHeroResources RESOURCES = GWT.create(ActionHeroResources.class);

MenuBar actionMenu = new MenuBar(true, RESOURCES);

public ActionHero()
{
    actionMenu.addItem("Select", aSelectMenuFullOfOptions);
}

But the menu appears with the word "Select" an no icon! I'm positive my ImageResource is working correctly because I use menuBarSubMenuIcon().getURL() from the same resource later, and my image shows up just as you'd expect. In the HTML generated by GWT, there is absolutely no distinction between the items with MenuBars as children and the items with Commands. My CSS is working fine.

Any thoughts?

score 2 · Answer 1 · answered Oct 28 '11 at 09:57

Try overriding the CSS style for .gwt-MenuBar-vertical .subMenuIcon-selected, like this:

.gwt-MenuBar-vertical .subMenuIcon-selected {
    background: none;
}

I use this for my own selected items and it works great:

.gwt-MenuBar-vertical .subMenuIcon-selected {
    background: url(images/hand_pointer.png) no-repeat 0px 0px;
}

score 0 · Answer 2 · answered Apr 30 '13 at 08:23

You can simply set a css rule for the that appears in the sub menu like this:

.subMenuIcon > img {
    /* override gwt sub menu icon */
    width: 6px !important;
    height: 11px !important;
    background: url('your-image-relative-path.png') no-repeat 0px 0px !important;
}

score 0 · Accepted Answer · answered Dec 08 '11 at 00:27

The problem was ultimately that the popup panels that form the submenus take their stylename from the parent, but append a dependent stylename. I don't know of a way to predict what that dependent stylename will be, since the original stylename is obfuscated. I worked around this problem by using the more generic .gwt-MenuBar popup stylename. This only works because I only have one style of popup menu in my program - I'm not sure what I would do if I wanted two popups to look different!

Hopefully, in later gwt releases, the MenuBar styles will come more closely from the resources passed to the menubar and make less use of dependent style names.

GWT MenuBar.Resources... ignored?

3 Answers3