Directory

← Back

stretchy-navigation

stylish and animated strechy navigation

Author

Contributors

Rating

A compact navigation with nice animation and workflows. Wrapps CodyHouse/stretchy-navigation into vaadin-flow

Has three different display modes:

  • BurgerMenu with below slideout
  • MiddleControl with slideout left/right
  • Compact BurgerMenu

Sample code

StretchyNavigation stretchyNavigation = new StretchyNavigation(Style.NAVIGATION);
stretchyNavigation.addMenuItem(VaadinIcon.HOME.create(), "Home", true);
stretchyNavigation.addMenuItem(VaadinIcon.USER.create(), "User", false);
stretchyNavigation.addMenuItem(VaadinIcon.SERVER.create(), "Server", false);
stretchyNavigation.addMenuItem(VaadinIcon.STOCK.create(), "Stock", false);
stretchyNavigation.addMenuItem(VaadinIcon.STORAGE.create(), "Store", false);
stretchyNavigation.addNavigationListener(stretchyEvent -> {
    MenuItem menuItem = stretchyEvent.getItemClicked();
    Notification.show("Clicked: " + menuItem.getTitle());
});
layout.add(stretchyNavigation);

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

  • improved design
  • improved project setup
Released
2019-04-28
Maturity
EXPERIMENTAL
License
MIT License

Compatibility

Framework
Vaadin 10+
Browser
N/A
Online