Bunifu Snackbar

Add stunning, interruptive-free notifications to your interfaces

Overview

Bunifu Snackbar is an impressive interruption-free control, that provides pop-up messages after specific actions are enacted by the user in the Windows Form. For example, when a user clicks a delete button in the Windows Form application, you might want to inform them that the message has been deleted. You might even want to give them an option to undo the action. It is fully customizable and will provide you as a developer with a ton of options for customizing predefined standard notification types such as success, information, and error. Other customizable options include animations, durations, and dismissing toasts. Let’s flick through on this Windows Form application that leverages on this control.

Getting Started with Bunifu Snackbar

This section will guide you on using Bunifu Snackbar via designer approach

Adding Bunifu Snackbar via the Designer View

Bunifu Snackbar control can be added to an application by dragging it from the toolbox to the Windows Form designer view. Once dropped in the form, an icon named bunifuSnackBar1 should appear in a space below the form i.e the component tray as shown in the following image.

Initializing Bunifu SnackBar with a message

Now for us to initialize a Bunifu Snackbar with a message at run time, add a button to the form and create an event handler for its click event. In the event handler, write or copy the following code snippet below:

 private void bunifuButton1_Click(object sender, EventArgs e){
            bunifuSnackbar1.Show(this, "Hello world");
  }

 Private Sub bunifuButton1_Click(ByVal sender As Object, ByVal e As EventArgs)
			bunifuSnackbar1.Show(Me, "Hello world")
 End Sub

Once you run, this will be the result:

For us to fully understand on rendering notifications with Bunifu Snackbar lets dive into this method known as the Show() method

The Show method

This is the method responsible for displaying a Bunifu Snackbar during runtime. This method has got 7 overloads which means we can pass different parameters to the method to display our notification

Let's have a deep discussion of these 7 overload methods using examples:

Show(Form, String)

Displays a Bunifu Snackbar where we'll pass a form owner value and the text to display on the snackbar.

public static Bunifu.UI.WinForms.SnackbarResult Show (Form owner, string text);

Parameters

owner Form - sets the form that will own the snackbar i.e the form that will be in charge of displaying the Bunifu Snackbar.
text String - sets the text to display in the snackbar.

Returns

SnackbarResult - It can return a result of ActionClicked, AutoClosed, UserClosed.

Example

 private void bunifuButton1_Click(object sender, EventArgs e){
            bunifuSnackbar1.Show(this, "Information sent to server");
 }

 Private Sub bunifuButton1_Click(ByVal sender As Object, ByVal e As EventArgs)
			bunifuSnackbar1.Show(Me, "Information sent to server")
 End Sub

Show(Form,String,MessageType)

Displays a Bunifu Snackbar by passing it a form owner value, the specified text, and message type.

public static Bunifu.UI.WinForms.SnackbarResult Show (Form owner, string text, MessageTypes type);

Parameters

owner Form - sets the form that will own the snackbar i.e The form that will be in charge of displaying the Bunifu Snackbar.
text String - sets the text to display in the snackbar.
type MessageTypes - sets a bitwise of MessageType value. A Message type can be of information, success, error or warning

Returns

SnackbarResult - it can return a result of ActionClicked, AutoClosed, UserClosed.

Example

The following example demonstrates how to use this overload:

  private void bunifuButton1_Click(object sender, EventArgs e) {
      bunifuSnackbar1.Show(this, "Information sent to server",
      Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Success);
  }

  Private Sub bunifuButton1_Click(ByVal sender As Object, ByVal e As EventArgs)
			bunifuSnackbar1.Show(Me, "Information sent to server",
			Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Success)
  End Sub

Show(Form,String,MessageType, Int)

Displays a Bunifu SnackBar notification, in the context where we'll have the ability to pass a time value which will be the duration in milliseconds that instructs the snackbar how long its visibility will be before automatically closes. It also gets the specified text and message types to the form that will own the snackbar

public static Bunifu.UI.WinForms.SnackbarResult Show (Form owner, string text, MessageTypes type, int duration);

Parameters

owner Form - sets the form that will own the snackbar i.e The form that will be in charge of displaying the Bunifu SnackBar.
text String - sets the text to display in the snackbar.
type MessageTypes - sets a bitwise of MessageType value. Message types can be of information, success, error or warning
duration Int - sets the time span in milliseconds for displaying the snackbar before it auto closes

Returns

SnackbarResult - It can return a result of ActionClicked, AutoClosed, UserClosed.

Example

The following example demonstrates how to use this overload

  private void bunifuButton1_Click(object sender, EventArgs e) {
      bunifuSnackbar1.Show(this, "Information sent to server",
      Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Success,4000);
  }

Private Sub bunifuButton1_Click(ByVal sender As Object, ByVal e As EventArgs)
			bunifuSnackbar1.Show(Me, "Information sent to server",
			Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Success,4000)
  End Sub

