Dynamic menu in VL WEB (SOLVED)

This Q&A forum allows users to post and respond to "How Do I Do ....." questions. Please do not use to report (suspected) errors - you must use your regional help desk for this. The information contained in this forum has not been validated by LANSA and, as such, LANSA cannot guarantee the accuracy of the information.
Post Reply
kno_dk
Posts: 89
Joined: Tue Feb 23, 2016 12:00 am

Dynamic menu in VL WEB (SOLVED)

Post by kno_dk » Thu Jul 25, 2019 11:52 pm

Hi.

I am trying to build a dynamic menu in Appbar. When I click on the menu icon to the right I should have a pop menu. I have added 3 menu items to the menu but only the last one is shown.

I cant see why. Any suggestion?

Is this the best way of making a dynamic pop up menu in the appbar?

Here is my sample source

Begin_Com Role(*EXTENDS #PRIM_WEB) Layoutmanager(#LayoutMain)

Define_Com Class(#PRIM_TBLO) Name(#LayoutMain)
Define_Com Class(#PRIM_TBLO.Column) Name(#LayoutMainColumn1) Displayposition(1) Parent(#LayoutMain)
Define_Com Class(#PRIM_TBLO.Row) Name(#LayoutMainRow1) Displayposition(1) Parent(#LayoutMain) Height(75) Units(Pixels)
Define_Com Class(#PRIM_TBLO.Row) Name(#LayoutMainRow2) Displayposition(2) Parent(#LayoutMain)
Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutMainItem1) Manage(#Appbar) Parent(#LayoutMain) Row(#LayoutMainRow1) Column(#LayoutMainColumn1) Alignment(TopLeft) Flow(Down)

Define_Com Class(#PRIM_TBLO) Name(#AppbarLayout)
Define_Com Class(#PRIM_TBLO.Column) Name(#AppbarLayoutColumn1) Displayposition(1) Parent(#AppbarLayout)
Define_Com Class(#PRIM_TBLO.Row) Name(#AppbarLayoutRow1) Displayposition(1) Parent(#AppbarLayout)
Define_Com Class(#PRIM_TBLO.Item) Name(#AppbarLayoutItem1) Alignment(CenterRight) Column(#AppbarLayoutColumn1) Flow(Left) Manage(#MenuIcon) Parent(#AppbarLayout) Row(#AppbarLayoutRow1) Sizing(None)
Define_Com Class(#PRIM_TBLO.Item) Name(#AppbarLayoutItem2) Alignment(CenterRight) Column(#AppbarLayoutColumn1) Flow(Left) Manage(#PersonIcon) Parent(#AppbarLayout) Row(#AppbarLayoutRow1) Sizing(None)
Define_Com Class(#PRIM_TBLO.Item) Name(#AppbarLayoutItem3) Alignment(CenterRight) Column(#AppbarLayoutColumn1) Flow(Left) Manage(#SearchIcon) Parent(#AppbarLayout) Row(#AppbarLayoutRow1) Sizing(None)
Define_Com Class(#PRIM_TBLO.Item) Name(#AppbarLayoutItem4) Manage(#Menu) Parent(#AppbarLayout) Sizing(None) Alignment(BottomRight)

Define_Com Class(#PRIM_MD.AppBar) Name(#Appbar) Caption('Title') Displayposition(1) Icon('menu') Layoutmanager(#AppbarLayout) Parent(#COM_OWNER) Tabposition(1) Themedrawstyle('Heading2') Height(75) Width(1200)
Define_Com Class(#PRIM_MD.Icon) Name(#MenuIcon) Displayposition(1) Icon('more_vert') Left(1152) Parent(#Appbar) Tabposition(1) Top(13)
Define_Com Class(#PRIM_MD.Icon) Name(#PersonIcon) Displayposition(2) Icon('person') Left(1104) Parent(#Appbar) Tabposition(2) Top(13)
Define_Com Class(#PRIM_MD.Icon) Name(#SearchIcon) Displayposition(3) Icon('search') Left(1056) Parent(#Appbar) Tabposition(3) Top(13)
Define_Com Class(#PRIM_MD.Menu) Name(#Menu) Displayposition(4) Height(400) Left(960) Parent(#PopupSettings) Tabposition(4) Top(25) Width(240)

Define_Com Class(#Prim_acol<#Prim_Md.MenuItem>) Name(#MenuItems)


Define_Com Class(#PRIM_TBLO) Name(#LayoutPopUp)
Define_Com Class(#PRIM_TBLO.Column) Name(#LayoutPopUpColumn1) Displayposition(1) Parent(#LayoutPopUp)
Define_Com Class(#PRIM_TBLO.Row) Name(#LayoutpopUpRow1) Displayposition(1) Parent(#LayoutPopUp)
Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutPopUpItem1) Manage(#Menu) Parent(#LayoutPopUp) Row(#LayoutpopUpRow1) Column(#LayoutPopUpColumn1) Alignment(TopLeft) Flow(Down)

Define_Com Class(#Prim_ppnl) Name(#PopupSettings) Top(0) Height(400) Width(150) Style(#Style2) Layoutmanager(#LayoutPopUp)

Define_Com Class(#PRIM_VS.Style) Name(#Style2) Backgroundbrush(#Brush2)
Define_Com Class(#PRIM_VS.SolidBrush) Name(#Brush2) Color(240:240:240)
Define_Com Class(#Prim_Md.MenuItem) Name(#TempItem) Reference(*DYNAMIC)
Evtroutine Handling(#COM_OWNER.Initialize)
#TempItem <= (*New #Prim_Md.MenuItem)

Set Com(#TempItem) Parent(#Menu) Caption("Caption Item 1") Displayposition(1)
#MenuItems.Insert Item(#TempItem)

Set Com(#TempItem) Parent(#Menu) Caption("Caption Item 2") Displayposition(2)


#MenuItems.Insert Item(#TempItem)

Set Com(#TempItem) Parent(#Menu) Caption("Caption Item 3") Displayposition(3)


#MenuItems.Insert Item(#TempItem)



Endroutine

Evtroutine Handling(#MenuIcon.Click)
#PopupSettings.ShowPopup Left(#COM_OWNER.Width - 240) Placement(Absolute)
Endroutine
End_Com

User avatar
MarcusLancaster
Posts: 22
Joined: Tue Nov 24, 2015 9:20 pm

Re: Dynamic menu in VL WEB

Post by MarcusLancaster » Fri Jul 26, 2019 12:09 am

Hi.

Try this version of your code... the trick is to use a method to instantiate each dynamic menu item... in your original version only one menu item was inserted into the menu... the caption shown was the last one set.

Hope that helps :-)

Cheers for now.

Marcus.

Begin_Com Role(*EXTENDS #PRIM_WEB) Layoutmanager(#LayoutMain)

Define_Com Class(#PRIM_TBLO) Name(#LayoutMain)
Define_Com Class(#PRIM_TBLO.Column) Name(#LayoutMainColumn1) Displayposition(1) Parent(#LayoutMain)
Define_Com Class(#PRIM_TBLO.Row) Name(#LayoutMainRow1) Displayposition(1) Parent(#LayoutMain) Height(75) Units(Pixels)
Define_Com Class(#PRIM_TBLO.Row) Name(#LayoutMainRow2) Displayposition(2) Parent(#LayoutMain)
Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutMainItem1) Manage(#Appbar) Parent(#LayoutMain) Row(#LayoutMainRow1) Column(#LayoutMainColumn1) Alignment(TopLeft) Flow(Down)

Define_Com Class(#PRIM_TBLO) Name(#AppbarLayout)
Define_Com Class(#PRIM_TBLO.Column) Name(#AppbarLayoutColumn1) Displayposition(1) Parent(#AppbarLayout)
Define_Com Class(#PRIM_TBLO.Row) Name(#AppbarLayoutRow1) Displayposition(1) Parent(#AppbarLayout)
Define_Com Class(#PRIM_TBLO.Item) Name(#AppbarLayoutItem1) Alignment(CenterRight) Column(#AppbarLayoutColumn1) Flow(Left) Manage(#MenuIcon) Parent(#AppbarLayout) Row(#AppbarLayoutRow1) Sizing(None)
Define_Com Class(#PRIM_TBLO.Item) Name(#AppbarLayoutItem2) Alignment(CenterRight) Column(#AppbarLayoutColumn1) Flow(Left) Manage(#PersonIcon) Parent(#AppbarLayout) Row(#AppbarLayoutRow1) Sizing(None)
Define_Com Class(#PRIM_TBLO.Item) Name(#AppbarLayoutItem3) Alignment(CenterRight) Column(#AppbarLayoutColumn1) Flow(Left) Manage(#SearchIcon) Parent(#AppbarLayout) Row(#AppbarLayoutRow1) Sizing(None)
Define_Com Class(#PRIM_TBLO.Item) Name(#AppbarLayoutItem4) Manage(#Menu) Parent(#AppbarLayout) Sizing(None) Alignment(BottomRight)

Define_Com Class(#PRIM_MD.AppBar) Name(#Appbar) Caption('Title') Displayposition(1) Icon('menu') Layoutmanager(#AppbarLayout) Parent(#COM_OWNER) Tabposition(1) Themedrawstyle('Heading2') Height(75) Width(1200)
Define_Com Class(#PRIM_MD.Icon) Name(#MenuIcon) Displayposition(1) Icon('more_vert') Left(1152) Parent(#Appbar) Tabposition(1) Top(13)
Define_Com Class(#PRIM_MD.Icon) Name(#PersonIcon) Displayposition(2) Icon('person') Left(1104) Parent(#Appbar) Tabposition(2) Top(13)
Define_Com Class(#PRIM_MD.Icon) Name(#SearchIcon) Displayposition(3) Icon('search') Left(1056) Parent(#Appbar) Tabposition(3) Top(13)
Define_Com Class(#PRIM_MD.Menu) Name(#Menu) Displayposition(4) Height(400) Left(960) Parent(#PopupSettings) Tabposition(4) Top(25) Width(240)

Define_Com Class(#Prim_acol<#Prim_Md.MenuItem>) Name(#MenuItems)


Define_Com Class(#PRIM_TBLO) Name(#LayoutPopUp)
Define_Com Class(#PRIM_TBLO.Column) Name(#LayoutPopUpColumn1) Displayposition(1) Parent(#LayoutPopUp)
Define_Com Class(#PRIM_TBLO.Row) Name(#LayoutpopUpRow1) Displayposition(1) Parent(#LayoutPopUp)
Define_Com Class(#PRIM_TBLO.Item) Name(#LayoutPopUpItem1) Manage(#Menu) Parent(#LayoutPopUp) Row(#LayoutpopUpRow1) Column(#LayoutPopUpColumn1) Alignment(TopLeft) Flow(Down)

Define_Com Class(#Prim_ppnl) Name(#PopupSettings) Top(0) Height(400) Width(150) Style(#Style2) Layoutmanager(#LayoutPopUp)

Define_Com Class(#PRIM_VS.Style) Name(#Style2) Backgroundbrush(#Brush2)
Define_Com Class(#PRIM_VS.SolidBrush) Name(#Brush2) Color(240:240:240)

Evtroutine Handling(#COM_OWNER.Initialize)

#com_owner.umAddMenuItem iCaption("Caption Item 1")
#com_owner.umAddMenuItem iCaption("Caption Item 2")
#com_owner.umAddMenuItem iCaption("Caption Item 3")

Endroutine

mthroutine umAddMenuItem
define_map for(*input) name(#iCaption) class(#prim_alph)
Define_Com Class(#Prim_Md.MenuItem) Name(#TempItem)

Set Com(#TempItem) Parent(#Menu) Caption(#iCaption) Displayposition(9999)
#MenuItems.Insert Item(#TempItem)

endroutine

Evtroutine Handling(#MenuIcon.Click)
#PopupSettings.ShowPopup Left(#COM_OWNER.Width - 240) Placement(Absolute)
Endroutine

Pablo
Posts: 41
Joined: Wed Dec 02, 2015 10:35 am

Re: Dynamic menu in VL WEB

Post by Pablo » Fri Jul 26, 2019 12:11 am

Hi Klaus,

You are only instantiating one menu item:

#TempItem <= (*New #Prim_Md.MenuItem)

Therefore these commands ...

Set Com(#TempItem) Parent(#Menu) ...

are affecting the one #TempItem you have created and the collection will only have that one item.
You need to create the other ones in the same way:

#TempItem <= (*New #Prim_Md.MenuItem)

Set Com(#TempItem) Parent(#Menu) Caption("Caption Item 1") Displayposition(1)
#MenuItems.Insert Item(#TempItem)

#TempItem <= (*New #Prim_Md.MenuItem)

Set Com(#TempItem) Parent(#Menu) Caption("Caption Item 2") Displayposition(2)
#MenuItems.Insert Item(#TempItem)

#TempItem <= (*New #Prim_Md.MenuItem)

Set Com(#TempItem) Parent(#Menu) Caption("Caption Item 3") Displayposition(3)
#MenuItems.Insert Item(#TempItem)

Regards,
Pablo

Post Reply