[WPF]プログレスバーの色を変更する

プログレスバーの進捗状態を示す色を変更するのに四苦八苦しましたので、
こうすれば出来る!ってのをメモっておきます。
つーか、初めからForegrooundで指定した色がそのまま出てくれればいいのになぁ。

最初にxamlの中にリソース定義を記述します。
この例ではPage.Resourcesですが、Windowの時はWindow.Resourcesです。


<Page.Resources>
   <Style x:Key="ProgressBarStyle" TargetType="ProgressBar">
   <Setter Property="Template">
   <Setter.Value>
   <ControlTemplate TargetType="ProgressBar">
             <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1" CornerRadius="2" Padding="1">
           <Grid x:Name="PART_Track" >
               <Rectangle x:Name="PART_Indicator"  HorizontalAlignment="Left" RadiusX="2" RadiusY="2" Fill="{TemplateBinding Foreground}">
               </Rectangle>
           </Grid>
             </Border>
   </ControlTemplate>
   </Setter.Value>
   </Setter>
   </Style>
</Page.Resources>

これを記述したらプログレスバーを定義するわけです。
上のテンプレートはプログレスバーに定義した Background、Foreground、BorderBrush の設定を使って
描画しますのでそれぞれ定義します。
この例では背景を黒、進捗を示す部位は赤のグラデーションで定義しています。

<ProgressBar Height="10" HorizontalAlignment="Stretch" Name="progressBar1" Background="#FF141012"
     Style="{StaticResource ProgressBarStyle}">
     <ProgressBar.Foreground>
          <LinearGradientBrush EndPoint="1,0.5" StartPoint="0,0.5">
               <GradientStop Color="Black" Offset="0" />
               <GradientStop Color="#FFEF4343" Offset="1" />
          </LinearGradientBrush>
     </ProgressBar.Foreground>
</ProgressBar>

こんな感じでOKです。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です