Show(Form,String,MessageType, Int, String)

Displays a Bunifu Snackbar notification in the context, where we'll have the ability to pass a string value, which is going to set the name of the action button, that will be created automatically on inside the SnackBar notification. It also gets the specified text, duration, owner form, message types parameters.

public static Bunifu.UI.WinForms.SnackbarResult Show (Form owner, string text, MessageTypes type,);

Parameters

owner Form- sets the form that will own the snackbar i.e The form that will be in charge of displaying the Bunifu SnackBar.
text String - sets the text to display in the snackbar.
type MessageTypes - sets a bitwise of MessageType value. Message types can be of information, success, error or warning
duration Int - sets the time span in milliseconds for displaying the snackbar before it auto closes
action String - sets the name of the action button that will be created in the snackbar

Returns

SnackbarResult - It can return a result of ActionClicked, AutoClosed, UserClosed.

Example

The following example demonstrates how to use this overload:

  private  void bunifuButton7_Click(object sender, EventArgs e){      
      bunifuSnackbar1.Show(this, 
      "I have a custom call back when action button is clicked", 
      Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Information,
       3000, "DISMISS");       
  }

  Private Sub bunifuButton7_Click(ByVal sender As Object, ByVal e As EventArgs)
	  bunifuSnackbar1.Show(Me, 
		"I have a custom call back when action button is clicked",
		 Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Information,
		 3000, "DISMISS")
  End Sub

Show(Form,String,MessageType, Int, String,Positions)

Displays a Bunifu SnackBar notification in the context where we'll have the ability to set the snackbar on runtime, in relative or custom position of the form. It also gets the specified text, duration, message types, and the form owner.

public static Bunifu.UI.WinForms.SnackbarResult Show (Form owner, string text, MessageTypes type, int duration, String action, Positions positions);

Parameters

owner Form - sets the Form that will own the snackbar i.e The form that will be in charge of displaying the Bunifu Snackbar.
text String - sets the text to display in the snackbar.
type MessageTypes - sets a bitwise of MessageType value. Message types can be of information, success, error or warning
duration Int - sets the time span in milliseconds for displaying the snackbar before it auto closes
action String - sets the name of the action button that will be created in the snackbar
position Positions - sets a relative postion of the snackbar by passing it an enum of type positions. The enums available for positioning are left, right, bottom, top-right,top-left, bottom-right, bottom-left, middle-center, middle-left middle-right and custom position if you may like

Returns

SnackbarResult - It can return a result of ActionClicked, AutoClosed, UserClosed.

Example

The following example demonstrates how to use this overload:

private void bunifuButton1_Click(object sender, EventArgs e){
    bunifuSnackbar1.Show(this, 
    "Snackbar on the top left side of the form", 
    Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Information,
     1000, "", 
     Bunifu.UI.WinForms.BunifuSnackbar.Positions.TopLeft);
  }

 Private Sub bunifuButton1_Click(ByVal sender As Object, ByVal e As EventArgs)
			bunifuSnackbar1.Show(Me, 
			"Snackbar on the top left side of the form", 
			Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Information,
			 1000, "", 
			Bunifu.UI.WinForms.BunifuSnackbar.Positions.TopLeft)
 End Sub

Show(Form, String, MessageType, Int, String, Position, Hosts)

Displays a Bunifu Snackbar notification in the context where we'll have the ability to set the host of this snackbar. The host could be the form, the screen, or a custom user control that hosts the snack bar. By default, the snackbar will be hosted in the form. The method also gets the specified text, duration, owner form, position, action and message types parameters

public static Bunifu.UI.WinForms.SnackbarResult Show (Form owner, string text, MessageTypes type, int duration, String action, Positions positions, Hosts host);

Parameters

owner Form - sets the form that will own the snackbar i.e The form that will be in charge of displaying the Bunifu SnackBar.
text String - sets the text to display in the snackbar.
type MessageTypes - sets a bitwise of MessageType value. Message types can be of information, success, error or warning
duration Int - sets the time span in milliseconds for displaying the snackbar before it auto closes
action String - sets the name of the action button that will be created in the snackbar
position Positions - Sets the location of the snackbar by passing it an enum of type position. The enums available are left, right, bottom, top-right,top-left, bottom-right, bottom-left, middle-center, middle-left middle-right and custom position if you may like
host Hosts - sets the container that will host the snackbar. The container could be the screen, the form or a standard/user control

Returns

SnackbarResult - It can return a result of ActionClicked, AutoClosed, UserClosed.

Example

The following example demonstrates how to use this overload:

