Snackbar (Bootstrap 4, 5): Difference between revisions

From NSB App Studio
Jump to navigation Jump to search
(Created page with "NSB.Snackbar(message, actionText, action) File:Snackbar.png Snackbars contain a single line of text directly related to the operation performed. The message stays on the...")
 
No edit summary
Line 1: Line 1:
NSB.Snackbar(message, actionText, action)
NSB.Snackbar(''message'', ''actionText'', ''action'')


[[File:Snackbar.png]]
[[File:Snackbar.png]]
== Description ==


Snackbars contain a single line of text directly related to the operation performed. The message stays on the screen for a few seconds, then fades away. Snackbars may contain a text action, but no icons. They originated in [https://en.wikipedia.org/wiki/Material_Design Google's Material Design].
Snackbars contain a single line of text directly related to the operation performed. The message stays on the screen for a few seconds, then fades away. Snackbars may contain a text action, but no icons. They originated in [https://en.wikipedia.org/wiki/Material_Design Google's Material Design].
Line 14: Line 16:


''action'' is required if you have an actionText argument. It's the name of a function to call.
''action'' is required if you have an actionText argument. It's the name of a function to call.
== Example ==
BASIC
<pre>
Function Button1_onclick()
  Snackbar("This is a warning about something.", "more?", snackBarDismiss)
End Function
Function snackBarDismiss()
  MsgBox "Closed!"
End Function
</pre>
JavaScript
<pre>
Button1.onclick = function() {
  NSB.Snackbar("This is a warning about something." , "more?" , snackBarDismiss);
};
function snackBarDismiss() {
  NSB.MsgBox("Closed!");
}
</pre>
== Output ==
<pre>
(depends on button. See nsbMsgBox sample)
</pre>
== Related Items ==
[[msgbox|MsgBox]]
[[Category:Language Reference]]
[[Category:Messages]]

Revision as of 23:07, 16 October 2018

NSB.Snackbar(message, actionText, action)

Description

Snackbars contain a single line of text directly related to the operation performed. The message stays on the screen for a few seconds, then fades away. Snackbars may contain a text action, but no icons. They originated in Google's Material Design.

The implementation is based on a sample by Mat Scales.

It is only available for Bootstrap 4.

message is the primary message of the Snackbar. It can be of any length: the Snackbar will expand to show multiple lines of text.

actionText is optional. It appears in a contrasting and invites the user to take action. It could be more information, or actions like "Save", "Cancel" or "Ignore".

action is required if you have an actionText argument. It's the name of a function to call.

Example

BASIC

Function Button1_onclick()
  Snackbar("This is a warning about something.", "more?", snackBarDismiss)
End Function

Function snackBarDismiss()
  MsgBox "Closed!"
End Function

JavaScript

Button1.onclick = function() {
  NSB.Snackbar("This is a warning about something." , "more?" , snackBarDismiss);
};

function snackBarDismiss() {
  NSB.MsgBox("Closed!");
}

Output

(depends on button. See nsbMsgBox sample)

Related Items

MsgBox