App Layout - Addon

Flow
21

Hello,

Is there a simple way to transform the behaviour from LEFT_RESPONSIVE_OVERLAY_NO_APP_BAR to LEFT_RESPONSIVE_SMALL_NO_APP_BAR like adding an arrow to the header of the menu?

Thanks,
Vasil

22

Yes there is but I recommend using the
SpringViewProvider
 instead of the
SpringNavigator
 since it is easier.

Checkout the example here
 instead of the method
withViewProvider
 use the method
withNavigator
.

23

Do you mean something like the LEFT_HYBRID Behaviour?

The
RESPONSIVE
behaviours are meant to adjust themselves automatically so there will never be an arrow of any kind. Instead you can checkout the “non-responsive” behaviors which actually are also responsive but in a different way.

24

Yes, but without the app bar on the top. More accurate description might be LEFT_HYBRID_NO_APP_BAR.

25

All NO_APP_BAR behaviors are “required” to also be RESPONSIVE since the button to hide/show them is by default in the AppBar.
So basically what you are asking for is a not supported behavior.

I see two options:

  • You can create your own behaviour, and maybe even contribute it to the project.
  • You can try to archive similar results with one of the existing behaviors in combination with
    the following method
     (using this might cause some issues if so you can report them on github)
26

Thank you, Johannes. If I write the behaviour, I will let you know and you can decide whether to include it in the project or not.

27

If you need some help with it let me know.

28

Hi Johannes,

sorry for the delay,

May be the problem is related on the moment when i load the layout:

  1. The application starts
  2. Load the login view
  3. After login inject the layout.
if (!session.isLoggedIn()) {
     setContent(new LoginView());
} else {
     loadMenuLayout();            
}

i solved with this code.

if (getNavigator() != null) {
getNavigator().navigateTo("");
}

Thanks a lot

29

Hi,

How can i use the clickable menu to extend an action ?

}).addClickable(session.getI18n("reserved_area"), VaadinIcons.USER, clickEvent -> {
                                 
                    BrowserWindowOpener opener = new BrowserWindowOpener(new
                    ExternalResource("http://www.mysite.it"));
                    opener.setFeatures("");
                    opener.setWindowName("_blank");

                    opener.extend( ?????  );

Thanks

30

Simply use the following method to add your very own Component:

NavigationButton button = new NavigationButton("My Button", VaadinIcons.ABACUS);
NavigatorAppLayoutBuilder builder = AppLayout.getDefaultBuilder(Behaviour.LEFT_HYBRID)
                                             .add(button);
31

Hi Johannes,

thanks a lot for your reply,

i will try it soon.

Thanks again

32

Hi
I use Behaviour.LEFT_OVERLAY.
After selecting the menu item, the menu does not hide automatically. Is it possible to programmatically close the menu.

Best regards.

33

This was supposed to be fixed in 0.9.20.
Please open a ticket on GitHub and describe the issue with some code.

34

Lalita GD:
Hi,
great Addon,
is there any way to use SpringNavigator ?

Thank you.

Checkout this answer:

Johannes Goebel:

Daouda Beye:
Hi,
great Addon,
is there any way to use SpringNavigator ?

Thank you.

Yes there is but I recommend using the SpringViewProvider instead of the SpringNavigator since it is easier.
[Checkout the example here]
(https://github.com/appreciated/vaadin-app-layout/blob/master/app-layout-examples/spring-cdi/src/main/java/com/github/appreciated/demo/DemoUI.java#L43) instead of the method withViewProvider use the method withNavigator.

35

Hi,

is there a way to instantiate the class only the first time the menu is clicked ?

Regards
Giovanni

36

Pending on what method to instanciate the View (f.e. Spring) this is not possible. But you can pass instances directly to the navigator.

By using the following builder/method:

AppLayout.getDefaultBuilder(...).add(String caption, Resource icon, View element)
37

Hi, thanks for the answer, i use j2ee.

For me it could be useful to instantiate the class on first click couse the main views are some, so the startup time coul be to long.
i’ll find another solution

thanks a lot.

38

Hello, is there a way to open a view from a submenu?
I have something like this:

.add(SubmenuBuilder.get(“Configuration”, VaadinIcons.PLUS)
.add(“Dowload”, VaadinIcons.DOWNLOAD, new DownloadConfigurationView())
…

Can I open a view by clicking on the Configuration button?

39

I Have one View to Create or Change one Ticket. so In my enter method I verify if I have some parameters in url (http://localhost:8080/#!protocolo-td/3051&t=1519220867121) If have no parameters (http://localhost:8080/#!protocolo-td/) I enable the button to Save and disable the button Edit… so when my User click the button save I navigate to same view but now with parameters in my url (http://localhost:8080/#!protocolo-td/3051&t=1519220867121) (the &t=1519220867121 are to change the parameters every click and i Reload the view) so when I found some parameter in url in the case (/3051) I disable de button save and enable th button edit, but after I put our add on, when I click in save button my enter method are execute but the enable ou disable it’s no longer working. if I debug the set my button enabled =false, but in my screen the button are not disabled .(all method are executed, he save in my db but does not reflect on my screen component changes
why? tks

40

I’ve just tried out. While it works, we have a specific requirement where users with certain privileges are allowed to access a certain number of menu items across the categories. For instance, if this user is an Area Manager, he can only see like: (3 of 5 items in Category 1, 4 of 6 items in Category 2, etc…)

At the beginning, the menu construction (for all users) is like:

.add(CDISubmenuBuilder.get("Sales", VaadinIcons.PLUS)
                        .add("Sales (RM) by Outlet", FontAwesome.BAR_CHART_O, SalesByOutlet.class)
                        .add("Item Quantity by Outlet", FontAwesome.BAR_CHART_O, ItemQtyByOutlet.class)
                        .build())
                .add(CDISubmenuBuilder.get("Sales Pattern", VaadinIcons.PLUS)
                        .add("Transaction by Hour", FontAwesome.BAR_CHART_O, TransactSalesByHour.class)
                        .add("Sales (RM) by Hour", FontAwesome.BAR_CHART_O, SalesByHour.class)
                        .build())
                .add(CDISubmenuBuilder.get("Top SKUs", VaadinIcons.PLUS)
                        .add("Top SKUs", FontAwesome.BAR_CHART_O, TopSkus.class)
                        .add("Top SKUs by Count", FontAwesome.BAR_CHART_O, TopSkusCount.class)
                        .build())
                .add(CDISubmenuBuilder.get("Audit", VaadinIcons.PLUS)
                        .add("Receipt Validation", FontAwesome.BAR_CHART_O, RcptValidation.class)
                        .add("Matching - Receipt not in SYCARDA", FontAwesome.BAR_CHART_O, RcptNotInSycarda.class)
                        .build())

How do we add it later to the existing sub-menus, or is there another way to have it added at the construction level?