[WPF] プログレスバー上に進捗率を表示する

ProgressBar コントロールには進捗率を表示させるためのプロパティがありません。

そこでGridを1つ準備して、 ProgressBarコントロールとTextBlockコントロールを重ねて置くことで、あたかもProgressBarコントロールにテキスト表示エリアがあるかのように見せることができます。

このとき TextBlockコントロールをViewBoxに配置すると、Gridのサイズに合わせてフォントのサイズが自動で変わるようになります。

下記はProgressBarにテキスト表示エリアを作成し、進捗率を表示する例です。

VB.NETまたはC#のコードは、「進捗状況値の取得/設定をする」を参考にし、Worker_ProgressChangedメソッドのみ下記に示すように変更してください。

XAMLの例

<!-- テキスト表示エリアを持ったProgressBar -->
<Grid Margin="12,12,0,0" HorizontalAlignment="Left" Width="249" Height="34" 
    VerticalAlignment="Top"> 
    <ProgressBar Name="ProgressBar1" 
         Minimum="0" Maximum="100" Value="0" />
    <Viewbox>
        <TextBlock Name="TextBlock1" Text="0%" TextAlignment="Center"/>
    </Viewbox>
</Grid>

<Button Content="START" Height="23" HorizontalAlignment="Left" 
        Margin="12,56,0,0" Name="btnStart" VerticalAlignment="Top" Width="75" />
<Button Content="STOP" Height="23" HorizontalAlignment="Right" 
        Margin="0,56,106,0" Name="btnStop" VerticalAlignment="Top" Width="75" />

VBの例

' 現在値の更新
Private Sub Worker_ProgressChanged(ByVal sender As Object, 
    ByVal e As System.ComponentModel.ProgressChangedEventArgs) Handles Worker.ProgressChanged
    'プログレスバーの現在値を更新する
    ProgressBar1.Value = e.ProgressPercentage
    '進捗率を表示する
    TextBlock1.Text = ProgressBar1.Value.ToString() & "%"
End Sub

C#の例

// 現在値の更新
void Worker_ProgressChanged(object sender, System.ComponentModel.ProgressChangedEventArgs e)
{
    // プログレスバーの現在値を更新する
    progressBar1.Value = e.ProgressPercentage;
    // 進捗率を表示する
    textBlock1.Text = progressBar1.Value.ToString() + "%";
}