2011-01-19 22 views
19

WPF İlerleme Çubuğunun ön plan rengini nasıl değiştireceğini bilen var mı? Her zaman yeşil ile birleşmiş gibi görünüyor. o çalışmıyorsa size Stil veya Progressbar ait ControlTemplate değiştirmek zorunda gerektiği gibiİlerleme çubuğu ön plan rengi

cevap

14

Ne yazık ki, sert varsayılan stilde kodlanmıştır:

<Trigger Property="IsIndeterminate" 
    Value="false"> 
<Setter TargetName="Animation" 
    Property="Background" 
    Value="#80B5FFA9"/> 

orijinal XAML, kendi stilini oluşturmak veya örneğin Yüklü olay arka planı geçersiz kılmak için deneyebilirsiniz:

private void ProgressBar_Loaded(object sender, RoutedEventArgs e) 
{ 
    var p = (ProgressBar)sender; 
    p.ApplyTemplate(); 

    ((Panel)p.Template.FindName("Animation", p)).Background = Brushes.Red; 
} 

fakat güvenilir değil

+1

Snippet'iniz çalışıyor. Neden güvenilir değil? Cevabınız için teşekkürler. – Morvader

+0

Evet, ilerleme çubuğu şablonunu İfade Karışımı ile düzenlemek için en iyi seçenek, ancak kod parçacığınız için kod parçacığınızı test etme ve hızlı geliştirme için kullanması çok yararlıdır. (IMHO) – Morvader

+2

Bu çözüm Aero temasıyla çalışır. Animasyon adlı öğenin orada bulunduğundan emin olmak için diğer temaları kontrol etmelisiniz. Ve tabii ki bu sorun özel şablonlarla görünebilir. Başka bir sorun tema değiştirme. Kullanıcı OS temasını değiştirdiğinde WPF denetimlerini yeniden yükleyip yüklemediğini bilmiyorum. Aksi takdirde, bu anı işlemek ve Animasyon'un arka planını tekrar değiştirmeniz gerekir. Kendi şablonunuzu vermek istemiyorsanız, ProgressBar'dan türetilmenin güzel olacağını düşünüyorum. Şablon değiştiğinde her zaman şablon hatasını çözmek için OnApplyTemplate'i geçersiz kılmanız gerekir. –

13

sadece bu

<ProgressBar Height="25" IsIndeterminate="True" Width="150" Foreground="Red" ></ProgressBar> 

ile deneyin.

Bunu yapmak için, Microsoft'tan Expression Blend'i kullanabilirsiniz veya varolan bir şablonu kopyalarsınız ve değiştirebilirsiniz.

+0

Haklısınız, ilerleme çubuğu şablonunu İfade ile en iyi şekilde karıştırın. Aswering için dayanır. – Morvader

1

Benzer bir sorunla karşılaştım. tr Windows görsel ayarları en iyi performans için optimize edildi (Denetim Masası -> Sistem -> Gelişmiş Sistem Ayarları -> Gelişmiş -> Performans -> Ayarlar -> Görsel Efektler -> En iyi performans için ayarla). İlerleme çubuğu normal ayarlarda gayet iyi görünüyor, ancak "en iyi performans" altında korkunç görünüyordu. Sadece ForeGround'u "LightGreen" olarak değiştirdim. İşte

enter image description here

Burada en iyi performans İşte

enter image description here

düzeltildi¤inde gördük değişiklik

//before 
<ProgressBar Name="Progress" Grid.Column="0" Value="{Binding ProgressValue}" HorizontalAlignment="Stretch"/> 

//after 
<ProgressBar Foreground="LightGreen" Name="Progress" Grid.Column="0" Value="{Binding ProgressValue}" HorizontalAlignment="Stretch"/> 
budur ben normal koşullar altında varsayılan ForeColor gördüm ne

İşte En iyi performans

düzeltildi¤inde sonra gördüm ne

enter image description here

Biraz daha detay: İstenmeyen yeşil renk tonu kontrolü dahilinde "Canlandırma" adlı nesnenin geldiğini http://justmycode.blogspot.com.au/2012/08/the-case-of-strangely-coloured.html

1

Marat Khasanov işaret şablonu. Yani başka bir kolay yaklaşım bu nesneyi gizlemektir. Bu, bir varlık olarak kabul ettiğim animasyonlu "parıltı" etkisini de devre dışı bırakacak, ancak bir anlaşma katili olarak görebileceksin. Bunu, aşağıda gösterildiği gibi Yüklenen etkinlik için bir işleyici aracılığıyla gerçekleştirdim.

Bu ilham kaynağı an answer to another question. Aynı uyarı geçerlidir: kontrol şablonunu değiştirirse, bu artık çalışmayabilir.

public void ProgressBar_Loaded(object sender, RoutedEventArgs e) 
    { 
     var progressBar = sender as ProgressBar; 
     if (progressBar == null) return; 

     var animation = progressBar.Template.FindName("Animation", progressBar) as FrameworkElement; 
     if (animation != null) 
      animation.Visibility = Visibility.Collapsed; 

    } 
0

Tüm stili geçersiz kılmak için oldukça yararlı buldum. Aşağıdaki olarak ortaya çıkıyor

var yourcontrol = new ProgressBar(); 
// the control needs to load before it has a template. 
yourcontrol.Loaded += (sender,e) => { 
    var str = new System.Text.StringBuilder(); 
    using (var writer = new System.IO.StringWriter(str)) 
     System.Windows.Markup.XamlWriter.Save(yourcontrol .Template, writer); 
    System.Diagnostics.Debug.Write(str); 
}; 
// add it to your main grid, or some control thats loaded on screen. 
gridMain.Children.Add(yourcontrol); 

ile (bazı biçimlendirme ile) ilerleme tarzı herhangi kontrolün kontrol şablon stilleri indirebiliriz:

<ControlTemplate x:Key="templateprogress" 
        TargetType="ProgressBar"> 
     <Grid Name="TemplateRoot" 
       SnapsToDevicePixels="True"> 
      <Grid.Resources> 

       <LinearGradientBrush StartPoint="0,0" 
            EndPoint="0,1" 
            x:Key="brushMagic1"> 
        <GradientStop Color="#50FFFFFF" 
            Offset="0.5385" /> 
        <GradientStop Color="#00FFFFFF" 
            Offset="0.5385" /> 
       </LinearGradientBrush> 
       <LinearGradientBrush StartPoint="0,0" 
            EndPoint="0,1" 
            x:Key="brushMagic2"> 
        <GradientStop Color="#80FFFFFF" 
            Offset="0.05" /> 
        <GradientStop Color="#00FFFFFF" 
            Offset="0.25" /> 
       </LinearGradientBrush> 
       <LinearGradientBrush StartPoint="0,0" 
            EndPoint="1,0" 
            x:Key="brushGlowRect"> 
        <GradientStop Color="#00FFFFFF" 
            Offset="0" /> 
        <GradientStop Color="#60FFFFFF" 
            Offset="0.4" /> 
        <GradientStop Color="#60FFFFFF" 
            Offset="0.6" /> 
        <GradientStop Color="#00FFFFFF" 
            Offset="1" /> 
       </LinearGradientBrush> 
       <LinearGradientBrush StartPoint="0,0" 
            EndPoint="1,0" 
            x:Key="brushLeftDark"> 
        <GradientStop Color="#0C000000" 
            Offset="0" /> 
        <GradientStop Color="#20000000" 
            Offset="0.3" /> 
        <GradientStop Color="#00000000" 
            Offset="1" /> 
       </LinearGradientBrush> 
       <LinearGradientBrush StartPoint="0,0" 
            EndPoint="1,0" 
            x:Key="brushRightDark"> 
        <GradientStop Color="#00000000" 
            Offset="0" /> 
        <GradientStop Color="#20000000" 
            Offset="0.7" /> 
        <GradientStop Color="#0C000000" 
            Offset="1" /> 
       </LinearGradientBrush> 
       <RadialGradientBrush RadiusX="1" 
            RadiusY="1" 
            x:Key="brushRadialLeftLight" 
            RelativeTransform="1,0,0,1,0.5,0.5"> 
        <GradientStop Color="#60FFFFC4" 
            Offset="0" /> 
        <GradientStop Color="#00FFFFC4" 
            Offset="1" /> 
       </RadialGradientBrush> 
       <LinearGradientBrush StartPoint="0,1" 
            EndPoint="0,0" 
            x:Key="brushCenterLight"> 
        <GradientStop Color="#60FFFFC4" 
            Offset="0" /> 
        <GradientStop Color="#00FFFFC4" 
            Offset="1" /> 
       </LinearGradientBrush> 
       <RadialGradientBrush RadiusX="1" 
            RadiusY="1" 
            x:Key="brushRadial1" 
            RelativeTransform="1,0,0,1,-0.5,0.5"> 
        <GradientStop Color="#60FFFFC4" 
            Offset="0" /> 
        <GradientStop Color="#00FFFFC4" 
            Offset="1" /> 
       </RadialGradientBrush> 
       <LinearGradientBrush StartPoint="0,0" 
            EndPoint="0,1" 
            x:Key="brushHighlight1"> 
        <GradientStop Color="#90FFFFFF" 
            Offset="0.5385" /> 
        <GradientStop Color="#00FFFFFF" 
            Offset="0.5385" /> 
       </LinearGradientBrush> 
       <LinearGradientBrush StartPoint="0,0" 
            EndPoint="0,1" 
            x:Key="brushHighlight2"> 
        <GradientStop Color="#80FFFFFF" 
            Offset="0.05" /> 
        <GradientStop Color="#00FFFFFF" 
            Offset="0.25" /> 
       </LinearGradientBrush> 
      </Grid.Resources> 
      <Rectangle RadiusX="2" 
         RadiusY="2" 
         Fill="{TemplateBinding Panel.Background}" /> 
      <Border CornerRadius="2,2,2,2" 
        Margin="1,1,1,1" 
        Background="{StaticResource ResourceKey=brushMagic1}" /> 
      <Border BorderThickness="1,0,1,1" 
        BorderBrush="#80FFFFFF" 
        Margin="1,1,1,1" 
        Background="{StaticResource ResourceKey=brushMagic2}" /> 
      <Rectangle Name="PART_Track" 
         Margin="1,1,1,1" /> 
      <Decorator Name="PART_Indicator" 
         Margin="1,1,1,1" 
         HorizontalAlignment="Left"> 
       <Grid Name="Foreground"> 
        <Rectangle Fill="{TemplateBinding TextElement.Foreground}" 
           Name="Indicator" /> 
        <Grid Name="Animation" 
          ClipToBounds="True"> 
         <Rectangle Name="PART_GlowRect" 
            Width="100" 
            Margin="-100,0,0,0" 
            HorizontalAlignment="Left" 
            Fill="{StaticResource ResourceKey=brushGlowRect}" /> 
        </Grid> 
        <Grid Name="Overlay"> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition MaxWidth="15" /> 
          <ColumnDefinition Width="0.1*" /> 
          <ColumnDefinition MaxWidth="15" /> 
         </Grid.ColumnDefinitions> 
         <Grid.RowDefinitions> 
          <RowDefinition /> 
          <RowDefinition /> 
         </Grid.RowDefinitions> 
         <Rectangle RadiusX="1" 
            RadiusY="1" 
            Name="LeftDark" 
            Margin="1,1,0,1" 
            Grid.RowSpan="2" 
            Fill="{StaticResource ResourceKey=brushLeftDark}" /> 
         <Rectangle RadiusX="1" 
            RadiusY="1" 
            Name="RightDark" 
            Margin="0,1,1,1" 
            Grid.Column="2" 
            Grid.RowSpan="2" 
            Fill="{StaticResource ResourceKey=brushRightDark}" /> 
         <Rectangle Name="LeftLight" 
            Grid.Column="0" 
            Grid.Row="2" 
            Fill="{StaticResource ResourceKey=brushRadialLeftLight}" /> 
         <Rectangle Name="CenterLight" 
            Grid.Column="1" 
            Grid.Row="2" 
            Fill="{StaticResource ResourceKey=brushCenterLight}" /> 
         <Rectangle Name="RightLight" 
            Grid.Column="2" 
            Grid.Row="2" 
            Fill="{StaticResource ResourceKey=brushRadial1}" /> 
         <Border Name="Highlight1" 
           Grid.ColumnSpan="3" 
           Grid.RowSpan="2" 
           Background="{StaticResource ResourceKey=brushHighlight1}" /> 
         <Border Name="Highlight2" 
           Grid.ColumnSpan="3" 
           Grid.RowSpan="2" 
           Background="{StaticResource ResourceKey=brushHighlight2}" /> 
        </Grid> 
       </Grid> 
      </Decorator> 
      <Border BorderThickness="{TemplateBinding Border.BorderThickness}" 
        CornerRadius="2,2,2,2" 
        BorderBrush="{TemplateBinding Border.BorderBrush}" /> 
     </Grid> 
     <ControlTemplate.Triggers> 
      <Trigger Property="ProgressBar.Orientation" 
        Value="Vertical"> 
       <Setter Property="FrameworkElement.LayoutTransform" 
         TargetName="TemplateRoot"> 
        <Setter.Value> 
         <RotateTransform Angle="-90" /> 
        </Setter.Value> 
       </Setter> 
      </Trigger> 
      <Trigger Property="ProgressBar.IsIndeterminate" 
        Value="True"> 
       <Setter Property="UIElement.Visibility" 
         TargetName="LeftDark" 
         Value="Collapsed" /> 
       <Setter Property="UIElement.Visibility" 
         TargetName="RightDark" 
         Value="Collapsed" /> 
       <Setter Property="UIElement.Visibility" 
         TargetName="LeftLight" 
         Value="Collapsed" /> 
       <Setter Property="UIElement.Visibility" 
         TargetName="CenterLight" 
         Value="Collapsed" /> 

       <Setter Property="UIElement.Visibility" 
         TargetName="RightLight" 
         Value="Collapsed" /> 
       <Setter Property="UIElement.Visibility" 
         TargetName="Indicator" 
         Value="Collapsed" /> 
      </Trigger> 
      <Trigger Property="ProgressBar.IsIndeterminate" 
        Value="False"> 
       <Setter Property="Panel.Background" 
         TargetName="Animation" 
         Value="#80B5FFA9" /> 
      </Trigger> 
     </ControlTemplate.Triggers> 
    </ControlTemplate> 
    <Style TargetType="ProgressBar"> 
     <Setter Property="Template" 
       Value="{StaticResource ResourceKey=templateprogress}" /> 
    </Style> 
0

Kullanım tarzı ve senin şartının olarak özelleştirmek

     </Border> 

        </DockPanel> 
       </Border> 
        <Border Background="White" Margin="40,0,0,0" Width="1.5" HorizontalAlignment="Left"></Border> 
        <Border Background="White" Margin="80,0,0,0" Width="1.5" HorizontalAlignment="Left"></Border> 
        <Border Background="White" Margin="120,0,0,0" Width="1.5" HorizontalAlignment="Left"></Border> 
        <Border Background="White" Margin="160,0,0,0" Width="1.5" HorizontalAlignment="Left"></Border> 
       </Grid> 
      </Border> 
     </ControlTemplate> 
    </Setter.Value> 
</Setter> 
3

Neden düşük dirençli bir yol almıyor ve popüler MahApps kitaplığını kullanıyorsunuz?

  1. MahApps kütüphane alın: ad https://www.nuget.org/packages/MahApps.Metro
  2. Kurulumu: xmlns:controls="http://metro.mahapps.com/winfx/xaml/controls"

  3. ekle favori rengi 'Ön plan' Set 'MetroProgressBar'

       <controls:MetroProgressBar Height="40" 
                 Background="{StaticResource GrayBrush2}" 
                 BorderBrush="{StaticResource GrayBrush8}" 
                 BorderThickness="3" 
                 Foreground="{StaticResource GrayBrush8}" 
                 IsIndeterminate="False" 
                 Value="{Binding CurrentProgressInfo.ProgressPercent}" />