Visual C# を使用してスムーズな進行状況バーを作成する

2024-12-14

この記事では、カスタム UserControl を作成してスムーズなスクロール ProgressBar コントロールを作成する方法について説明します。

元の製品バージョン: Visual C#
元の KB 番号: 323116

まとめ

この記事では、単純なカスタム UserControl を作成して、スムーズなスクロール ProgressBar コントロールを作成する方法について説明します。

以前のバージョンの ProgressBar コントロール (Microsoft Windows Common Controls ActiveX コントロールで提供されているバージョンなど) では、2 つの異なるビューで進行状況を表示できます。これらのビューを制御するには、標準設定とスムーズ設定を含む Scrolling プロパティを使用します。スムーズスクロールでは、進行状況を表す単色のブロックが生成され、標準的なスクロールはセグメント化されて表示され、一連の小さなブロックまたは四角形で構成されます。

Microsoft Visual C# に含まれている ProgressBar コントロールでは、標準設定のみがサポートされます。

この記事のサンプルコードでは、次のプロパティをサポートするコントロールを作成する方法を示します。

Minimum: このプロパティは、進行状況の有効な値の範囲の小さい値を取得または設定します。このプロパティの既定値は 0 です。このプロパティを負の値に設定することはできません。
Maximum: このプロパティは、進行状況の有効な値の範囲の最大値を取得または設定します。このプロパティの既定値は 100 です。
Value: このプロパティは、現在の進行状況レベルを取得または設定します。値は、Minimum プロパティと Maximum プロパティが定義する範囲内である必要があります。
ProgressBarColor: このプロパティは、進行状況バーの色を取得または設定します。

カスタム ProgressBar コントロールを作成する

