How to get the margin between menu items in pyjamas or gwt?

I have implemented a MenuBar using pyjamas as:

from pyjamas.ui.RootPanel import RootPanel
from pyjamas.ui.Composite import Composite
from pyjamas.ui.MenuBar import MenuBar

class Menubar(Composite):
    def __init__(self):开发者_如何学Python
        Composite.__init__(self)

        menubar = MenuBar(vertical=False)
        menubar.addItem("Dashboard", "")
        menubar.addItem("FileInspect", "")

        self.initWidget(menubar)

RootPanel().add(Menubar())

But by all means i have tried, i am unable to get the margin/space between the menuitems "Dashboard" and "FileInspect". Your suggestions are warmly appreciated.

In GWT you can add a MenuItemSeparator between any pair of menu items that you want to separate. The width of the separator determines the separation between items. You can set the style for your separator such that it appears invisible. For example,

private MenuBar myMenuBar=new MenuBar(false); // false for horizontal menu bar
private MenuItemSeparator separator=new MenuItemSeparator();
private MenuItem item1;
private MenuItem item2;

myMenuBar.add(item1);
myMenuBar.add(separator);
myMenuBar.add(item2);

separator.setStyleName("separatorStyle");

In your CSS you define separatorStyle. For example, if you want a 20px separation...

.separatorStyle{
width: 20px;
padding: 0px;
margin: 0px;
border: none;
background: none;
}

OK so first look in the api documentation at http://pyjs.org/api/ and look for menubar (Ctrl+F finds it ok) or if you're lazy then you can see it here: http://pyjs.org/api/pyjamas.ui.MenuBar.MenuBar-class.html

That doesn't help in this case because there's no setSpacing() method or similar but at least it tells us that for sure.

So I guess you have to do it via css. Look in the showcase example:

pyjamas/examples/showcase/src/public/Showcase.css

Now you'll see there's a gwt-MenuBar class right at the top. So you've got two choices; either use the addStyleName() method of the MenuBar widget or just edit the existing style in the css. I'd probably do the latter.

Hope that helps!! Don't forget to accept if it does.