Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Animation glitch in WinUI ProgressBar when reducing value #10257

Open
KarthikRajaKalaimani opened this issue Dec 24, 2024 · 0 comments
Open

Animation glitch in WinUI ProgressBar when reducing value #10257

KarthikRajaKalaimani opened this issue Dec 24, 2024 · 0 comments
Labels
area-Progress ProgressBar, ProgressRing bug Something isn't working

Comments

@KarthikRajaKalaimani
Copy link

Describe the bug

The WinUI ProgressBar control exhibits an animation glitch when the Value property is decreased. During this process, the left side of the bar briefly shifts, creating a distracting visual effect.
https://github.com/user-attachments/assets/094c192b-8b90-4ae9-908f-d1d52133c5a4

Steps to reproduce the bug

  1. Paste the below xaml code in MainWindow.xaml
  <ScrollViewer>
      <StackPanel Spacing="25" Padding="30,0" VerticalAlignment="Center">
          <ProgressBar Maximum="1" Minimum="0"  x:Name="TheProgressBar" />
          <Button 
          Content="Switch Direction"
          ToolTipService.ToolTip="Counts the number of times you click"
          Click="OnCounterClicked"
          HorizontalAlignment="Center" />
          <TextBlock x:Name="ProgressBarvalue" Text="0" HorizontalAlignment="Center" FontSize="72"/>
          <TextBlock x:Name="TheLabel" Text="0" HorizontalAlignment="Center" FontSize="72" />
          <TextBlock Text="The count above should show more than one digit!" />
      </StackPanel>
  </ScrollViewer>
  1. Paste the below code in MainWindow.xaml.cs
 public sealed partial class MainWindow : Window
 {
     DispatcherTimer dispatcherTimer = new DispatcherTimer();
     private int _count = 0;
     private double _currentValue = 1;

     private int _direction = -1;
     public MainWindow()
     {
         this.InitializeComponent();
         dispatcherTimer.Interval = TimeSpan.FromSeconds(0.5);
         dispatcherTimer.Tick += DispatcherTimer_Tick;
         dispatcherTimer.Start();
     }

     private void DispatcherTimer_Tick(object? sender, object e)
     {
         _currentValue += 0.05 * _direction;
         if (_currentValue < 0)
             _currentValue = 1;
         if (_currentValue > 1)
             _currentValue = 0;

         this.TheProgressBar.Value = _currentValue;
         this.ProgressBarvalue.Text = $"{_currentValue}";
         this.TheLabel.Text = $"{_count++}";
     }
     private void OnCounterClicked(object sender, RoutedEventArgs e)
     {
         _direction *= -1;
         _count = 0;
     }
 }

Expected behavior

The left bar shouldn't blink when reducing the value.

Screenshots

No response

NuGet package version

WinUI 3 - Windows App SDK 1.6.3: 1.6.241114003

Windows version

Windows 11 (23H2): Build 22631

Additional context

No response

@KarthikRajaKalaimani KarthikRajaKalaimani added the bug Something isn't working label Dec 24, 2024
@microsoft-github-policy-service microsoft-github-policy-service bot added the needs-triage Issue needs to be triaged by the area owners label Dec 24, 2024
@karkarl karkarl added area-Progress ProgressBar, ProgressRing and removed needs-triage Issue needs to be triaged by the area owners labels Dec 26, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area-Progress ProgressBar, ProgressRing bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants