MenuBar Menu MenuSplitter component ?

Good day.

Continuing mine work with Vaadin I found that it doesn’t have the MenuSplitter component. :frowning: is there any possibility of achiving that ?

Would be there improvement in the menu design ? Now it looks kind of unattractive.

Best regards,
Ilya Dyoshin

Can you give more info on what a MenuSplitter is, so that someone could help you to achieve one.
Menubar is in fact visually highly customaisable to your end. You can do wonderfully much with just css.


I think we could do with some additional menu items. MenuSplitter, CheckMenuItem, etc… It would be a good Community Friday project for someone around here :stuck_out_tongue:

Jens has a good idea too, one could use for example the border properties of CSS. The problem with the CSS approach is that currently, there is no easy way to style individual menu items. I think that the server-side MenuItem class could have some way to specify style names, since it doesn’t inherit from the Component “line” of classes (so it doesn’t have setStyleName() for example).

To your comment on the theme, I think the new theme released with Vaadin, “poro”, improves the appearance of MenuBar. You should definitively give it a try.

I looked at MenuBar a little more, and found an ugly workaround if you need this solved right now:

MenuBar menuBar = new MenuBar();
MenuItem topItem = menuBar.addItem("Top Item", null);

topItem.addItem("SubItem 1", null);
topItem.addItem("<hr class=\"foobar\"/>", null);
topItem.addItem("SubItem 2", null);

With some CSS you could make it look decent. But this needs to be solved in a better way at some point.

the official name of the theme is reindeer :slight_smile:
poro was the dev name - but the theme is now default in Vaadin

Aaand this was me. didn’t log in.

That’s right, the new theme has a new look for MenuBar as well. And as Jens pointed out, the new theme is officially called “Reindeer” (use lowercase when applying it in Java code), poro was used as an internal “codename” :slight_smile:

Also, I have styled MenuBar for the old default theme (now called “runo”), and it now fits in with the rest of the Runo theme. Somehow it had gone under my radar when it was included in an earlier release, hence the previous “ugly” looks.

I don’t know about the newest theme…

But I’m using Vaadin 6.0.0.pre2 and the menu bar doesn’t look like the menu bar - just a set of text fields:

Maybe I’ve made some mistake ?

Even fonts are different for different menuItems - I’ve created all with no styling - styling for me is the last – but the app should look cute to make it usable.

Also it doesn’t change styles for menuitems with submenu and without… and that make a big disorder for the user.

Not exactly, you just need to use the final 6.0.0 package that was released today :slight_smile:

I completely agree, and this is a known issue. You can currently specify the icon yourself, though, with MenuBar.setSubmenuIcon(Resource icon) (which is quite stupid, I know. The developer shouldn’t need to bother about the theme or asthetics).

This should be done completely with CSS, and we have a ticket about this. It didn’t quite make it in to this release, but I’ll be fixing it shortly after our trip to JavaOne.

Here’s the ticket:

And here’s a quick screenshot how it should look like with the Reindeer theme:

Wow!!! such an eyecandy!!! Greate Job!!! i’m very excited!!! :grin: