Hi
I want to give option to users to choose SideBar menu or standard menu options i.e. menu bar on top of the app. I have extended the mainWindow with side bar menu.
Now when I set the sidebar menu .setVisible(false) and standardMenu (AppMenu) with .setVisible(true). It works but I don’t see the standard menu panel anymore, only menu items are displayed as attached.
How can i display the standard menu with the menu panel?
tsarev
(Daniil Tsaryov)
June 21, 2017, 8:10am
#2
Hello!
I just checked what you want to do and everything works as it should.
Could you provide your application or just mainwindow.xml extension and main window controller?
Hi Deniil
Please find below the ext-mainwindow.xml and controller
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<window xmlns="[url=http://schemas.haulmont.com/cuba/window.xsd"]http://schemas.haulmont.com/cuba/window.xsd"[/url];
caption="mainMsg://application.caption"
class="com.company.erp.web.mainwindow.ExtMainwindow"
xmlns:chart="[url=http://schemas.haulmont.com/charts/charts.xsd"]http://schemas.haulmont.com/charts/charts.xsd"[/url];
xmlns:main="[url=http://schemas.haulmont.com/cuba/mainwindow.xsd">]http://schemas.haulmont.com/cuba/mainwindow.xsd">[/url];
<dsContext>
<collectionDatasource id="companiesDs"
class="com.company.util.entity.Company">
<query>
<![CDATA[select e from companyutil$Company e]]>
</query>
</collectionDatasource>
<valueCollectionDatasource id="customerSalesDs">
<query>
<![CDATA[select e.customer, SUM(e.amount) as amount
from erp$SalesOrder e
group by e.customer order by e.customer]]>
</query>
<properties>
<property class="com.company.erp.entity.ar.CustomerProfile"
name="customer"/>
<property datatype="double"
name="soAmount"/>
</properties>
</valueCollectionDatasource>
<valueCollectionDatasource id="salesOrderStatisticsDs">
<query>
<![CDATA[select e.docDate, COUNT(e.amount) as orders, SUM(e.amount) as amount
from erp$SalesOrder e
Group by e.docDate Order by e.docDate]]>
</query>
<properties>
<property datatype="date"
name="docDate"/>
<property datatype="int"
name="orders"/>
<property datatype="double"
name="amount"/>
</properties>
</valueCollectionDatasource>
</dsContext>
<dialogMode height="600"
width="800"/>
<layout stylename="c-sidemenu-responsive">
<hbox id="horizontalWrap"
expand="workArea"
height="100%"
stylename="c-sidemenu-layout"
width="100%">
<main:menu id="menuTop"
responsive="true"/>
<vbox id="sideMenuPanel"
expand="sideMenu"
height="100%"
responsive="true"
spacing="true"
stylename="c-sidemenu-panel"
width="AUTO">
<button id="mobileMenuButton"
caption="mainMsg://app.menu"
icon="icons/mobile-menu.png"
stylename="primary c-sidemenu-toggle"/>
<hbox id="mobileButtonsBox"
stylename="c-sidemenu-mobile-buttons">
<main:newWindowButton id="mobileNewWindowButton"
description="mainMsg://newWindowBtnDescription"
icon="app/images/new-window.png"/>
<main:logoutButton id="mobileLogoutButton"
description="mainMsg://logoutBtnDescription"
icon="app/images/exit.png"/>
</hbox>
<hbox id="appTitleBox"
spacing="true"
stylename="c-sidemenu-title"
width="100%">
<label id="appTitleLabel"
align="MIDDLE_CENTER"
value="mainMsg://application.logoLabel"/>
</hbox>
<embedded id="logoImage"
align="MIDDLE_CENTER"
height="40px"
stylename="c-app-icon"
type="IMAGE"
width="125px"/>
<hbox id="userInfoBox"
align="MIDDLE_CENTER"
expand="userIndicator"
margin="true"
spacing="true"
width="100%">
<main:userIndicator id="userIndicator"
align="MIDDLE_CENTER"/>
<main:newWindowButton id="newWindowButton"
description="mainMsg://newWindowBtnDescription"
icon="app/images/new-window.png"/>
<main:logoutButton id="logoutButton"
description="mainMsg://logoutBtnDescription"
icon="app/images/exit.png"/>
</hbox>
<hbox id="hBoxNotification"
align="MIDDLE_CENTER"
spacing="true">
<main:timeZoneIndicator id="timeZoneIndicator"
align="MIDDLE_CENTER"/>
<hbox id="hBox1"
spacing="true">
<label id="lblNotification"
icon="font-icon:BELL_O"/>
</hbox>
<hbox id="hBox2"
spacing="true">
<label id="lblReminder"
icon="font-icon:CALENDAR_CHECK_O"/>
</hbox>
</hbox>
<main:sideMenu id="sideMenu"
stylename="sidemenu"
width="100%"/>
<main:ftsField id="ftsField"/>
</vbox>
<main:workArea id="workArea"
height="100%">
<main:initialLayout margin="true"
spacing="true">
<vbox spacing="true">
<vbox spacing="true">
<cssLayout id="cssLayout"
height="800px"
stylename="colorBoxPanel"
width="100%"/>
</vbox>
</vbox>
</main:initialLayout>
</main:workArea>
</hbox>
</layout>
</window>
Controller
public class ExtMainwindow extends AbstractMainWindow {
@Inject
private FtsField ftsField;
@Inject
private Embedded logoImage;
@Inject
private AppMenu menuTop;
@Inject
private SideMenu sideMenu;
@Inject
private UserSessionSource userSessionSource;
@Inject
private com.haulmont.cuba.gui.components.Label lblNotification;
@Inject
private com.haulmont.cuba.gui.components.Label lblReminder;
@Inject
private PieChart pieChart;
// @Inject
// private HBoxLayout hBoxNotification;
@Inject
private HBoxLayout hBox1;
@Inject
private HBoxLayout hBox2;
@Inject
private VBoxLayout sideMenuPanel;
@Inject
private Button mobileMenuButton;
@Inject
private HBoxLayout mobileButtonsBox;
@Inject
private UserSettingService userSettingService;
@Override
public void init(Map<String, Object> params) {
super.init(params);
sideMenuPanel.setWidth("250px");
String menuOption = userSettingService.loadSetting("menuType");
menuTop.setVisible(true);
sideMenuPanel.setVisible(false);
initLayoutAnalyzerContextMenu(logoImage);
initLogoImage(logoImage);
}
@Override
public void ready() {
super.ready();
}
}
Please also note that, this mainwindow is modified one from the template generated mainwindow, When I tried to use .setVisible(false) to appMenu inside template generated ext-mainwindow, it doesn’t work. I believe you can regenerate it too.
tsarev
(Daniil Tsaryov)
July 17, 2017, 10:10am
#4
I’ve prepared an example how two menus config can be implemented. Check code snippets below:
Main window screen descriptor:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<window xmlns="http://schemas.haulmont.com/cuba/window.xsd"
xmlns:main="http://schemas.haulmont.com/cuba/mainwindow.xsd"
class="com.company.twomenus.web.screens.ExtAppMainWindow"
messagesPack="com.company.twomenus.web.screens">
<dialogMode height="600"
width="800"/>
<layout expand="foldersSplit">
<hbox id="titleBar" stylename="c-app-menubar"
expand="mainMenu" width="100%" height="AUTO"
spacing="true" margin="false;false;false;true">
<embedded id="logoImage" align="MIDDLE_LEFT" type="IMAGE" stylename="c-app-icon"/>
<main:menu id="mainMenu" align="MIDDLE_LEFT"/>
<main:ftsField id="ftsField" align="MIDDLE_LEFT"/>
<main:userIndicator id="userIndicator" align="MIDDLE_LEFT"/>
<main:timeZoneIndicator id="timeZoneIndicator" align="MIDDLE_LEFT"/>
<hbox id="mainButtonsBox" stylename="c-main-buttons" align="MIDDLE_LEFT">
<main:newWindowButton id="newWindowButton"
icon="app/images/new-window.png"
description="msg://newWindowBtnDescription"/>
<main:logoutButton id="logoutButton"
icon="app/images/exit.png"
description="msg://logoutBtnDescription"/>
</hbox>
</hbox>
<split id="foldersSplit" orientation="horizontal" pos="200px">
<main:foldersPane id="foldersPane" width="100%" height="100%"/>
<main:workArea id="workArea" width="100%" height="100%">
<main:initialLayout spacing="true" margin="true" expand="spacer">
<button caption="Change menus" invoke="changeMenus"/>
<label id="spacer"/>
</main:initialLayout>
</main:workArea>
</split>
</layout>
</window>
Screen controller:
public class ExtAppMainWindow extends AppMainWindow {
@Inject
private ComponentsFactory componentsFactory;
private SideMenu sideMenu;
@Override
public void init(Map<String, Object> params) {
super.init(params);
sideMenu = componentsFactory.createComponent(SideMenu.class);
sideMenu.setWidth("250px");
sideMenu.setHeightFull();
sideMenu.setVisible(false);
HBoxLayout hBox = componentsFactory.createComponent(HBoxLayout.class);
hBox.setSizeFull();
remove(workArea);
hBox.add(sideMenu);
hBox.add(workArea);
add(hBox);
expand(hBox);
hBox.expand(workArea);
sideMenu.loadMenuConfig();
}
public void changeMenus() {
titleBar.setVisible(!titleBar.isVisible());
sideMenu.setVisible(!sideMenu.isVisible());
}
}