不同颜色的WPF进度条

Question

我有报警状态。我想借助颜色在进度条上反映警报状态。 如果操作员已将警报处理至30％的状态，则进度条将显示30％的颜色，如果操作员已处理至60％。因此进度条会以红色显示前30％，然后以蓝色显示30％。

我将进度条的值设置为30并获取绿色。我的问题是，当我想将其设置为60％时，前30％显示绿色，下一次显示红色。

Answer 1

下面是你的例子。为ProgressBar设置MyProgressBarStyle。我使用LinearGradientBrush将进度条的背景设置为30％红色，30％绿色和30％蓝色。并且推翻了PART_Indicator。所以你需要使用SetMyProgressBarValue函数来设置ProgressBar的百分比值。尝试它为我工作。

XAML

 <Grid Background="Gray"> 
      <Grid.Resources> 
       <Style x:Key="MyProgressBarStyle" TargetType="{x:Type ProgressBar}"> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="{x:Type ProgressBar}"> 
           <Grid MinHeight="14" MinWidth="200"> 
            <Border Name="PART_Track" CornerRadius="2" BorderBrush="Transparent" BorderThickness="1" > 
             <Border.Background> 
              <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5"> 
               <LinearGradientBrush.GradientStops> 
                <GradientStop Color="red" Offset="0" ></GradientStop> 
                <GradientStop Color="red" Offset="0.3" ></GradientStop> 
                <GradientStop Color="Green" Offset=".3" ></GradientStop> 
                <GradientStop Color="Green" Offset=".3" ></GradientStop> 
                <GradientStop Color="Green" Offset=".6" ></GradientStop> 
                <GradientStop Color="Blue" Offset=".6" ></GradientStop> 
                <GradientStop Color="Blue" Offset="1" ></GradientStop> 
               </LinearGradientBrush.GradientStops> 
              </LinearGradientBrush> 
             </Border.Background> 
            </Border> 
            <Border 
            Name="PART_Indicator" 
            CornerRadius="2" 
            Background="Gray" 
            BorderBrush="Transparent" 
            BorderThickness="1" 
            HorizontalAlignment="Right" /> 
           </Grid> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </Style> 
      </Grid.Resources> 
      <ProgressBar x:Name="MyProgressBar" Style="{StaticResource MyProgressBarStyle}" Minimum="0" Maximum="100" Height="80" Value="20"></ProgressBar> 
     </Grid> 

功能可为MyProgressBar

public void SetMyProgressBarValue(Double percentageValue) 
{ 
    MyProgressBar.Value = 100 - percentageValue; 
}