Bunifu Picture Box

Display good-looking avatars to your WinForms apps with a number of additional styling options.

Overview

Bunifu PictureBox is a customizable Picturebox that allows you to create a circular picture box, sharp corner picture box, or rounded corner picture box. With a few property changes, you can easily create nice avatars for your design that will give your UI a modern look.

Below is a good example where we have used Bunifu PictureBox to display a list of doctors in a hospital CRM.

Getting started with Bunifu PictureBox

This section will guide you on using Bunifu PictureBox via the designer approach.

Adding Bunifu PictureBox via the Designer View

Bunifu PictureBox can be added to the form by dragging it from the toolbox, to your desired location. Once dropped, the Picturebox will be loaded with a default blue avatar image.

Displaying a custom avatar image on Bunifu PictureBox

There are several ways we can assign and display a custom avatar image to the control. One quick way is to click the action glyph located at the upper right corner of the control, and selecting the choose image option just like the standard Windows Form PictureBox Control.

Another way to load an image on the control is by navigating to the property window when the control is selected. Find the property named Image, click the ellipsis button located on the value of that property, and then a dialog window will pop up with options to let you locate your desired image.

🧙‍♂️ In order to display good-looking, full-sized avatar images on the control, the size of that image must be 512x512 pixels. To set that size, we need an image editing software to resize our image.

As good .NET developers, we may want to load these avatar images from a specific file during run time. This is how we do it via code:

    private void Form2_Load(object sender, EventArgs e)
        {
            bunifuPictureBox1.WaitOnLoad = true;
            FileStream stream = new FileStream(@"C:\Images\doctor 1.png", FileMode.Open);
            Bitmap bitmap = new Bitmap(stream);
            bunifuPictureBox1.SizeMode = PictureBoxSizeMode.Zoom;
            bunifuPictureBox1.Image = (Image)bitmap;
        }

Customizing Bunifu PictureBox

You might wonder what can we customize in this control other than assigning images, setting the size mode, and putting it in our desired location of the form. Well, Bunifu PictureBox has been privileged to have properties that we can manipulate and as always unleash our creativeness. Here’s what we can customize:

The Border Radius Property

The BorderRadius property allows you to easily adjust the radius value thus changing the default radius of the control. The following is an example where we have set the control's boundary radius with a value of 21.

Note that setting a zero (0) value on the BorderRadius property will render the control into a box-shaped control, taking the form of the standard PictureBox control for Win Forms

The Type Property

The Type property provides us a more fine-grained control in rendering the PictureBox in the application. It can be set to display either a circle or a square-shaped like control. The circular-shaped value is designed to display avatar like images while the square-shaped value is intended to render any other image of your choice. Below is an example where we've set the type value to square.

Remarks

We hope by using Bunifu Picture Box, will help you create a better user experience for your users.

Should you have feedback or suggestions please send us via chat on the bottom right corner of the screen.

Last updated