private void bunifuButton1_Click(object sender, EventArgs e){
    bunifuSnackbar1.Show(this, 
    "Snackbar on the top left side of the form", 
    Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Information,
     1000, "", 
     Bunifu.UI.WinForms.BunifuSnackbar.Positions.TopLeft,
     Bunifu.UI.WinForms.BunifuSnackbar.Hosts.FormOwner);
  }

 Private Sub bunifuButton1_Click(ByVal sender As Object, ByVal e As EventArgs)
			bunifuSnackbar1.Show(Me, 
			"Snackbar on the top left side of the form", 
			Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Information,
			 1000, "", 
			Bunifu.UI.WinForms.BunifuSnackbar.Positions.TopLeft
			Bunifu.UI.WinForms.BunifuSnackbar.Hosts.FormOwner)
 End Sub

Customizing Bunifu Snackbar Notifications

Based on the predefined built-in notification types, i.e error, success, warning, and information, it is simple to change its appearance. The change may be in terms of the color, border, and font at the click of the property. In each of the predefined standard notification types, there is a property assigned that we can manipulate. Here’s an overview of these types and their properties.

Type of notification

Property

Success

SuccessOptions

Warning

WarningOptions

Error

ErrorOptions

Information

InformationOptions

You might ask what can we configure in these properties. Well, Bunifu Snackbar has given us a list of options to work on and unleash our creativeness as developers in UI/UX development. Here’s what you can configure:

Option property

Description

ActionBackColor

Sets the backcolor of the action button

ActionBorderColor

Sets a border color for the action button

ActionBorderRadius

Sets a border radius for the action button’s border

ActionFont

Sets a font style for the text in the action button

ActionForeColor

Sets a foreground color for the text in the action button

BackColor

Sets the backcolor color for the snackbar

BorderColor

Sets the border color for the snackbar

CloseIconColor

Sets the icon color for the closing icon in the snackbar

Font

Sets a font style for the text in snackbar

Icon

Sets the option’s icon for the snackbar

IconLeftMargin

Sets a margin between the snackbar border and the option’s icon

ForeColor

Sets a fore color for the text in snackbar

Tips: The four major parent type properties i.e SuccessOption, ErrorOption, WarningOption, InformationOption have the same list of child option properties from the table above.

Let's dive into one example where we shall customize an error notification type of Bunifu Snackbar.

ActionBackColor - 255, 255, 255
ActionBorderColor 255, 255, 255
ActionBorderRadius 1
ActionFont Segoe UI, 8.25pt, style=Bold
ActionForeColor 254, 77, 79
BackColor White
BorderColor White Close
IconColor 254, 77, 79
Font Segoe UI, 9.75pt
Icon System.Drawing.Bitmap
IconMargin 12
ForeColor Black

Suppose we wanted to have border shadows, hide or show icons and borders, or even set a margin between the icon and the message we would look at properties such as:

Properties

Description

ShowShadows

Sets a value indicating whether the snackbar will display its shadows rather than borders

ShowCloseIcon

Sets a true or false value indicating whether the close icon will be displayed

ShowBorders

Sets a true or false value indicating whether the snackbar will display its borders rather than the shadows

ShowIcon

Sets a true or false value indicating whether the snackbar’s option will be displayed

Margin

Sets the overall Snackbar’s overall distance between its host and its edges

MessageRightMargin

Sets a margin between the message and the closing icon which is on the right side the snackbar

ZoomCloseIcon

Sets a value indicating whether the close icon will zoom-in when hovered onto

DurationAfterIdle

Sets the time the snackbar will take to close after the system has been idling e.g if there's no activity like cursor movement, typing etc...

Dismissing Bunifu Snackar Notifications

Bunifu Snackbar messages can be dismissed through clicking a close icon, an action, or setting a timeframe of how long the snackbar will be active before it auto closes. Dismissing of these notifications is paramount. At times we may need to delay the snackbar when we need the user to click an action button or make sure that the user understands the message being passed through. However, at other times we may want quick dismissal of our notifications if there are other subsequent notifications from program executions. It is upon us as developers to decide for how long would we want to dismiss the snackbar. The following is a discussion on ways we can brush off our Bunifu Snackbar message from the form.

Setting a time span to dismiss Bunifu Snackbar automatically

The duration param in the show method helps us change the default active duration value of the snackbar before it automatically hides. By default, the duration value is set to last for 3000 milliseconds which means 3 seconds. The snackbar will be active until the duration runs out of the set value. Once the duration is over the snackbar will close automatically.

Below is an example where we’ll pass a duration with a value of 5000 in the show method.

The following codes will help us carry out the above example:

 private void bunifuButton1_Click(object sender, EventArgs e){
            bunifuSnackbar1.Show(this, "Snackbar displaying for 5 seconds",
             Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Information,5000);
    }

 Private Sub bunifuButton1_Click(ByVal sender As Object, ByVal e As EventArgs)
			bunifuSnackbar1.Show(Me, "Snackbar displaying for 5 seconds", 
			Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Information,5000)
 End Sub

