Add the percent into a progress bar

This tutorial discusses how to add text (like the percent as mentioned in the title) into the middle of a progress bar.Instead of paying for some overpriced .NET control,you can accomplish this yourself in a very simple manner.Our attempt there was to have a label in the center of the progress bar and set its background color to transparent.However,that does not work because when the background color of a control is transparent, it will show what is behind it in its container.Since the label is contained in the form itself and not in the progress bar,that would result in you seeing through the label and the progress bar straight into the form's background color or background image.So,a label in the progress bar is out,what's next? The solution that we came up with is to use the progress bar's graphics to draw a string into the center of the progress bar.

CODE

int percent = (int)(((double)(progressBar1.Value - progressBar1.Minimum) /
(double)(progressBar1.Maximum - progressBar1.Minimum)) * 100);
    using (Graphics gr = progressBar1.CreateGraphics()){
    gr.DrawString(percent.ToString() + "%",
    SystemFonts.DefaultFont,
    Brushes.Black,
    new PointF(progressBar1.Width / 2 - (gr.MeasureString(percent.ToString()
    + "%",
    SystemFonts.DefaultFont).Width / 2.0F),
    progressBar1.Height / 2 - (gr.MeasureString(percent.ToString()
    + "%",
    SystemFonts.DefaultFont).Height / 2.0F)));
}

Let's analyze that.The percent variable is the calculated percent of the progress bar's value.Now,the next line is a bit more complicated.First,it is using the DrawString() method of the System.Drawing.Graphics class to draw text in the progress bar.Let's analyze each argument:

1.percent.ToString() + "%"
That's really self-explanatory. It says what text will be displayed.
2.SystemFonts.DefaultFont
That is the font that is displayed.In our example screenshot,we used Segoe UI.However,this is probably a better choice for an application because it is getting the default system font,but you can make it whatever you want.
3. Brushes.Black
That is the color of the text which can be easily changed.It can be a SolidBrush,which is a brush of a solid color. Or, if you want to get fancy,it can be another type of brush (for example, a TextureBrush,which has a texture defined by an image to assign it).

CODE

new PointF(progressBar1.Width / 2 - (gr.MeasureString(percent.ToString()
                 + "%",
                 SystemFonts.DefaultFont).Width / 2.0F),
                 progressBar1.Height / 2 - (gr.MeasureString(percent.ToString()
                 + "%",
                 SystemFonts.DefaultFont).Height / 2.0F))

That is where the text will be drawn in relation to the progress bar's upper-left corner.It defines the upper-left corner of where the text will be drawn. This is the most important part and needs the most explanation.Let's take a look at how we arrived at those equations to center the text:

------X Position

progressBar1.Width / 2 - (gr.MeasureString(percent.ToString() + "%",
SystemFonts.DefaultFont).Width / 2.0F)

The progressBar1.Width / 2 part will return the center point (in pixels) of the progress bar horizontally. Now, the part using the MeasureString calculates the width (in pixels) of the string to be drawn (percent.ToString() + "%").It then halves that value and subtracts it from progressBar1.Width / 2,so that the final X position will position the text's center point exactly in the progress bar's center poin

------Y Position.

progressBar1.Height / 2 - (gr.MeasureString(percent.ToString() + "%",
SystemFonts.DefaultFont).Height / 2.0F)

As with the X point, progressBar1.Height / 2 calculates the center point of the progress bar vertically. Also like the X point, the MeasureString method is used to calculate the height of the text.It is then being halved,and subtracted from "progressBar1.Height / 2", to perfectly center the text vertically.Now, to make all this easier on you,we have also created a method called SetProgressBarText that does all this automatically, which you can just copy/paste into your class if you like.With this method,we also added an option to be able to left-justify the text as well.Here it is

private void SetProgressBarText
   (
      System.Windows.Forms.ProgressBar Target,
      string Text,
      ProgressBarTextLocation Location,
      System.Drawing.Color TextColor,
      System.Drawing.Font TextFont
   )
{
      if (Target == null) { throw new ArgumentException("Null Target"); }
      if (string.IsNullOrEmpty(Text))
      {
         int percent = (int)(((double)(Target.Value - Target.Minimum) /
         (double)(Target.Maximum - Target.Minimum)) * 100);
         Text = percent.ToString() + "%";
      }
      using (Graphics gr = Target.CreateGraphics())
      {
         gr.DrawString(Text,
         TextFont,
         new SolidBrush(TextColor),
         new PointF(
         Location == ProgressBarTextLocation.Left ?
         progressBar1.Width / 2 - (gr.MeasureString(Text,
         TextFont).Width / 2.0F),
         progressBar1.Height / 2 - (gr.MeasureString(Text,
         TextFont).Height / 2.0F)));
      }
}
public enum ProgressBarTextLocation
{
         Left,
         Centered
}