WPF进度条有不同的颜色

Question

我有警报状态。我想借助颜色在进度条上反映警报状态。 如果操作员已将警报处理至30％状态，则进度条将显示30％的颜色，如果操作员已处理至60％。所以Progress Bar将显示前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;
 }