C# redraw canvas in WPF

Question

Good day to you all. The day has arrived when I simply can't find a working answer here and have to resort to asking myself.

First off, I'm quite new to programming, so bear with me here.

What I'm trying to do is make my canvas in wpf redraw some squares that I've generated in random spots in random colors.

The code for making the squares works just fine, but I can't figure out how to make the canvas redraw the 0-2 new squares at the end of the for loop (at the very end, right before the thread.sleep). I tried many suggestions I found online, like canvas.InvalidateVisual and canvas.InvalidateMeasure, but non of them seem to work. The canvas only updates, with all of the newly created squares after it's gone through all the loops.

FYI: I'm aware I commented out the redraw calls. I simply left them there, so you're aware where I attempted to place them.

        for (int i = 0; i < 10; i++)
        {
            for (int j = 0; j < 2; j++)
            {
                newX = rand.Next(4);
                newY = rand.Next(4);
                index = 0;
                writable = true;

                foreach (var Square in size8)
                {
                    if (newX == size8[index].X && newY == size8[index].Y)
                    {
                        writable = false;
                        break;
                    }
                    index++;
                }

                if (writable == true)
                {
                    size8.Add(new Square
                    {
                        Usable = true,
                        X = newX,
                        Y = newY
                    });
                }
            }

            index = 0;

            foreach (var Square in size8)
            {
                Rectangle rect = new Rectangle();
                Color randomColor = Color.FromArgb(
                    (byte)rand.Next(0, 255),
                    (byte)rand.Next(0, 255),
                    (byte)rand.Next(0, 255),
                    (byte)rand.Next(0, 255));
                rect.Fill = new SolidColorBrush(randomColor);
                rect.Width = 128;
                rect.Height = 128;

                Canvas.SetLeft(rect, (512 / 4 * size8[index].X));
                Canvas.SetTop(rect, (512 / 4 * size8[index].Y));

                MainCanvas.Children.Add(rect);

                index++;

            }

            //MainCanvas.InvalidateArrange();
            //MainCanvas.InvalidateMeasure();
            //MainCanvas.InvalidateProperty();
            //MainCanvas.InvalidateVisual();

            Thread.Sleep(200);


        }

Answer 1

The Dispatcher helps you with such tasks. This introductory article can be of great help to you

http://msdn.microsoft.com/en-us/magazine/cc163328.aspx

Basically, the idea is that you need to tell the UI thread to refresh the canvas again. Windows and WPF follow a thread-centered model: each window runs on an assigned thread which is responsible for drawing/refreshing it. The WPF API provides with explicit mechanisms to trigger it.

Also, the MSDN documentation on it.

http://msdn.microsoft.com/en-us/library/ms741870%28v=vs.110%29.aspx