B4J Tutorial [ABMaterial] Msgbox and InputBox (2.51)

alwaysbusy

Expert
Licensed User
Sometimes you just need to show a quick msgbox or a single field inputbox to the user. In ABMaterial you can build some quick modal sheets to do this. But in 2.51 I've integrated the possibility for such cases just to do it in one line of code (like a normal msgbox/inputbox).

Examples:
B4X:
page.Msgbox("MSGBOX1", "This is a very simple msgbox", "Msgbox()", "OK", "")
upload_2017-2-12_12-0-6.png


B4X:
theme.AddMsgBoxTheme("image")
theme.MsgBox("image").ConfirmButtonColor = ABM.COLOR_GREEN
theme.MsgBox("image").CancelButtonColor = ABM.COLOR_RED
theme.MsgBox("image").SetImage("https://unsplash.it/400/200", 400, 200)
theme.MsgBox("image").BackColor = ABM.COLOR_BLUEGREY
theme.MsgBox("image").BackColorIntensity = ABM.INTENSITY_LIGHTEN5

page.Msgbox2("MSGBOX3", "This is an msgbox with an image using a {C:#00AA00}theme{/C}!", "Msgbox2() 2", "OK","CANCEL",True, ABM.MSGBOX_TYPE_WARNING, "image")
upload_2017-2-12_12-2-24.png


B4X:
page.InputBox("INPUTBOX1", "This is an inputbox for text.","OK", "CANCEL", True, ABM.INPUTBOX_TYPE_QUESTION, ABM.INPUTBOX_QUESTIONTYPE_TEXT,"","Type some text...", "", "Please enter something!", "")
upload_2017-2-12_12-3-30.png


B4X:
page.InputBox("INPUTBOX3", "This is an inputbox for a password.","OK", "CANCEL", True, ABM.INPUTBOX_TYPE_QUESTION, ABM.INPUTBOX_QUESTIONTYPE_PASSWORD,"","Type your password...", "", "Please enter a password", "")
upload_2017-2-12_12-3-43.png


B4X:
page.InputBox("INPUTBOX6", "This is an inputbox with a radio selection.","OK", "CANCEL", True, ABM.INPUTBOX_TYPE_QUESTION, ABM.INPUTBOX_QUESTIONTYPE_RADIO,"#00ff00", "","{'#ff0000': 'Red','#00ff00': 'Green','#0000ff': 'Blue'}", "You must select a color", "")
upload_2017-2-12_12-4-43.png


B4X:
page.InputBox("INPUTBOX7", "This is an inputbox with a checkbox.","OK", "CANCEL", True, ABM.INPUTBOX_TYPE_QUESTION, ABM.INPUTBOX_QUESTIONTYPE_CHECKBOX,"", "I agree with the terms and conditions","", "Please agree with the conditions", "")
upload_2017-2-12_12-5-51.png


Events:
B4X:
Sub page_MsgboxResult(returnName As String, result As String)
   myToastId = myToastId + 1   
   page.ShowToast("toast" & myToastId, "toastgreen", returnName & " " & result, 5000)
End Sub

Sub page_InputboxResult(returnName As String, result As String)
   myToastId = myToastId + 1   
   page.ShowToast("toast" & myToastId, "toastred", returnName & " " & result, 5000)
End Sub
I'll try to finish up 2.51 today so I can send out this Maintenance update next week.

Alain
 

Harris

Well-Known Member
Licensed User
This one feature reduces some of my pages code by half! (buildmsg, load msg, msgyes, msgno subs.......)

Yet, I am bit confused (as always).

page_MsgboxResult(returnName As String, result As String)

returnName = ID? Now I can build case statement and know what to do next?
Case returnName
...
End Case


result = (ok button, cancel button, color value (R,G,B), input value ("I typed this in input ") ???

Thanks
 

alwaysbusy

Expert
Licensed User
more or less ;-)

A typical structure in an app could be like this:
B4X:
Sub page_InputboxResult(returnName As String, result As String)
   Select Case returnName
     Case "INPUTBOX4"
       Select Case result
         Case ABM.INPUTBOX_RESULT_CANCEL, ABM.INPUTBOX_RESULT_CLOSE, ABM.INPUTBOX_RESULT_ESC, ABM.INPUTBOX_RESULT_OVERLAY, ABM.INPUTBOX_RESULT_INVALID
           ' the user did something to close the inputbox without pressing OK.  These are all different cases of 'CANCEL'
         Case Else
           ' in the result is now the value or selection the user made, the user pressed OK         
       End Select
     Case "INPUTBOX5"
       Select Case result
         Case ABM.INPUTBOX_RESULT_CANCEL, ABM.INPUTBOX_RESULT_CLOSE, ABM.INPUTBOX_RESULT_ESC, ABM.INPUTBOX_RESULT_OVERLAY, ABM.INPUTBOX_RESULT_INVALID
           ' the user did something to close the inputbox without pressing OK.  These are all different cases of 'CANCEL'
         Case Else
           ' in the result is now the value or selection the user made, the user pressed OK         
       End Select
     Case "INPUTBOX6"
       Select Case result
         Case ABM.INPUTBOX_RESULT_CANCEL, ABM.INPUTBOX_RESULT_CLOSE, ABM.INPUTBOX_RESULT_ESC, ABM.INPUTBOX_RESULT_OVERLAY, ABM.INPUTBOX_RESULT_INVALID
           ' the user did something to close the inputbox without pressing OK.  These are all different cases of 'CANCEL'
         Case Else
           ' in the result is now the value or selection the user made, the user pressed OK         
       End Select
   End Select
End Sub
 

Harris

Well-Known Member
Licensed User
WT(Flying)F?

I don't see where OK was clicked?

I shall have to experiment and provide concrete examples where is does (and hopefully not) - doesn't work...

Hey, it looks good - just need time to screw with...



explaining these may be useful

ABM.INPUTBOX_RESULT_CANCEL,
ABM.INPUTBOX_RESULT_CLOSE,
ABM.INPUTBOX_RESULT_ESC,
ABM.INPUTBOX_RESULT_OVERLAY,
ABM.INPUTBOX_RESULT_INVALID

and any others that may be overlooked / not explained ...

Thanks
 

alwaysbusy

Expert
Licensed User
ABM.INPUTBOX_RESULT_CANCEL: the user pressed cancel
ABM.INPUTBOX_RESULT_CLOSE: the user clicked on the little X in the top right
ABM.INPUTBOX_RESULT_ESC: the userpressed the ESC button
ABM.INPUTBOX_RESULT_OVERLAY: the user clicked on the dark overlay
ABM.INPUTBOX_RESULT_INVALID: I think this one is depreciated, but I'll have to check back into the JS code

ANY other result value means the user clicked on OK. But as we can only pass two params in B4J's call sub, instead of passing something like INPUTBOX_RESULT_OK, I immidiately give you the result of what the user has entered in the input field, or whick radio button he has picked, or the value of the checkbox, etc...
 

Harris

Well-Known Member
Licensed User
Sweet... I make it very simple....
The title is large and bold (which IS the message)... I blank the message "".
Centered in any screen and width / length adjusted.

Accepts {BR} which is nice...


B4X:
    Dim msgtit As String
    If a_mode Then  'agenda mode
        msgtit = "Create New (or Overwrite Existing) Agenda Document? "&"{BR}{BR}"&" Note - If Overwrite, it will crush your hard work you did previously..."
    Else                 ' meeting mode
        msgtit = "Create A New Meeting Document?"
    End If
    page.Msgbox2("MSGBOX3", "", msgtit, "OK","CANCEL",True, "", "image")   ' removed sample image in theme
msg1.jpg

Meeting

msg2.jpg

Agenda


Not truly modal because if you click outside the MsgBox, it will be dismissed with a response code.
That is fine since you really looking for the msgok response to do something useful.

Thanks AB, now I can spend the next week ridding complicated code and making it simple... (not hard at all - just time sucking).
No really, I do mean thank you...

Perhaps later, when you have nothing better to do....
page.Msgbox3 - with third button option ("OK","Cancel","Other")

EDIT: Sorry, if hasCloseButton = false, than dialog is modal...
 
Last edited:

alwaysbusy

Expert
Licensed User
page.Msgbox2("MSGBOX3", "", msgtit, "OK","CANCEL",True, "", "image")
Crafty to use "" for the dialogType parameter. I like it so much, I'll give it its own constant: MSGBOX_TYPE_NOICON

page.Msgbox3 - with third button option ("OK","Cancel","Other")
This question has been asked in the SweetAlert2 forum (msgbox is based on it) a couple of times. They always dismissed it. When implementing the msgbox methods, I tried to do it myself, but after a couple of days of searching, I understand why they dismissed it (from one of their answers:) "it wasn't designed from the beginning for N buttons and it's a complex task to refactor it to support N buttons. As a matter of fact it would increase the plugins complexity twice or even more."

So, I guess, we're going to have to live with two buttons for now...
 

Harris

Well-Known Member
Licensed User
So, I guess, we're going to have to live with two buttons for now...
No harm...
I suspect that the clever use of radio buttons will more than compensate for the lack of a third button.
We certainly don't need plugins that are MORE complex.

I also notice that msgok (ABM.MSGBOX_RESULT_OK) is returned when pressing OK button... Nice.
 
Top