プログレスバーが表示されない

Question

前提・実現したいこと

作業進捗をプログレスバーで表示したいです。

発生している問題・エラーメッセージ

進捗が知りたいのにfor文が終了してから最終のプロブレスバーが表示されます。
for文が終わるまで何も表示されないままです。

該当のソースコード

 <ProgressBar x:Name="progressBar" HorizontalAlignment="Left" Height="31" Margin="39,93,0,0" VerticalAlignment="Top" Width="454" IsIndeterminate="True" Visibility="Hidden"/>

praivate void Start_Clic(object sender, RoutedEventArgs e)
{
 progressBar.Visibility=Visibility.Visible;
 progressBar.Value = 0;
 progressBar.Maximum = 100;

 for(int i=0; i<100; i++)
 {
 　　　　＜＜処理＞＞
  progressBar.Value = i;
 }
}

試したこと

表示時間が短い為、表示できないのかと思い、Task.Delay(1000)で停止させてみましたが、変わりませんでした。
わかる方ご教授お願いいたします。

補足情報（FW/ツールのバージョンなど）

VisualStudio 2015
.NetFramework 4

Answer 1

作業進捗をプログレスバーで表示したいです。

質問当時はなかったものですが、今のまともな実装がteratail上にないので回答しておきます^^
IProgress<T> インターフェイス (System) | Microsoft Learn
Progress<T> クラス (System) | Microsoft Learn

<Window
  x:Class="Q213497.MainWindow"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  Width="800"
  Height="450">
  <DockPanel>
    <InkCanvas DockPanel.Dock="Bottom" />
    <UniformGrid Rows="1">
      <GroupBox Header="original">
        <StackPanel>
          <Grid>
            <TextBlock Text="ボタンを押して重い処理を開始" />
            <ProgressBar x:Name="progressBar1" Visibility="Hidden" />
          </Grid>
          <Button x:Name="button1" Click="Button1_Click" Content="開始" />
        </StackPanel>
      </GroupBox>

      <GroupBox Header="IProgress">
        <StackPanel>
          <Grid>
            <TextBlock Text="ボタンを押して重い処理を開始" />
            <ProgressBar x:Name="progressBar2" Visibility="Hidden" />
          </Grid>
          <Button x:Name="button2" Click="Button2_Click" Content="開始" />
        </StackPanel>
      </GroupBox>

      <GroupBox Header="Cancel">
        <StackPanel>
          <Grid>
            <TextBlock Text="ボタンを押して重い処理を開始" />
            <ProgressBar x:Name="progressBar3" Visibility="Hidden" />
          </Grid>
          <Grid>
            <Button x:Name="button3" Click="Button3_Click" Content="開始" />
            <Button
              x:Name="cancelButton"
              Click="CancelButton_Click"
              Content="キャンセル"
              Visibility="Hidden" />
          </Grid>
        </StackPanel>
      </GroupBox>
    </UniformGrid>
  </DockPanel>
</Window>

using System.Windows;

namespace Q213497;

public partial class MainWindow : Window
{
    public MainWindow() => InitializeComponent();

    private async void Button1_Click(object sender, RoutedEventArgs e)
    {
        // フリーズ中も連打が通ってしまわないように
        button1.IsEnabled = false;
        progressBar1.Value = 0;
        progressBar1.Visibility = Visibility.Visible;

        HeavyWork1();

        progressBar1.Visibility = Visibility.Hidden;
        button1.IsEnabled = true;
    }
    private void HeavyWork1()
    {
        for (var i = 0; i < 100; i++)
        {
            // なんらか重い処理
            Thread.Sleep(50);

            progressBar1.Value = i;
        }
    }

    private async void Button2_Click(object sender, RoutedEventArgs e)
    {
        button2.IsEnabled = false;
        progressBar2.Value = 0;
        progressBar2.Visibility = Visibility.Visible;

        // 更新処理をActionで渡す
        var progress = new Progress<int>(i => progressBar2.Value = i);

        // 別スレッドで重い処理を実行
        await Task.Run(() => HeavyWork2(progress));

        progressBar2.Visibility = Visibility.Hidden;
        button2.IsEnabled = true;
    }
    private void HeavyWork2(IProgress<int> iProgress)
    {
        for (var i = 0; i < 100; i++)
        {
            // なんらか重い処理
            Thread.Sleep(50);

            // Reportを呼ぶと指定したActionをUIスレッドで実行してくれる
            iProgress.Report(i);
        }
    }


    private CancellationTokenSource? cts;
    private async void Button3_Click(object sender, RoutedEventArgs e)
    {
        button3.IsEnabled = false;
        cancelButton.Visibility = Visibility.Visible;
        progressBar3.Value = 0;
        progressBar3.Visibility = Visibility.Visible;

        var progress = new Progress<int>(i => progressBar3.Value = i);

        // ctsは再利用不可
        cts = new CancellationTokenSource();
        try
        {
            // ctを渡す
            await Task.Run(() => HeavyWork3(progress, cts.Token));
        }
        // キャンセル時
        catch (OperationCanceledException) { }
        // 成功・キャンセルによらず状態復帰
        finally
        {
            cancelButton.Visibility = Visibility.Hidden;
            progressBar3.Visibility = Visibility.Hidden;
            button3.IsEnabled = true;
        }
    }
    private void HeavyWork3(IProgress<int> iProgress, CancellationToken ct)
    {
        for (var i = 0; i < 100; i++)
        {
            // キャンセルを要求されていたら例外を出して抜ける
            ct.ThrowIfCancellationRequested();

            // なんらか重い処理
            Thread.Sleep(50);

            iProgress.Report(i);
        }
    }
    // キャンセルを要求する
    private async void CancelButton_Click(object sender, RoutedEventArgs e) => cts?.Cancel();
}