Dismissing the notification using a close icon button

You can lay off a Bunifu Snackbar message from the form by clicking the close icon button. The close icon button can be enabled by the showCloseIcon property as true.

Dismissing through clicking the snackbar

The ClickToClose property allows us to carry out the snackbar’s dismissal once clicked by the user. Besides, the property named DoubleClickToClose allows you to have the snackbar dismissed by double-clicking it.

Dealing With Multiple Bunifu Snackbar Messages at RunTime

The MaximumValue property lends us a hand to change the default number of multiple snackbars within a given duration. By default, the property has been set to display a maximum of 7 (seven) snackbars in the container view. We can change the maximum number of multiple snack bars to show, using the MaximumView property. Here is an example where we want to display a maximum of 5 snackbars in the form container. Hence, we’ve set the MaximumView value to 5.

Tips: At times we may want to only display one notification message at a given time. We can carry that out by setting the AllowMultipleViews property to false

Positioning Bunifu Snackbar

By default, a Bunifu snackbar notification will normally appear near the top of the form/screen container, centered horizontally. However, the snackbar control can be easily custom-positioned wherever you want using the built-in positions. The example below shows a sample application that demonstrates the various positions a Bunifu snackbar can occupy.

Let's figure out how we can custom position our snackbars.

We can change the default positioning of the snackbar by either setting it on the left, right, bottom, top-right,top-left, bottom-right, bottom-left, middle-center, middle-left middle-right positions of the form. The X Positions are left right and center while the Y positions are the top, bottom, and middle.

Below is an example of a code whereby we want to position our snackbar in the top-left position of the form.

private void bunifuButton1_Click(object sender, EventArgs e){
    bunifuSnackbar1.Show(this, 
    "Snackbar on the top left side of the form", 
    Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Information,
     1000, "", 
     Bunifu.UI.WinForms.BunifuSnackbar.Positions.TopLeft,
     Bunifu.UI.WinForms.BunifuSnackbar.Hosts.FormOwner);
  }

 Private Sub bunifuButton1_Click(ByVal sender As Object, ByVal e As EventArgs)
			bunifuSnackbar1.Show(Me, 
			"Snackbar on the top left side of the form", 
			Bunifu.UI.WinForms.BunifuSnackbar.MessageTypes.Information,
			 1000, "", 
			Bunifu.UI.WinForms.BunifuSnackbar.Positions.TopLeft
			Bunifu.UI.WinForms.BunifuSnackbar.Hosts.FormOwner)
 End Sub

Tips: In the case of where multiple snackbars are shown the newest snackbar shown will occupy a lower position while the others are pushed up at equal intervals. Similarly, when a new snackbar occupies an upper position, the other snackbars will be pushed downwards.

Interactive Bunifu Snackbar

You can create a more interactive snackbar message by configuring an action on the notification pop-up that helps the users react quickly on notifications (for example, reply to a chat message, undo the current task, etc..).

Now let’s have an actual example where we will have an action that, suppose we wanted to undo an unchecked option.

The following code demonstrates how to carry out the above example:

   private void bunifuCheckBox2_CheckedChanged(object sender, BunifuCheckBox.CheckedChangedEventArgs e) {
            if (e.CheckState==BunifuCheckBox.CheckStates.Unchecked)
            {
                bunifuSnackbar1.Show(this, "Custom notification disabled !", BunifuSnackbar.MessageTypes.Warning, 4000, "Undo uncheck",
                BunifuSnackbar.Positions.BottomRight).Then((result) => {
                   if (result == BunifuSnackbar.SnackbarResult.ActionClicked)
                   {
                       bunifuCheckBox2.Checked = true;
                   }

           });
            }
       
        }

   Private Sub bunifuCheckBox2_CheckedChanged(ByVal sender As Object, ByVal e As BunifuCheckBox.CheckedChangedEventArgs)
			If e.CheckState=BunifuCheckBox.CheckStates.Unchecked Then
				bunifuSnackbar1.Show(Me, "Custom notification disabled !", BunifuSnackbar.MessageTypes.Warning, 4000, "Undo uncheck",
				 BunifuSnackbar.Positions.BottomRight).Then(Sub(result)
					If result = BunifuSnackbar.SnackbarResult.ActionClicked Then
						bunifuCheckBox2.Checked = True
					End If
				End Sub)
			End If

   End Sub

Remarks

Bunifu snackbar is an awesome! awesome! control that you would want to leverage on, in displaying good-looking notifications from your application. Unlike the MessageBox control for Winforms, the snackbar is non-interruptive and customizing its appearance is a bed of roses!

PreviousBunifu Form Resizer NextBunifu Transition

Last updated 4 years ago

Was this helpful?