How to paint a custom Progress Bar by code (WPF)

Question

I created a WinForms custom progress bar, but it flickers a little. It's double buffered, but it still flickers a little bit, so I'm trying WPF to see if the little flickering can get away.

I'm completely new to WPF. As far as I've read, WPF's OnPaint(PaintEventArgs e) method is called OnRender(DrawingContext drawingContext).

System.Drawing.Image BMP = System.Drawing.Image.FromFile(MyImagePath);
BMP = new Bitmap(BMP, (int)Width, (int)Height);

// Working method I founded in this site for converting a System.Drawing.Bitmap to a BitmapSource
ImageSource Rainbow = CreateBitmapSourceFromGdiBitmap((Bitmap)BMP);

// Working method I founded in this site for converting a System.Drawing.Bitmap to System.Windows.Media.Brush
System.Windows.Media.Brush RainbowBrush = CreateBrushFromBitmap((Bitmap)BMP);

protected override void OnRender(DrawingContext DrawingContext)
{
    if (Value > 0)
    {
        Rect myRect = new Rect(0, 0, ((Width * Value) / (Maximum - Minimum)) + 5, Height);
        DrawingContext.DrawRectangle(RainbowBrush, new System.Windows.Media.Pen(), myRect);
    }
}

The problem:

My image is not "overriding" the green bar. Now, if I change Rect myRect = new Rect(0, 0, ((Width * Value) / (Maximum - Minimum)) + 5, Height); to... let's say, Rect myRect = new Rect(0, 50, ((Width * Value) / (Maximum - Minimum)) + 5, Height); , the result is this:

So, the rainbow bar is drawn, but not over the progress bar. If I write Rect myRect = new Rect(0, 0, ((Width * Value) / (Maximum - Minimum)) + 5, Height); , it's drawn but UNDER the progress bar. What do I do to have a rainbow progress bar (and other custom progress bars for that matter)?

Thank you for your help.

Edit: The original progress bar (that one that flickers a little bit) has way more than the rainbow. I just started with the rainbow to make a quick test in WPF and then try and add the other stuff. Just in case if you're wondering why such a simple progress bar was flickering in WinForms. It was because the WinForms one had more than the rainbow. Thank you.

Answer 1

If you need to create a ProgressBar at the start of the Window of WPF application, it is possible to do by using this code:

Your xaml:

<Window x:Class="PasswordBoxMVVM.MainWindow"
    <!--The code omitted for the brevity-->
    Title="MainWindow" Height="350" Width="525">       
    <StackPanel x:Name="stackPanel">
       <TextBox x:Name="textBox"
       <DataGrid />
    </StackPanel>
</Window>

Code-Behind:

public MainWindow()
{
   InitializeComponent();    
   PaintProgressBar();
}

private void PaintProgressBar()
{            
   ProgressBar progressBar = new ProgressBar();
   progressBar.IsIndeterminate = true;
   progressBar.Margin = new Thickness(10, 0, 10, 10);
   progressBar.Visibility = Visibility.Visible;
   progressBar.Height = 25;
   //progressBar.FlowDirection = FlowDirection.LeftToRight;
   progressBar.Foreground = System.Windows.Media.Brushes.Green;
   progressBar.Background = System.Windows.Media.Brushes.Red;
   progressBar.Value = 50;
   stackPanel.Children.Add(progressBar);
}

Where property progressBar.Foreground sets color of your ProgressBar .