65.9K
CodeProject 正在变化。 阅读更多。
Home

向标准进度条控件添加百分比（或任何文本）

jacobjordan
starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.78/5 (19投票s)

2008年12月1日

CPOL

3分钟阅读

viewsIcon

154973

非常快速和简单

引言

这篇非常简短的文章讨论了如何将文本（如标题中提到的百分比，但您可以添加任何您喜欢的内容）添加到进度条的中间。 您可以以非常简单的方式自己完成此操作，而无需为一些价格过高的 .NET 控件付费。 大约一年前，当我根本不是一个非常好的程序员时，我尝试完成这件事，但失败了。 我当时的尝试是在进度条的中心放置一个标签，并将其背景颜色设置为透明。 但是，这不起作用，因为当控件的背景颜色为透明时，它会显示其容器中后面的内容。 由于标签包含在表单本身中，而不是在进度条中，因此您会透过标签和进度条直接看到表单的背景颜色或背景图像。 因此，进度条中的标签已失效，接下来是什么？ 我想出的解决方案是使用进度条的图形在中心绘制一个string。

这是一张我制作的进度条的图片，显示了中间的百分比。

那是我应用程序的实际裁剪屏幕截图。它使用 8.25 Arial 字体。

Using the Code

我最初用于执行此操作的代码只需要 2 行代码。 但是，它存在一些错误，这就是我现在使用的代码

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

让我们分析一下。 percent 变量是进度条值的计算百分比。 现在，下一行有点复杂。 首先，它使用System.Drawing.Graphics类的DrawString()方法在进度条中绘制文本。 让我们分析一下每个参数

  1. percent.ToString() + "%"

    这确实是不言自明的。 它说明将显示什么文本。

  2. SystemFonts.DefaultFont   

    那是显示的字体。 在我的示例屏幕截图中，我使用了 Arial。 但是，对于应用程序来说，这可能是一个更好的选择，因为它正在获取默认系统字体。

  3. Brushes.Black

    那是文本的颜色，可以很容易地更改。 它可以是SolidBrush，它是纯色的画笔。 或者，如果您想变得花哨，它可以是另一种类型的画笔（例如，TextureBrush，它具有由图像定义的纹理来分配它）。

  4. 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))   

    那是文本将相对于进度条的左上角绘制的位置。 它定义了文本将被绘制位置的左上角。 这是最重要的部分，需要最多的解释。 让我们看一下我如何得出这些方程式来使文本居中

    X 轴位置 

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

    progressBar1.Width / 2部分将返回进度条的水平中心点（以像素为单位）。 现在，使用MeasureString的部分计算要绘制的string（percent.ToString()   + "%"）的宽度（以像素为单位）。 然后将其值减半并从progressBar1.Width / 2中减去，以便最终的 X 轴位置会将文本的中心点精确定位在进度条的中心点。

    Y 轴位置

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

    与 X 点一样，progressBar1.Height / 2计算进度条的垂直中心点。 同样像 X 点一样，MeasureString方法用于计算文本的高度。 然后将其减半，并从“progressBar1.Height / 2”中减去，以完美地垂直居中文本。

结论

要实际使用此代码，必须在更改进度条的值后立即将其放置。 如果由于某种原因，进度条值的更改没有刷新它并清除先前绘制的文本，只需在使用此代码之前调用进度条的Refresh方法。 当然，我的进度条被称为progressBar1，但这可以很容易地更改。 所需要的只是复制/粘贴。 尽情享受！

© . All rights reserved.