Индикатор загрузки (progress bar) для WPF

Если ваше WPF приложение медленно загружается, то в зависимости от причины есть 2 выхода — или добавлять Splash Screen в случае, когда приложение «тяжелое» само по себе, или ограничится показом индикатора загрузки данных, если само приложение стартует быстро, но потом еще подгружает объемные данные (например 3D модели).

Такая задача возникла и передо мной. Хотелось сделать круговой индикатор загрузки, похожий на индикатор загрузки Silverlight приложений. Быстрый поиск в интернете подобрал 2 подходящих индикатора:

http://www.codeproject.com/KB/WPF/FrameBasedAnimation.aspx, http://www.codeproject.com/KB/smart/Sonic.aspx

Первый мне не понравился потому, что во-первых не компилировался без доработок, а во вторых имел огромное количество C# кода, без которого в WPF вполне можно было обойтись, решив всё на уровне XAML.

Второй индикатор был значительно красивее и работал, но крутил всю картинку целиком, не создавая эффект перелива цветов, а вызывая впечатление, что на нём решили сэкономить.

Небольшая доработка заключалась в том, что я заменил DoubleAnimation на DiscreteDoubleKeyFrame и теперь индикатор загрузки не вращается, а красиво переливается.

Вместо:

<BeginStoryboard> 
    <Storyboard> 
        <DoubleAnimation Storyboard.TargetName="SpinnerRotate" Storyboard.TargetProperty="(RotateTransform.Angle)" From="0" To="360" Duration="0:0:01" RepeatBehavior="Forever" /> 
    </Storyboard> 
</BeginStoryboard>

Сделаем так:

<BeginStoryboard> 
    <Storyboard> 
        <DoubleAnimationUsingKeyFrames Duration="0:0:12" RepeatBehavior="Forever" SpeedRatio="12" Storyboard.TargetName="SpinnerRotate" Storyboard.TargetProperty="(RotateTransform.Angle)"> 
            <DiscreteDoubleKeyFrame KeyTime="00:00:00" Value="0" /> 
            <DiscreteDoubleKeyFrame KeyTime="00:00:01" Value="30" /> 
... 
            <DiscreteDoubleKeyFrame KeyTime="00:00:11" Value="330" /> 
        </DoubleAnimationUsingKeyFrames> 
    </Storyboard> 
</BeginStoryboard>

Результат:

Загрузить компонент Circular Progress Bar и тестовый проект (14,4 Кб)

В следующий раз, я покажу на примере как использовать этот же код для progress bar в Silverlight.