Bunifu Framework Docs
HomePricingFAQsMy Account
  • Introduction
  • Getting started
    • Requirements
    • Installation
    • Installing for .Net 5 & Above
    • Licensing
      • Managing your licenses
      • Bunifu Licensing CLI
      • Bunifu Device Remover (Deprecated)
  • BUNIFU UI
    • Controls
      • Bunifu Button
      • Bunifu Button (variant)
      • Bunifu Cards
      • Bunifu CheckBox
      • Bunifu Circle Progress
      • Bunifu Datagrid View
      • Bunifu Date Picker
      • Bunifu Drop Down
      • Bunifu Flat Button
      • Bunifu Form Caption Button
      • Bunifu Form Control Box
      • Bunifu Form Resize Icon
      • Bunifu Gradient Panel
      • Bunifu Icon Button
      • Bunifu Image Button (New)
      • Bunifu Image Button (Old)
      • Bunifu IOS Switch (1.5.3)
      • Bunifu Label
      • Bunifu Loader
      • Bunifu Picture Box
      • Bunifu Pages
      • Bunifu Panel
      • Bunifu Progress Bar
      • Bunifu Radial Gauge
      • Bunifu Radio Button
      • Bunifu Rating
      • Bunifu Range
      • Bunifu Separator
      • Bunifu Sliders
      • Bunifu Shadow Panel
      • Bunifu Shapes
      • Bunifu Switch (1.5.3)
      • Bunifu ScrollBars
      • Bunifu Toggle Switch
      • Bunifu Toggle Switch (variant)
      • Bunifu Tile Button
      • Bunifu Thin Button (1.5.3)
      • Bunifu ToolTip
      • Bunifu Textbox
      • Bunifu User Control
    • Components
      • Bunifu Color Transition
      • Bunifu Drag
      • Bunifu Elipse [Deprecated]
      • Bunifu Form Dock
      • Bunifu Form Drag
      • Bunifu Form Resizer
      • Bunifu Snackbar
      • Bunifu Transition
  • BUNIFU CHARTS
    • Introduction
      • Quick Tips
    • Chart Components
      • Bunifu Bar Chart
      • Bunifu Bubble Chart
      • Bunifu Canvas Control
      • Bunifu Doughnut Chart
      • Bunifu Horizontal bar Chart
      • Bunifu Line Chart
      • Bunifu Pie chart
      • Bunifu Polar Chart
      • Bunifu Radar Chart
  • BUNIFU DATAVIZ [Deprecated]
    • Basic Charts [Deprecated]
      • Step Line Chart [Deprecated]
      • Step Area Chart [Deprecated]
      • Spline Chart [Deprecated]
      • Pie Chart [Deprecated]
      • Line Chart [Deprecated]
      • Doughnut Chart [Deprecated]
      • Bar Chart [Deprecated]
      • Area Chart [Deprecated]
      • Column Chart [Deprecated]
    • Advanced Charts [Deprecated]
      • Stacked Column 100 Chart [Deprecated]
      • Stacked Column Chart [Deprecated]
      • Stacked Bar Chart 100 [Deprecated]
      • Stacked Bar Chart [Deprecated]
      • Stacked Area Chart 100 [Deprecated]
      • Stacked Area Chart [Deprecated]
      • Scatter Chart [Deprecated]
      • Range Spline Area Chart [Deprecated]
      • Range Column Chart [Deprecated]
      • Range Bar Chart [Deprecated]
      • Range Area Chart [Deprecated]
      • OHLC Chart [Deprecated]
      • Candle Stick Chart [Deprecated]
      • Bubble Chart [Deprecated]
Powered by GitBook
On this page
  • Overview
  • Getting started with Bunifu PictureBox
  • Adding Bunifu PictureBox via the Designer View
  • Displaying a custom avatar image on Bunifu PictureBox
  • Customizing Bunifu PictureBox
  • The Border Radius Property
  • The Type Property
  • Remarks

Was this helpful?

  1. BUNIFU UI
  2. Controls

Bunifu Picture Box

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

PreviousBunifu LoaderNextBunifu Pages

Last updated 4 years ago

Was this helpful?

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.

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;
        }
	Private Sub Form2_Load(ByVal sender As Object, ByVal e As EventArgs)
			bunifuPictureBox1.WaitOnLoad = True
			Dim stream As New FileStream("C:\Images\doctor 1.png", FileMode.Open)
			Dim bitmap As New Bitmap(stream)
			bunifuPictureBox1.SizeMode = PictureBoxSizeMode.Zoom
			bunifuPictureBox1.Image = CType(bitmap, Image)
	End Sub

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.

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.

🧙‍♂️