B4J Question BANanoVuetify AD3 problem

Lello1964

Well-Known Member
Licensed User
Longtime User
I'm testing BANanoVuetify AD3

i have a vuetify.NewList from demo , when i click on navigationDrawer item event navlist_click ShowSnackBarSuccess but item is empty.

Other problem how use "to:" to link page ?

B4X:
Sub PageLinks
    Dim pages As List = vuetify.NewList
    pages.Add(CreateMap("icon": "mdi-account-multiple", "title":"Clienti", "subtitle":"Archivio clienti","to":"/clienti" ))
    pages.Add(CreateMap("icon": "mdi-package-variant", "title": "Articoli","subtitle":"Archivio articoli","to":"/" ))
    pages.Add(CreateMap("icon": "mdi-folder" , "title": "Ordini","subtitle":"Archivo ordini","to":"/clienti" ))
    pages.Add(CreateMap("icon": "mdi-email", "title": "Messaggi","subtitle":"Messaggi","to":"/" ))
    vuetify.SetData("pages", pages)
End Sub

'this Is linkes To the list
Sub navlist_click(item As String )
    vuetify.ShowSnackBarSuccess(  item )
End Sub

Raffaele
 

Mashiane

Expert
Licensed User
Longtime User
On the Demos folder, there are 12 sub-folders dealing with BVAD3, which project are you referring to? Otherwise, upload your project.

Creating multiple pages and linking them to the "to" router is explained i think in part 4 of the videos. Your code above will not work because you are referencing the same to:/ element.

Here is the playlist:


Ta!
 
Upvote 0

Mashiane

Expert
Licensed User
Longtime User
I want know how set to: in
vuetify.NewList
I'm sorry I really do not understand what you are trying to mean here. Without a sample project from your side I cannot reproduce your problem as I am not clear.

With that said..., a list like this, I can confirm with surety that its discussed in Part 05 of the tutorials in detail.

Here is the link,


 
Upvote 0

Lello1964

Well-Known Member
Licensed User
Longtime User
I'm sorry

i have this code :

B4X:
Sub Process_Globals
    Public vuetify As VuetifyApp
    Private BANano As BANano
    Private vsnackbar As VueElement
    Private routerview As VueElement
    Private vappbar As VueElement
    Private vappbarnavicon As VueElement
    Private vmain As VueElement
    Private vnavigationdrawer As VueElement
    Private vtoolbartitle As VueElement
    Private vlogo As VueElement
End Sub

Sub Init
    'initialize the app
    vuetify.Initialize(Me)
    'initialize and import the component
    'load v-app to app template
    BANano.LoadLayout("#apptemplate", "vbaseline")
    vuetify.BindVueElement(vsnackbar)
    vuetify.BindVueElement(routerview)
    vuetify.BindVueElement(vappbar)
    vuetify.BindVueElement(vappbarnavicon)
    vuetify.BindVueElement(vmain)
    vuetify.BindVueElement(vtoolbartitle)
    vuetify.BindVueElement(vnavigationdrawer)
    vuetify.BindVueElement(vlogo)
    '
    vuetify.SetData("apptitle", Main.AppTitle)
    vnavigationdrawer.Width = 350
    
    ' set up snack bar stuff: depends on the vsnackbar layout
    vuetify.SnackBarInitialize
    'add a list to the navdrawer
    Dim vlist As VueElement = NewList("vnavigationdrawer", "navlist", Null)
    vlist.Shaped = True
    'add a template to the drawer list
    Dim vlistitem As VueElement = NewListItem("navlist", "navlistitem", "page", "iconleft", "pages", 0, CreateMap("inset":False, "avatarclass":"mr-2", "iconclass":"mr-2"))
    vuetify.BindVueElement(vlistitem)
    
    AddRouters
    PageLinks
    '
    'show the drawer
    vuetify.SetData("appdrawer", True)
    
    'render the ux
    vuetify.Serve
End Sub

Sub AddRouters
    ViewHome.Initialize
    ViewClienti.Initialize
End Sub

Sub PageLinks
    Dim pages As List = vuetify.NewList
    pages.Add(CreateMap("color":"purple","icon": "mdi-account-multiple", "title":"Clienti", "subtitle":"Archivio clienti","#tag":"/clienti" ))
    pages.Add(CreateMap("icon": "mdi-package-variant", "title": "Articoli","subtitle":"Archivio articoli","#tag":"/" ))
    pages.Add(CreateMap("icon": "mdi-folder" , "title": "Ordini","subtitle":"Archivo ordini","to":"/clienti" ))
    pages.Add(CreateMap("icon": "mdi-email", "title": "Messaggi","subtitle":"Messaggi","to":"/" ))
    vuetify.SetData("pages", pages)
End Sub

'this Is linkes To the list
Sub navlist_click(item As String )
    vuetify.ShowSnackBarSuccess(  item )
End Sub

I have 2 view : ViewHome and ViewClienti

i have use your demo : InBox

i want link vnavigationdrawer items directly to pages :

pages.Add(CreateMap("icon": "mdi-folder" , "title": "Ordini","subtitle":"Archivo ordini","to":"/clienti" )) --->> when click open ViewClient page
pages.Add(CreateMap("icon": "mdi-email", "title": "Messaggi","subtitle":"Messaggi","to":"/" )) --->> when click open ViewHome page

I have tryed to use navlist_click(item As String ), the item string is empty and i don't know why

I hope I was clear now

Raffaele
 
Upvote 0

Mashiane

Expert
Licensed User
Longtime User
i want link vnavigationdrawer items directly to pages :
Now I'm clear. Thanks, in that example I wanted to show how one can use the click event to navigate. There is another simpler option to navigate without having to execute a click event, this is via a router to attribute in each drawer list item.

I recommend you please do this..

Watch Part 04 - 06 of the tutorials, with emphasis to Part 05. Part 05 is about creating lists with the abstract designer.

Part 07, which is a continuation from Part 04 and later tutorials addresses the issue of navigating from the drawer list items to pages using routers. Its much more simpler than the Inbox code.

Tutorial

Ta!
 
Last edited:
Upvote 0
Top