B4J Tutorial [BANanoVuetifyAD3] Create Professional Looking Vuetify WebSites & WebApps with BANano

Mashiane

Expert
Licensed User
Longtime User
IMPORTANT NOTE: Removal of Firebase Resources from BVAD3 Bundle

If your app uses Firebase, you need to add these resources in the Main module, before building the application.

B4X: 
'FIREBASE
    BANano.Header.AddJavaScriptfile("https://www.gstatic.com/firebasejs/9.1.1/firebase-app.js")
    BANano.header.AddJavaScriptfile("https://www.gstatic.com/firebasejs/9.1.1/firebase-analytics.js")
    BANano.header.AddJavaScriptfile("https://www.gstatic.com/firebasejs/9.1.1/firebase-auth.js")
    BANano.header.AddJavaScriptfile("https://www.gstatic.com/firebasejs/9.1.1/firebase-firestore.js")
    BANano.header.AddJavaScriptfile("https://www.gstatic.com/firebasejs/9.1.1/firebase-messaging.js")
    BANano.header.AddJavaScriptfile("https://www.gstatic.com/firebasejs/9.1.1/firebase-storage.js")
    BANano.header.AddJavaScriptfile("https://www.gstatic.com/firebasejs/9.1.1/firebase-performance.js")
    BANano.header.AddJavaScriptfile("https://www.gstatic.com/firebasejs/9.1.1/firebase-database.js")
    BANano.header.AddJavaScriptfile("https://www.gstatic.com/firebasejs/9.1.1/firebase-functions.js")

As these are no longer included in the definition of BVAD3 projects library.

For more details, see on the kitchen sink
 
Reactions: LJG

Mashiane

Expert
Licensed User
Longtime User
Version 6.05 - Update 5 - The Bye Bye BindState/BindVueElement Edition.

Download 605[5] Here
Download 605[5] Kitchen Sink Here

It is with pleasure to confirm that the BindState/BindVueElement debacle is not permanently sorted. You dont have to write any BindState/BindVueElement calls anymore as this is done automatically for you when these lines of code are executed

B4X: 
Vuetify.Serve
and

B4X: 
vuetify.AddRoute(?)

TERMS AND CONDITIONS

1. All components on your layout should be defined as variables in Class_Globals. You do this via 'Generate Members' in the Designer.
2. Setting default properties / adding items to components SHOULD BE DONE after .Serve or vuetify.AddRoute
For more details see these code modules
2.1 ViewADAutoComplete
2.2 ViewADBottomNav
2.3 ViewADCombo
2.4 ViewADDatePicker
2.5 ViewADMenus
2.6 ViewADSelects
2.7 ViewADSparkLines

etc etc

Actually, please just skim the Kitchen Sink Source Code to understand how the changes impact the new bindstate-less approach.

WHEN TO EXECUTE BIND-STATE?

There is however just 1 case where I called .BindState, its for one of the tables, the only reason for that is because the VForm is linked to the DataSource and DataTable. In such cases, .BindState has to be called after loadlayout.

CASES WHERE STUFF IS DONE AT DESIGN TIME

Steppers, Tabs

For now these have no easier way to create at run-time.

Have fun & Enjoy
 

Mashiane

Expert
Licensed User
Longtime User
[BANanoVuetifyAD3][BANanoServer] Version 6.05 [5]



Ola

Its happening!!! We finally sorted out the BindState/BindVueElement debacle. When this feature was requested, it seemed impossible. What BindState does is to ensure that ones event listeners are registered and BVAD3 does what it does, its re-active. Without executing such binding, your app is just a sitting duck. Previously BindState had to be done manually after "Generate Members" and now with BANanoVuetifyAD3 version 6.05 update 5, this is done automatically and internally. All you have to do it generate members for everything in your layout. That's it and no more writing line after line of .BindState/BindStateOnApp.

This updates bring everything we have done eversince the last update in August 2021, gradients, animation, pdf reporting, dynamic tables, sweet alerts and many many more.

Get yourself a free copy of BANanoVuetify today now. You can develop using PHP as a back-end / firebase or Jetty via the BANanoServer.