Visual C# で新しい Windows コントロールライブラリプロジェクトを作成するには、次の手順に従います。
1. Microsoft Visual Studio を起動します。
2. [ファイル] メニューの [新規作成] をポイントし、 [プロジェクト] をクリックします。
3. [新しいプロジェクト] ダイアログボックスの [プロジェクトの種類] の下にある [Visual C#] をクリックし、[テンプレート] の下の [コントロールライブラリWindows フォーム] をクリックします。
4. [ 名ボックスに「 SmoothProgressBar」と入力し、[ OK] をクリック。
5. Project Explorer で、既定のクラスモジュールの名前を UserControl1.cs から SmoothProgressBar.cs に変更します。
6. UserControl オブジェクトの Properties ウィンドウで、 Name プロパティを UserControl1 から SmoothProgressBar に変更します。

この時点では、通常、そのコントロールのクラスを継承し、既存のコントロールを拡張するための追加機能を追加します。ただし、ProgressBar クラスは 封印されており 継承できません。そのため、最初からコントロールをビルドする必要があります。

UserControl から派生したクラスで、 SmoothProgressBar.cs ファイルに次のコードを追加します。

int min = 0;// Minimum value for progress range
int max = 100;// Maximum value for progress range
int val = 0;// Current progress
Color BarColor = Color.Blue;// Color of progress meter

protected override void OnResize(EventArgs e)
{
    // Invalidate the control to get a repaint.
    this.Invalidate();
}

protected override void OnPaint(PaintEventArgs e)
{
    Graphics g = e.Graphics;
    SolidBrush brush = new SolidBrush(BarColor);
    float percent = (float)(val - min) / (float)(max - min);
    Rectangle rect = this.ClientRectangle;

    // Calculate area for drawing the progress.
    rect.Width = (int)((float)rect.Width * percent);

    // Draw the progress meter.
    g.FillRectangle(brush, rect);

    // Draw a three-dimensional border around the control.
    Draw3DBorder(g);

    // Clean up.
    brush.Dispose();
    g.Dispose();
}

public int Minimum
{
    get
    {
        return min;
    }

    set
    {
        // Prevent a negative value.
        if (value < 0)
        {
            value = 0;
        }

        // Make sure that the minimum value is never set higher than the maximum value.
        if (value > max)
        {
            max = value;
        }

        min = value;

        // Ensure value is still in range
        if (val < min)
        {
            val = min;
        }

        // Invalidate the control to get a repaint.
        this.Invalidate();
    }
}

public int Maximum
{
    get
    {
        return max;
    }

    set
    {
        // Make sure that the maximum value is never set lower than the minimum value.
        if (value < min)
        {
            min = value;
        }

        max = value;

        // Make sure that value is still in range.
        if (val > max)
        {
            val = max;
        }

        // Invalidate the control to get a repaint.
        this.Invalidate();
    }
}

public int Value
{
    get
    {
        return val;
    }

    set
    {
        int oldValue = val;

        // Make sure that the value does not stray outside the valid range.
        if (value < min)
        {
            val = min;
        }
        else if (value > max)
        {
            val = max;
        }
        else
        {
            val = value;
        }

        // Invalidate only the changed area.
        float percent;

        Rectangle newValueRect = this.ClientRectangle;
        Rectangle oldValueRect = this.ClientRectangle;

        // Use a new value to calculate the rectangle for progress.
        percent = (float)(val - min) / (float)(max - min);
        newValueRect.Width = (int)((float)newValueRect.Width * percent);

        // Use an old value to calculate the rectangle for progress.
        percent = (float)(oldValue - min) / (float)(max - min);
        oldValueRect.Width = (int)((float)oldValueRect.Width * percent);

        Rectangle updateRect = new Rectangle();

        // Find only the part of the screen that must be updated.
        if (newValueRect.Width > oldValueRect.Width)
        {
            updateRect.X = oldValueRect.Size.Width;
            updateRect.Width = newValueRect.Width - oldValueRect.Width;
        }
        else
        {
            updateRect.X = newValueRect.Size.Width;
            updateRect.Width = oldValueRect.Width - newValueRect.Width;
        }

        updateRect.Height = this.Height;

        // Invalidate the intersection region only.
        this.Invalidate(updateRect);
    }
}

public Color ProgressBarColor
{
    get
    {
        return BarColor;
    }

    set
    {
        BarColor = value;

        // Invalidate the control to get a repaint.
        this.Invalidate();
    }
}

private void Draw3DBorder(Graphics g)
{
    int PenWidth = (int)Pens.White.Width;

    g.DrawLine(Pens.DarkGray,
    new Point(this.ClientRectangle.Left, this.ClientRectangle.Top),
    new Point(this.ClientRectangle.Width - PenWidth, this.ClientRectangle.Top));
    g.DrawLine(Pens.DarkGray,
    new Point(this.ClientRectangle.Left, this.ClientRectangle.Top),
    new Point(this.ClientRectangle.Left, this.ClientRectangle.Height - PenWidth));
    g.DrawLine(Pens.White,
    new Point(this.ClientRectangle.Left, this.ClientRectangle.Height - PenWidth),
    new Point(this.ClientRectangle.Width - PenWidth, this.ClientRectangle.Height - PenWidth));
    g.DrawLine(Pens.White,
    new Point(this.ClientRectangle.Width - PenWidth, this.ClientRectangle.Top),
    new Point(this.ClientRectangle.Width - PenWidth, this.ClientRectangle.Height - PenWidth));
}

[ Build メニューの Build Solution をクリックしてプロジェクトをコンパイルします。

サンプルクライアントアプリケーションを作成する

[ファイル] メニューの [新規作成] をポイントし、 [プロジェクト] をクリックします。
[新しいプロジェクトの追加] ダイアログボックスの [プロジェクトの種類] の下にある [Visual C#] をクリックしTemplatesの [アプリケーションのWindows フォーム] をクリックし、[OK] をクリックします。
SmoothProgressBar コントロールの 2 つのインスタンスをフォームに追加するには、次の手順に従います。
1. [ツール] メニューで [ツールボックスアイテムの選択] をクリックします。
2. .NET Framework コンポーネント タブをクリックします。
3. [Browse をクリックし、Create a custom ProgressBar コントロールセクションで作成したSmoothProgressBar.dll ファイルを見つけます。
4. [OK] をクリックします。
  
  Note
  
  SmoothProgressBar コントロールがツールボックスに追加されます。
5. SmoothProgressBar コントロールの 2 つのインスタンスをツールボックスから Windows アプリケーションプロジェクトの既定の形式にドラッグします。
ツールボックスからフォームに Timer コントロールをドラッグします。

Timer コントロールの Tick イベントに次のコードを追加します。

if (this.smoothProgressBar1.Value > 0)
{
    this.smoothProgressBar1.Value--;
    this.smoothProgressBar2.Value++;
}
else
{
    this.timer1.Enabled = false;
}

ツールボックスからフォームに Button コントロールをドラッグします。

Button コントロールの Click イベントに次のコードを追加します。

this.smoothProgressBar1.Value = 100;
this.smoothProgressBar2.Value = 0;

this.timer1.Interval = 1;
this.timer1.Enabled = true;

Debug メニューの Start をクリックしてサンプルプロジェクトを実行します。
ボタンをクリックします。

Note

2 つの進行状況インジケーターには、テキスト progressが表示されます。 1 つの進行状況インジケーターでは進行状況が増加し、もう 1 つの進行状況インジケーターには進行状況が減少またはカウントダウン方式で表示されます。

次の方法で共有

Visual C# を使用してスムーズな進行状況バーを作成する

まとめ

カスタム ProgressBar コントロールを作成する

サンプル クライアント アプリケーションを作成する

フィードバック

その他のリソース

サンプルクライアントアプリケーションを作成する