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");
  }

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");
 }

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);
  }

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);
  }

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");       
  }

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);
  }

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);
  }

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.

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:

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:

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);
    }

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);
  }

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;
                   }

           });
            }
       
        }

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!

Last updated