BANanoVuetifyAD3 Library Download
BANanoVuetifyAD3 Kitchen Sink Download
BANAnoVuetifyAD3 BANAnanoServer Kitchen Sink

PS: These all depend on the BANano Library by Alain, get it here.

BTW: We use the abstract designer and LoadLayout to create our UI, with very minimal coding.
 

Mashiane

Expert
Licensed User
Longtime User
Reminder: vuetify.GetRefs is only usable on pages added with AddRoute ONLY and nothing else.

Fact: You can completely not use the DataSource on your projects but use the BANanoMySQLE, BANAnoMSSQLE and BANanoSQLiteE and BANanoALASQLE, the DataSource just abstracts these classes so that you dont code, however using the classes themselves provides the greatest of flexibility.
 
Reactions: LJG

Mashiane

Expert
Licensed User
Longtime User
Once again, thanks to everyone who is supporting this project, whether they find bugs, give advice, send donations, I humbly thank you, its making a huge difference. I get to buy data to be able to do the explainer videos, get internet access to post lessons on the Mashy Teaches Series and also add valuable things. Enjoy!
 
C

Christian75

Member
Hi,

With 6.05 my VElement.Bind also stopped working is there a way to write those in another way now ?
B4X: 
VLabel1.VElement.Bind("style", "textcolor")

In the web page console log I see this printout, (and it worked in 6.04):
Uncaught TypeError: Cannot read properties of undefined (reading 'bind')

I know that for "style" I could use the Visual Designer but if I want to code it then how do I do it ?
 
Last edited:

Mashiane

Expert
Licensed User
Longtime User
Please see this post

[BANanoVuetifyAD3] Create Professional Looking Vuetify WebSites & WebApps with BANano

Ola ************************************************** Feb 2024: BVAD3 RoadMap https://www.b4x.com/android/forum/threads/bananovuetifyad3-2024-roadmap.159326/ ************************************************* Download Additional Libraries Download BANanoVuetifyAD3Core Library OR Download...
www.b4x.com

As Indicated there, for applying classes and styles at runtime, use these calls

Classes & Styling

  • ToggleClass
  • AddClassRT (AddClass is for usage after BANanoLoadLayout only for DESIGN TIME)
  • RemoveClassRT (RemoveClass is for usage after BANanoLoadLayout only for DESIGN TIME)
  • AddStyleRT (AddStyleClass is for usage after BANanoLoadLayout only for DESIGN TIME)
  • RemoveStyleRT
 
Last edited:

Mashiane

Expert
Licensed User
Longtime User
Morning yall. I kindly request that you please if you have ever donated or purchased any of bvad3 projects, to send me your last PayPal transaction number, your email address, b4x forum name, full name, to my email address mbanga.anele@gmail.com, I need to send you the source code for the chat module and the kanban board. Only people who are kind enough to action this request will receive the source as I won't include it on the normal channel. I thank you.
 

Star-Dust

Expert
Licensed User
Longtime User
In the link to download BANanoVuetifyAD3, instead of the B4XLib library there are the compressed sources. Is it involuntary or it was done on purpose.
Do we need to import the sources?
 
You must log in or register to reply here.

Similar Threads

  • Article
Share My Creation BANano File Sharer Dashboard
Replies
2
Views
2K
Mashiane
  • Article
B4J Library [BANanoVueMaterial]: The first complete opensource VueJS UX based framework for BANano
16 17 18
Replies
351
Views
60K
NGUYEN TUAN ANH
  • Article
Share My Creation [BANanoWebix] An OpenSource Webix UX Wrapper for BANano
2 3
Replies
58
Views
20K
Mashiane
  • Article
Share My Creation [BANano] WebSites, WebApps, Frameworks Created with BANano
2 3
Replies
43
Views
7K
Mashiane
  • Article
B4J Tutorial [BANano] v2: (2) B4J Abstract Designer
Replies
0
Views
4K
alwaysbusy
Menu
Log in
Register
Cookies are required to use this site. You must accept them to continue using the site. Learn more…