Page 1 of 1

Dynamic menu in VL WEB (SOLVED)

Posted: Thu Jul 25, 2019 11:52 pm
by kno_dk
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

Re: Dynamic menu in VL WEB

Posted: Fri Jul 26, 2019 12:09 am
by MarcusLancaster
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

Re: Dynamic menu in VL WEB

Posted: Fri Jul 26, 2019 12:11 am
by Pablo
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