Answer 2

Reactive Extensions(時間を扱える LINQ)を使うと楽です。
NuGet パッケージマネージャーで System.Reactive を追加して以下のコードを走らせてみてください。

using System;
using System.Linq;
using System.Reactive.Linq;
using System.Windows;

namespace WpfApp1
{
	public partial class MainWindow : Window
	{
		public MainWindow()
		{
			InitializeComponent();
		}

		private void Button_Click(object sender, RoutedEventArgs e)
		{
			Observable
				.Range(0, 100) // 0 から 99 までの数字を流す
				.Zip(Observable.Interval(TimeSpan.FromMilliseconds(50)), (a, b) => a) // 50ms のインターバルを置く(本番では不要なのでこの行を削除)
				.ObserveOnDispatcher() // UI を使う際に必要
				.Subscribe(i => 
				{
					// 作業
					progressBar.Value = i;
				});
		}
	}
}

Comments

[mia1620]

ありがとうございます。
System.Reactive をインストールしようとしてみたのですが、「互換性のあるアセンブリ参照またはコンテンツファイルがパッケージに含まれていません」と出てしまいインストールできませんでした。
教えていただいたのにすみません。

[Zuishin]

見落としていました。.NET Framework 4 でしたか。ソースをダウンロードしてコンパイルすれば使えると思いますが、そこまでするなら別の手段の方が簡単ですね。

Answer 3

Windows において暗黙的な再描画のイベントは一番処理が後回しにされることになっていまして、ぶっちゃけ「他にやることがないとき」でないと再描画しません。
ProgressBar の再描画も同様なので、一度メッセージキューが回らないと描画してくれません。

強制的に再描画させる ProgressBar.Refresh() を呼び出すことでうまく表示してくれるはずです。

※むろん、別スレッド化しても描画はしてくれます

Comments

[mia1620]

ありがとうございます。
progressBar.Value = i;の後にProgrssBar.Refresh（）;を入れてみたのですが、「’ProgressBar’に’Refresh’の定義が含まれておらず拡張メソッドRefreshが見つかりませんでした。」とでてしまいました。必要なusingディレクティブを調べてみたのですがわからず。。。
ご教授いただけないでしょうか？

[takabosoft]

Refresh()はWPFではなくてWindows Formsじゃないでしょうかね。

[mia1620]

なるほど、Windows FormsでWPFでは使えないのですね。。。
わかりました。WPFでできる強制的に再描画をするものを探してみます。
ありがとうございました。

Answer 4

UIスレッドで重い処理をしているとUIは当然更新が掛かりません。
なので、解決方法としては、重い処理を別スレッドで行い、プログレスバーのようなUI更新はDispatcher.BeginInvokeを使って更新するのが良いかと思います。

---

追記：
マルチスレッドを早々に諦めるのでしたら、一応こういうものがあります。

WPFでコントロールを再描画（表示を即更新する）方法
https://eng-notebook.com/blog-entry-193/

---

更に追記：

こっちの方がいいかも。。
http://geekswithblogs.net/NewThingsILearned/archive/2008/08/25/refresh--update-wpf-controls.aspx

Comments

[mia1620]

ありがとうございます。
すみません、詳しくないため教えてください。
重い処理を別スレッドで行う、ということは処理の部分を別のprivate voidの形として今のスレッドから出して引用（？）してくるとすればよいのでしょうか？

[takabosoft]

マルチスレッドはしくじりやすいので、基礎的なところから勉強した方がよいです（ここで１から10まで説明するには少し無理があります）。最近のC#でしたらたぶんTask.Run(()=> { }); で別スレッドで処理を動かせると思うので、その辺のキーワードと、別スレッドからUIを操作するためのBeginInvokeキーワードをもとに検索＆勉強してみてください。

[mia1620]

なるほど。わかりました。
検索キーワード教えてくださり、ありがとうございます。キーワードをもとに勉強してみます。
ありがとうございました。

[takabosoft]

マルチスレッドを諦めるのでしたら、別の方法の回答も追記しておきました（未検証）。ただ、おおそらく、UI描画以外にもイベント等が発動する恐れがありますので、そういう意味ではあまりオススメはしません。

[mia1620]

追記ありがとうございます。
マルチスレッドを調べつつ別の方法を試してみてます。
やはり、マルチスレッドが一番良いのでしょうね。プログラム初心者であまり理解できておらず、方法を教えていただけてありがたいです。

[mia1620]

さらに追記の記事をみて実装したところうまく動くようになりました！！
何度も教えていただきありがとうございました。