システムトレイにインジゲータバーを表示する

ウェブ上からデータを取得中や何らかの時間のかかる処理中にインジゲータを表示して、ユーザーに可能な限りストレスを与えないように工夫されているかと思います。

インジゲータを表示する方法はいくつかありますが、一番シンプルかつユーザー操作を阻害しない方法はシステムトレイにインジゲータを表示する方法でしょう。

Windows Phone OS 7.1からシステムトレイにプログレスバーを表示する事が出来るようになりました。システムトレイ上にプログレスバーを表示する方法をご紹介したいと思います。

あらかじめXAML上にSystemTray.ProgressIndicatorを定義しておきます。ProgressIndicatorのIsIndeterminateプロパティをTrueにします。これでValueによってグイーンと伸びるプログレスバーではなく、インジゲータバーとして動作するようになります。

また、インジゲータバーが平常時に表示されていたらおかしいので、IsVisibleプロパティはFalseを設定しておきます。Textプロパティには「Loading…」や「Waiting…」などを表示すると良いでしょう。

    <shell:SystemTray.ProgressIndicator>
        <shell:ProgressIndicator x:Name="progress" IsIndeterminate="True" IsVisible="False" Text="Loading..." />
    </shell:SystemTray.ProgressIndicator>

プログラム側では、時間の掛かる処理の代替処理としてReactive Extensionsで2秒間のタイマーを実行します。ボタンが押下された時点でシステムトレイ上にインジゲータバーを表示し、2秒のタイマーが満了するとインジゲータバーを非表示にしています。

using System;
using System.Windows;
using Microsoft.Phone.Controls;
using Microsoft.Phone.Reactive;
 
namespace ProgressIndicatorTest {
    public partial class MainPage : PhoneApplicationPage {
        // コンストラクター
        public MainPage() {
            InitializeComponent();
        }
 
        private void button1_Click(object sender, RoutedEventArgs e) {
 
            // プログレスバーを表示する
            progress.IsVisible = true;
 
            // 何らかの時間の掛かる処理が2秒間実行されるとする(仮定)
            Observable.Timer(TimeSpan.FromSeconds(2))
                .ObserveOnDispatcher()
                .Subscribe(_ => {
 
                    // 処理が完了した!プログレスバーを非表示にする
                    progress.IsVisible = false;
                });
        }
    }
}

XAMLだけでシステムトレイ上にインジゲータバーを表示する

    <shell:SystemTray.ProgressIndicator>
        <shell:ProgressIndicator
            Text="Loading..."
            IsIndeterminate="True"
            IsVisible="True">
        </shell:ProgressIndicator>
    </shell:SystemTray.ProgressIndicator>

コードだけでシステムトレイ上にインジゲータバーを表示する

    var prog = new ProgressIndicator();
    prog.IsVisible = true;
    prog.IsIndeterminate = true;
    prog.Text = "Loading...";
 
    SystemTray.SetProgressIndicator(this, prog);

参照