Проблема обновления интерфейса пользователя WP7

Question

Я динамически создаю сетку 5x5 и пытаюсь создать анимацию в этих ячейках. Когда я создаю эффект включения / выключения из программы. Я вижу, что все клетки включаются или выключаются одновременно, а не по отдельности.

Это код. Что я здесь не так делаю?

private CellControl[,] Lights;

private void CreateGrid()
{

    for (int i = 0; i < 5; i++)
    {
        ColumnDefinition cd = new ColumnDefinition() { Width = new GridLength(20, GridUnitType.Star) };
        RowDefinition rd = new RowDefinition() { Height = new GridLength(20, GridUnitType.Star) };

        this.GridGame.ColumnDefinitions.Add(cd);
        this.GridGame.RowDefinitions.Add(rd);
    }

    for (int i = 0; i < GridGame.RowDefinitions.Count; ++i)
    {
        for (int k = 0; k < GridGame.ColumnDefinitions.Count; ++k)
        {

            var btn = new CellControl();
            btn.TabIndex = k + (i * GridSize) + 1;
            btn.State = ButtonState.On;
            btn.Clicked +=new EventHandler<MouseButtonEventArgs>(btn_Clicked);

            Lights[k, i] = btn;

            GridGame.Children.Add(btn);
            Grid.SetRow(btn, i);
            Grid.SetColumn(btn, k);
        }
    }
}

// Animation goes here
private void AnimateGrid()
{

    //Clear the grid  
    Dispatcher.BeginInvoke( (Action)(()=>
    {
        for (int y = 0; y < GridSize; y++)
            for (int x = 0; x < GridSize; x++)
            {
                this.Lights[x, y].ToggleOff();
            }
    }));


    int[][] lightSequence = new int[][]
    {
         new int[] { 1, 1 }, new int[] { 1, 2 }, new int[] { 1, 3 }, new int[] { 1, 4 },  new int[] { 1, 5 }, 
         new int[] { 2, 5 }, new int[] { 3, 5 }, new int[] { 4, 5 }, new int[] { 5, 5 }, 
         new int[] { 5, 4 }, new int[] { 5, 3 }, new int[] { 5, 2 }, new int[] { 5, 1 }, 
         new int[] { 4, 1 }, new int[] { 3, 1 }, new int[] { 2, 1 },
         new int[] { 2, 2 }, new int[] { 2, 3 }, new int[] { 2, 4 }, 
         new int[] { 3, 4 }, new int[] { 4, 4 }, 
         new int[] { 4, 3 }, new int[] { 4, 2 }, 
         new int[] { 3, 2 }, new int[] { 2, 2 }, 
         new int[] { 2, 3 }, new int[] { 3, 3 }
    };


    foreach (int[] item in lightSequence )
    {
        int x = item[0];
        int y = item[1];

        x -= 1;
        y -= 1;

        this.Lights[x, y].ToggleOn();
        Thread.Sleep(100);
    }

}

Answer 1

Проблема в том, что с Thread.Sleep (100) вы фактически блокируете поток пользовательского интерфейса, поэтому он не будет обновляться немедленно.Когда все Thread.Sleep (100) выполнены, пользовательский интерфейс обновляется, и ваши ячейки отображаются (все одновременно).

Вы должны запустить цикл в другом потоке (напримерс BackgroundWorker), а затем вызывайте диспетчер каждый раз, когда вы хотите обновить пользовательский интерфейс.

Примерно так:

var bw = new BackgroundWorker();
bw.DoWork += (s, e) =>
{
    foreach (int[] item in lightSequence)
    {
        int x = item[0];
        int y = item[1];

        x -= 1;
        y -= 1;

        Dispatcher.BeginInvoke((Action<int, int>)((a, b) => this.Lights[a, b].ToggleOn()), x, y);
        Thread.Sleep(100);
    }
};
bw.RunWorkerAsync();