Directory

← Back

HybridMenu

Modern Navigation Menu

Author

Rating

Popularity

400+

Modern Navigation Menu

Its a Menu for navigating between views. In addition you are able to customize some components and connectors. You are welcome to use it.

Im happy for some suggestions

If you have any questions or want to report a bug, I ask you to create an issue in Gitlab

Sample code

@Push
@Theme(Lumo.class)
@BodySize(height = "100vh", width = "100vw")
public class DemoRouterLayout extends HybridMenu {
	private static final long serialVersionUID = 2766167599243004212L;

	@Override
	public boolean init(VaadinSession vaadinSession, UI ui) {
		withConfig(new MenuConfig());
		// Create Menu Entrys

		return true; // build menu
	}
}
LeftMenu leftMenu = getLeftMenu();

leftMenu.add(HMLabel.get()
		.withCaption("<b>Hybrid</b> Menu")
		.withIcon(new Image("./frontend/HybridMenu/Images/Logo.png", "HybridMenu Logo")));

// BreadCrumbs can be set if enable
getBreadCrumbs().setRoot(leftMenu.add(HMButton.get()
		.withCaption("Home")
		.withIcon(VaadinIcon.HOME)
		.withNavigateTo(HomePage.class)));

leftMenu.add(HMButton.get()
		.withCaption("Notification Builder")
		.withIcon(VaadinIcon.BELL)
		.withNavigateTo(NotificationBuilderPage.class));

HMSubMenu memberList = leftMenu.add(HMSubMenu.get()
		.withCaption("Member")
		.withIcon(VaadinIcon.USERS));

memberList.add(HMButton.get()
		.withCaption("Settings")
		.withIcon(VaadinIcon.COGS)
		.withNavigateTo(SettingsPage.class));

memberList.add(HMButton.get()
		.withCaption("Member")
		.withIcon(VaadinIcon.USERS)
		.withNavigateTo(MemberPage.class));
UI.getCurrent().getElement().setAttribute("theme", ""); // Light
UI.getCurrent().getElement().setAttribute("theme", Lumo.DARK) // Dark
TopMenu topMenu = getTopMenu();

topMenu.add(HMTextField.get(VaadinIcon.SEARCH, "Search ..."));

topMenu.add(HMButton.get()
		.withIcon(VaadinIcon.HOME)
		.withDescription("Home")
		.withNavigateTo(HomePage.class));

getNotificationCenter()
		.setNotiButton(topMenu.add(HMButton.get()
				.withDescription("Notifications")));
withConfig(MenuConfig.builder()
			.breadcrumbs(true) // Use breadcrumbs
			.build());

/* Available Settings */
private ETheme theme = ETheme.Lumo;

private VaadinIcon subMenuIcon = VaadinIcon.ANGLE_UP;

private VaadinIcon notificationButtonIcon = VaadinIcon.BELL;
private VaadinIcon notificationButtonEmptyIcon = VaadinIcon.BELL_O;
private VaadinIcon notificationCenterCloseIcon = VaadinIcon.ANGLE_RIGHT;
private VaadinIcon notificationRemoveIcon = VaadinIcon.CLOSE;

private NotificationPosition notificationPosition = NotificationPosition.BOTTOM;

private long notificationDisplayTime = 5000;

private VaadinIcon breadcrumbSeperatorIcon = VaadinIcon.ANGLE_RIGHT;
private boolean breadcrumbs = true;

public static int notificationQueueMax = 200;

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Thanks to Slawek Mikula

  • fix notification-center bug on many uis on a one session
  • NotificationCenter.java - add notification delete event listener
  • do not block ExecutorService indefinitely on notificationQueue
Released
2020-11-15
Maturity
STABLE
License
Apache License 2.0

Compatibility

Framework
Vaadin 8.0+
Vaadin 24 in 3.2.3
Vaadin 23 in 3.2.2
Vaadin 22 in 3.2.1
Vaadin 21 in 3.2.1
Vaadin 20 in 3.2.1
Vaadin 19 in 3.2.1
Vaadin 18 in 3.2.1
Vaadin 17 in 3.2.1
Vaadin 16 in 3.2.1
Vaadin 15 in 3.2.1
Vaadin 14 in 3.2.1
Vaadin 13 in 3.0.5
Vaadin 12 in 3.0.5
Vaadin 11 in 3.0.5
Vaadin 10 in 3.0.5
Browser
Firefox
Google Chrome
Internet Explorer
Microsoft Edge

HybridMenu - Vaadin Add-on Directory

Modern Navigation Menu HybridMenu - Vaadin Add-on Directory
Modern Navigation Menu Its a Menu for navigating between views. In addition you are able to customize some components and connectors. You are welcome to use it. Im happy for some suggestions If you have any questions or want to report a bug, I ask you to create an issue in [Gitlab](https://gitlab.com/KaesDingeling/Hybrid-Menu/issues)
Vaadin 10 Source Code
Vaadin 23 Source Code
Vaadin 8 Source Code
View on GitLab
Issue tracker
Vaadin 14 Source Code

HybridMenu version 3.0.0

HybridMenu version 3.0.1

HybridMenu version 3.0.5
HybridMenu ported for Vaadin 10

HybridMenu version 3.0.6
add BreadCrumbs

HybridMenu version 3.0.7
bugfixes and improvements

HybridMenu version 3.0.8
bugfixes and improvements #48 - notification title missing length check

HybridMenu version 3.0.9
[#61](https://gitlab.com/KaesDingeling/Hybrid-Menu/issues/61) - Problem with MenuConfig.get().withBreadcrumbs(false)

HybridMenu version 3.0.10
NotificationCenter can now display multiple notifications at once

HybridMenu version 3.0.11
Add psydo Views to SubMenu #70

HybridMenu version 3.0.12
- fix bug in theme-builder [#72](https://gitlab.com/KaesDingeling/Hybrid-Menu/issues/72) - add withData fluent-api for HMButton [#71](https://gitlab.com/KaesDingeling/Hybrid-Menu/issues/71)

HybridMenu version 3.0.13
### Thanks to Slawek Mikula - fix notification-center bug on many uis on a one session - NotificationCenter.java - add notification delete event listener - do not block ExecutorService indefinitely on notificationQueue

HybridMenu version 3.2.1
Update Vaadin to 23

HybridMenu version 3.2.2
Fix bug for upload new versions to directory and update to v23

HybridMenu version 3.2.3
Update to Vaadin 24

Online