Click here to Skip to main content
Click here to Skip to main content

Custom Control for Text Over a Progress Bar

, 14 Jan 2009
Rate this:
Please Sign up or sign in to vote.
A simple custom control allowing text to be written over the top of a progress bar; based on code from Jacob Jordan
CustomControls_src

Example2.png

Introduction

This is a very simple custom control implementation of a progress bar that allows text to be written over it.

Background

Over the years, Microsoft has made a few Progress Bar controls, but all of them have been lacking in some useful feature or another. One of these features is the ability to write text centered over the control. In December 2008, Jacob Jordan posed some code to do this:

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

This was a great solution, but it had to be done manually to each progress bar. I thought it might be easier to just drag and drop a premade custom control from the Form Designer, so I built one that wrapped a progress bar and handled the drawing of text and/or automatically drawing a percentage.

Using the Code

To use this control, just drag and drop CustomControls.dll into your VS toolbox, and then drop the control into your form just like you would a normal progress bar.

I haven't exposed all of the properties of the progress bar. The ones that I did are:

  • int Minimum
  • int Maximum
  • int Value
  • int Step
  • ProgressBarStyle Style
  • Color BarColor (which maps to ProgressBar.ForeColor)

If you need to access something else, just change the access modifier of the ProgressBar control member and recompile.

Two new properties have been added to handle the text:

  • bool ShowPercentage
  • string CenterText

If ShowPercentage is true, then the percent complete is automatically calculated and displayed, otherwise the value of CenterText is displayed. Some slight modification to the original code was needed to accomplish this:

private void UpdateText()
{
    string s;
    if (ShowPercentage)
    {
        int percent = (int)(((double)(Value - Minimum) / 
			(double)(Maximum - Minimum)) * 100);
        s = percent.ToString() + "%";
    }
    else
    {
        if (string.IsNullOrEmpty(CenterText))
        {
            //Don't draw anything
            return;
        }
        else
        {
            s = CenterText;
        }
    }

    using (Graphics gr = thePB.CreateGraphics())
    {
        gr.DrawString(s, Font, new SolidBrush(ForeColor),
            new PointF(Width / 2 - (gr.MeasureString(s, Font).Width / 2.0F),
            Height / 2 - (gr.MeasureString(s, Font).Height / 2.0F)));
    }
}

This is a very simple implementation and has a lot of room for improvement, but for most uses it is a drop-in solution.

History

  • 14th January, 2009: Initial post

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

P3 Tech
Software Developer
United States United States
No Biography provided

Comments and Discussions

 
GeneralMy vote of 1 PinmemberEr. Hardeep12-Dec-12 20:52 
GeneralPersistent Text while in Marquee style Pinmembersnowbird77096-Mar-12 5:26 
QuestionNon-VS version? PinmemberDLundin13-Dec-11 22:17 
GeneralFlickering PinmemberFred NoName12-Jun-10 3:20 
GeneralGreat Work! PinmemberGPUToaster10-Jun-10 2:05 
GeneralHANDY CONTROL PinmemberAlaa Jebran3-May-10 22:46 
GeneralRepainting... [modified] PinmemberMebur27-Mar-09 5:21 
GeneralRe: Repainting... Pinmemberfuyaqi12-Apr-10 16:15 
GeneralRe: Repainting... PinmemberP3 Tech13-Apr-10 6:47 
GeneralRe: Repainting... PinmemberAndré Figueiredo (PT)23-Aug-10 5:53 
GeneralUserControl Pinmembergajatko19-Jan-09 0:08 
GeneralI love this progress bar! PinmemberEpicCodesWife15-Jan-09 4:22 
GeneralProgress Bar Pinmemberwogal14-Jan-09 13:08 
GeneralCool PinmemberDr.Luiji14-Jan-09 12:05 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web02 | 2.8.140721.1 | Last Updated 14 Jan 2009
Article Copyright 2009 by P3 Tech
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid