Le style de barre de progression dans WPF est démodé. Incréments en barres. Comment implémenter une barre de progression avec vista ou windows-7 shady glow effect?

Rouler soi-même ne devrait pas être trop difficile.

Créer un contrôle utilisateur ayant les propriétés d’une barre de progression standard

 Value Maximum Minimum 

Vous pouvez créer une propriété dérivée qui calcule la taille de la barre en utilisant la formule suivante:

 ProgressBarWidth = (Value / (Maximum + Minimum) * ControlWidth) - Padding 

Ce qui change lorsque la valeur, maximum ou minimum est mis à jour

Liez-le à la largeur de la barre dans votre modèle de contrôle de barre de progression. Ainsi, lorsque la propriété Value sera mise à jour, la barre de progression sera redimensionnée.

Vous souhaitez personnaliser l’apparence de votre barre, mais j’imagine que vous souhaitez simplement disposer de nombreux effets de remplissage / dégradés / effets de luminescence fantaisistes – vous pouvez les append dans Mélange.

Avertissement: Les formules peuvent être incorrectes!

Au cas où vous voudriez essayer de rouler le vôtre, en voici un que je viens de bricoler et qui semble fonctionner

 public partial class MyProgressBar : UserControl { public MyProgressBar() { InitializeComponent(); Loaded += new RoutedEventHandler(MyProgressBar_Loaded); } void MyProgressBar_Loaded(object sender, RoutedEventArgs e) { Update(); } private static readonly DependencyProperty MaximumProperty = DependencyProperty.Register("Maximum", typeof(double), typeof(MyProgressBar), new PropertyMetadata(100d, OnMaximumChanged)); public double Maximum { get { return (double)GetValue(MaximumProperty); } set { SetValue(MaximumProperty, value); } } private static readonly DependencyProperty MinimumProperty = DependencyProperty.Register("Minimum", typeof(double), typeof(MyProgressBar), new PropertyMetadata(0d, OnMinimumChanged)); public double Minimum { get { return (double)GetValue(MinimumProperty); } set { SetValue(MinimumProperty, value); } } private static readonly DependencyProperty ValueProperty = DependencyProperty.Register("Value", typeof(double), typeof(MyProgressBar), new PropertyMetadata(50d, OnValueChanged)); public double Value { get { return (double)GetValue(ValueProperty); } set { SetValue(ValueProperty, value); } } private static readonly DependencyProperty ProgressBarWidthProperty = DependencyProperty.Register("ProgressBarWidth", typeof(double), typeof(MyProgressBar), null); private double ProgressBarWidth { get { return (double)GetValue(ProgressBarWidthProperty); } set { SetValue(ProgressBarWidthProperty, value); } } static void OnValueChanged(DependencyObject o, DependencyPropertyChangedEventArgs e) { (o as MyProgressBar).Update(); } static void OnMinimumChanged(DependencyObject o, DependencyPropertyChangedEventArgs e) { (o as MyProgressBar).Update(); } static void OnMaximumChanged(DependencyObject o, DependencyPropertyChangedEventArgs e) { (o as MyProgressBar).Update(); } void Update() { // The -2 is for the borders - there are probably better ways of doing this since you // may want your template to have variable bits like border width etc which you'd use // TemplateBinding for ProgressBarWidth = Math.Min((Value / (Maximum + Minimum) * this.ActualWidth) - 2, this.ActualWidth - 2); } } 

Le XAML

Le résultat:

Comme je l’ai dit, quelque chose comme ceci est assez facile, mais envisagez toujours de redéfinir le modèle ou d’utiliser l’original, car il prend en charge l’éclat sur le bon système d’exploitation.

Voici après avoir ajouté une propriété de dépendance ‘Pourcent’ et lié à celle-ci dans le modèle de contrôle:

Code de mise à jour Percent était

  Percentage = Math.Min((int)(Value / (Maximum + Minimum) * 100), 100); 

Edit 2:

J’ai joué avec les remplissages et ajouté un bord intérieur blanc pour le rendre plus shiny. Il ne manque que l’animation shinye

celle du haut est celle de mon contrôle, celle du bas est celle de WPF par défaut

N’oubliez pas que tout cela est possible simplement en modifiant le modèle de contrôle de la barre de progression.

Voici le XAML mis à jour:

Vous devez utiliser le thème Aero (Windows 7 Basic ou Windows 7) dans vos parameters de personnalisation de Windows pour obtenir une barre de progression fluide et une apparence animée.

Vista et Windows 7 ont le thème Aero. Cela n’existait même pas lorsque Windows XP est sorti. Il a également été supprimé dans Windows 8 pour un aspect plus standard. Si vous passez à Windows Classic, les anciennes barres volumineuses recherchent la barre de progression.

WPF a un ensemble différent de modèles défini pour Luna, Aero, Royale, Classic … il regarde le thème actuellement utilisé par votre système, ce qui lui permet ensuite de décider quel ensemble de modèles WPF utiliser.

Ainsi, lorsque vous utilisez XP, vous ne pouvez jamais utiliser l’ensemble de modèles Aero.

Si, pour une raison quelconque, vous souhaitez que votre barre de progression corresponde à l’aspect Aero, même lorsque Windows n’utilise pas le thème Aero, il existe 2 solutions principales.

Les solutions:

Vous pouvez forcer votre application WPF à utiliser les modèles WPF sur le thème Aero pour tous ses contrôles:

• http://arbel.net/2006/11/03/forcing-wpf-to-use-a-specific-windows-theme/

• http://www.kennethham.com/wp/2010/11/force-wpf-to-use-windows-7aero-theming-in-classic-mode/

OU

Si vous ne souhaitez pas que tous vos contrôles d’applications aient pour thème Aero, prenez simplement le style / modèle qui définit l’apparence Aero de ProgressBar à partir des ressources de thème Aero et appliquez-le à votre barre de progression.

• Où puis-je télécharger les thèmes WPF standard de Microsoft?

Espérons que de toute façon, vous obtiendrez votre barre de progression rougeoyante … remarque, je n’ai pas XP pour vérifier si c’est le cas.

Si vous souhaitez modifier l’aspect de la barre de progression, vous devez redéfinir son modèle (de contrôle).
ms explique ceci ici:
http://msdn.microsoft.com/en-us/library/ms750638.aspx
Lors de l’écriture du modèle, vous pouvez utiliser BitmapEffect avec un OuterGlowBitmapEffect (! Software rendu), mais le mieux est d’utiliser Effect (plus à jour).

Vous n’êtes peut-être pas obligé de redéfinir le modèle si vous utilisez l’effet de la barre de progression et que cela vous convient.

Notez que vous avez de bons thèmes gratuits pour votre application sur le net.

Vous pouvez imiter l’animation en utilisant ce qui suit, qui est un tweak pour la réponse acceptée:

Aperçu: