Wish B4J RAD Development (Drag n Drop)

Magma

Expert
Licensed User
Longtime User
Well i have to say that many here tried to create beautiful libraries and apps help to create beautiful apps (i have to mention ABMaterial, Erel's B4X Form Builder etc, Saif's Coming Soon Bootstrap editor / sorry if i forgot someone)...

Well will be really helpful if we have a drag n drop environment creation with SQL commands too (integration, not for specific db's all can be possible, jrdc) like old Vb6 Pro with {binding} data and etc... especially for CRUD/Business apps... ofcourse will be better if it allows to create Fast B4X-HTML5 WebApps (Forms, Grids, Modal Form-Sheet-PopUp Window,etc) too... can offer some way of templates (Not difficult to understand, no need extra knowledge of divs/css)

That's ofcourse it is something difficult but can be an add on by payment (hope cheap) for those who want to create fast business apps (ERP's, Invoice Apps, POS, CRMs).

some ideas....

- This environment could export all these like code - that will be easy to edit and create custom solutions
- Or could use new libraries and load them like modal forms or something (not so sure if that will help a lot)

Well that will make B4X creating apps in minutes...
 

Magma

Expert
Licensed User
Longtime User
sorry i think created double post (seems same):

oops :-(

getting old
 

Mashiane

Expert
Licensed User
Longtime User
With BVAD3, you are able to completely use the Abstract Designer for UI building, PDF report generating, Email designing, Excel Report Generation, Database Connectivity, and now including Firebase. You generate your events just like normal b4x development too. Above all else, with the latest developments, you don't even write a single code for CRUD. You can see this Server Categories CRUD MySQL example.

You can check our the online Kitchen Sink WebApp that features most of these. If you want to run it offline, download this zip file and double click the index.html file.

1624632475229.png


Its also easy to set up and get going. Based on Material Design from Google. Also the nice thing is when RemoveDeadCode is turned on and online minification before you publish your app, you have very light source code. Did I tell you, it produces PWAs. All powered by BANano.

1624632732832.png


As the base for this is VueJS, it means you have all the power of Reactivity in your hands, no page reloads!!

And yes, for people who are in a hurry, a layout free possibility of a source code generator is also available.

By the way, the layout above produces this..

1624633380808.png


The complete app is less than 300 lines of code after I "tweaked" it to my needs, everything else was abstract designer specified!


B4X:
'Static code module
Sub Process_Globals  
    Public vuetify As VuetifyApp
    Public home As VueComponent
    Public path As String
    Public name As String = "home"
    Private banano As BANano
    Private FB As BANanoDataSourceFireBase
    Private txtfirstname As VTextField
    Private txtfullname As VTextField
    Private txtlastname As VTextField
    Private txtuserid As VTextField
    Private usersCont As VContainer
    Private usersR2 As VRow
    Private usersR2C1 As VCol
    Private usersR2C2 As VCol
    Private btnSaveUser As VBtn
    Private userMsgBox As VMsgBox
    Private tblUsers As VueTable
    Private txtage As VTextField
    Private tblFName As VToolBarTitle
    Private tblUser As VToolBar
    Private ageDistribution As VChartKick
End Sub

Sub Initialize
    'establish a reference to the app
    vuetify = pgIndex.vuetify
    'initialize the component
    home.Initialize(Me, name)
    home.vuetify = vuetify
    path = home.path
    '
    'build the page html here
    banano.LoadLayout(home.Here, "home")
    'bind the element
    FB.BindState(home)
    txtfirstname.BindState(home)
    txtfullname.BindState(home)
    txtlastname.BindState(home)
    txtuserid.BindState(home)
    usersCont.BindState(home)
    usersR2.BindState(home)
    usersR2C1.BindState(home)
    usersR2C2.BindState(home)
    btnSaveUser.BindState(home)
    userMsgBox.BindState(home)
    tblUsers.BindState(home)
    txtage.BindState(home)
    tblFName.BindState(home)
    tblUser.BindState(home)
    ageDistribution.BindState(home)
   
    home.SetMounted(Me, "LoadUsers", Null)
    'watch for changes in the data
    home.SetWatch("user.firstname", True, True, Me, "updatefullname", Null)
    home.SetWatch("user.lastname", True, True, Me, "updatefullname", Null)
   
    home.SetComputed("user.fullname", Me, "updatefullname", Null)
   
    'add this route component to the app
    vuetify.AddRoute(home)
End Sub  

Sub LoadUsers            'ignoreDeadCode
    'set the datasource to nothing
    FB.RESET
    'connect to firebase
    FB.Connect
End Sub

'update the full name
Sub updatefullname() As String
    Dim fn As String = home.GetData("user.firstname")
    Dim ln As String = home.GetData("user.lastname")
    Dim ff As String = $"${fn} ${ln}"$
    home.SetData("user.fullname", ff)
End Sub


Private Sub btnSaveUser_Click (e As BANanoEvent)
    'update the loading status of the button
    btnSaveUser.UpdateLoading(home, True)
    'create or update a record depending on the mode
    FB.CREATE_OR_UPDATE
End Sub

Sub AddNew
    'set the mode to create
    FB.CREATE_MODE
    'get the refs and link them to this router
    home.refs = vuetify.GetRefs
    'set the contents of the form to the defaults
    FB.DEFAULTS
    'focus to the first name
    home.SetFocus(txtfirstname.id)
End Sub

Private Sub FB_SelectAll (Success As Boolean, Response As String, Error As String, affectedRows As Int, Result As List)
    'load table contents
    tblUsers.Reload(Result)
    'load chart contents
    ageDistribution.Clear
    For Each person As Map In Result
        Dim firstname As String = person.Get("firstname")
        Dim age As String = person.Get("age")
        age = banano.parseInt(age)
        ageDistribution.AddXY(firstname, age)
    Next
    ageDistribution.Refresh
    tblUsers.UpdateLoading(False)
End Sub

Private Sub FB_Connected (Success As Boolean)
    'depending on the connection status, update the button
    If Success = False Then
        'make the button red
        vuetify.UpdateColor("btnFirebase", "red")
        vuetify.ShowSwalToastError("Could not connect to firebase, refresh your browser!", 2000)
        Return
    End If
   
    'change the button to green
    vuetify.UpdateColor("btnFirebase", "green")
    tblUsers.UpdateLoading(True)
    'execute the select all
    FB.SELECTALL
End Sub

Private Sub userMsgBox_ok_click (e As BANanoEvent)
    'get the process
    Dim sprocess As String = userMsgBox.Process(home)
    Select Case sprocess
    Case "delete"
        'update loading of the button
        tblUsers.UpdateLoading(True)
        'we are deleting the user, set the mode
        FB.DELETE_MODE
        'hide the dialog
        userMsgBox.UpdateVisible(home, False)
        'delete the record from the db, it has been saved
        FB.DELETE      
    End Select
End Sub

Private Sub userMsgBox_cancel_click (e As BANanoEvent)
    'hide the dialog
    userMsgBox.UpdateVisible(home, False)
End Sub


Private Sub tblUsers_Add_Click (e As BANanoEvent)
    AddNew
End Sub

Private Sub tblUsers_Edit (item As Map)
    'show loading on table
    tblUsers.UpdateLoading(True)
    'read from the database in case the record has changed
    FB.UPDATE_MODE
    'read the record
    FB.READ1(item)
End Sub

Private Sub tblUsers_Delete (item As Map)
    'get the singular
    Dim ssingular As String = FB.Singular
    'build the message
    Dim msg As String = $"Está seguro de que desea eliminar este registro?"$
    'set the record to delete
    FB.SetRecord(item)
   
    Dim sDisplayvalue As String = FB.DisplayValue
    'ask the user to confirm deleting
    userMsgBox.Confirm(home, "delete", $"Thibitisha Futa: ${sDisplayvalue} ${ssingular.tolowercase}"$, msg, "Ita", "Um")
End Sub

Private Sub tblUsers_Refresh_Click (e As BANanoEvent)
    'upload loading of the table
    tblUsers.UpdateLoading(True)
    'select everything from fb
    FB.SELECTALL  
End Sub

Private Sub tblUsers_ClearSort_Click (e As BANanoEvent)
    tblUsers.ClearSort
End Sub

Private Sub tblUsers_Back_Click (e As BANanoEvent)
    vuetify.NavigateTo("/")
End Sub

Private Sub FB_Delete (Success As Boolean, Response As String, Error As String, affectedRows As Int, Result As List)
    'turn off loading
    tblUsers.UpdateLoading(False)
    '
    If affectedRows = 0 Then
        'no delete was made
        vuetify.ShowSwalToastInfo("The person could not be deleted!", 2000)
    Else if affectedRows = 1 Then          
        vuetify.ShowSwalToastSuccess("Person was deleted successfully!", 1000)
        'reload all categories
        FB.SELECTALL
    End If
End Sub

Private Sub FB_Read (Success As Boolean, Response As String, Error As String, affectedRows As Int, Result As List)
    'hide table loading
    tblUsers.UpdateLoading(False)
    'Do we have a record
    If affectedRows = 1 Then
        'the form data has been updated automatically
    Else
        vuetify.ShowSwalToastError("Person could not be read!", 2000)
        'prepare adding a new record instead
        AddNew
    End If
End Sub


Private Sub FB_Create (Success As Boolean, Response As String, Error As String, affectedRows As Int, Result As List)
    'turn off loading for button
    btnSaveUser.UpdateLoading(home, False)
    'show notification
    If affectedRows >= 1 Then
        vuetify.ShowSwalToastSuccess("Person created successfully!", 1000)
        'ready the screen for another entry
        AddNew
        'load everything in the database / append to the table this record
        tblUsers.UpdateLoading(True)
        FB.SELECTALL
    Else          
        vuetify.ShowSwalToastError("Person could not be created!", 2000)
    End If
End Sub

Private Sub FB_Update (Success As Boolean, Response As String, Error As String, affectedRows As Int, Result As List)
    'hide table loading
    btnSaveUser.UpdateLoading(home, False)
    'Do we have a record
    If affectedRows = 1 Then
        'the form data has been updated automatically
        vuetify.ShowSwalToastError("Person updated successfully!", 1000)
        'reload all categories
        FB.SELECTALL
    Else
        vuetify.ShowSwalToastError("Person could not be updated!", 2000)
        'prepare adding a new record instead
        AddNew
    End If
End Sub

Private Sub FB_OnAuthStateChanged (User As Map)
    Log("FB_OnAuthStateChanged")
    Log(User)
End Sub

All the best!
 
Top