Accessing Grid.Children.Add in MVVM (WPF)

Question

So I have this idea of adding several buttons to a grid, then arranging them, and the number of buttons added is related to a number I enter. All works fine, until I try to make it work under MVVM.

Code that works in the MainWindow.xaml.cs:

 private void Button_Click(object sender, RoutedEventArgs e)
    {
        int i = 0, j = 0;
        Brush[] bs = { Brushes.BurlyWood, Brushes.Honeydew };

        for (i = 0; i < 3; i++)
        {
            for (j = 0; j < 3; j++)
            {
                Button btn = new Button();
                btn.Height = 50;
                btn.Width=50;
                btn.SetValue(Grid.RowProperty, i);
                btn.SetValue(Grid.ColumnProperty, j);
                if ((i + j) % 2 == 0)
                {
                   btn.Background=bs[0];
                }
                else btn.Background = bs[1];

                GameGrid.Children.Add(btn);
            }
        }
    }

So basically, I press a button and it adds 3x3 buttons, colored nicely and spread appropriately. But then I get to the MVVM:

private void ButtonClickCommand()
    {
        RowCount = GridNumber;
        ColumnCount=GridNumber;
        int i = 0, j = 0;

        Brush[] bs = { Brushes.BurlyWood, Brushes.Honeydew };

        for (i = 0; i < GridNumber; i++)
        {
            for (j = 0; j < GridNumber; j++)
            {
                Button btn = new Button();
                btn.Height = 50;
                btn.Width = 50;
               // btn.Command = StartCommand; Ill add that later
                btn.SetValue(Grid.RowProperty, i);
                btn.SetValue(Grid.ColumnProperty, j);
                if ((i + j) % 2 == 0)
                {
                    btn.Background = bs[0];
                }
                else btn.Background = bs[1];

                somebuttonlist.Add(btn);
            }
        }

    }

Here I have a List of buttons, which should accept the new created buttons, then transfer them to the grid. Code of the button list:

 private List<Button> _bslist = new List<Button>();
    public List<Button> somebuttonlist
    {
        get
        {
            return _bslist;
        }
        set
        {
            _bslist = value;
            NotifyPropertyChanged();

        }
    }

And xaml code:

 <ItemsControl ItemsSource="{Binding somebuttonlist}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate> 
                <Grid Name="GameGrid" Visibility="{Binding GameVis}"
                vm:GridHelpers.RowCount="{Binding RowCount}"
                vm:GridHelpers.ColumnCount="{Binding ColumnCount}">
                </Grid>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
    </ItemsControl>

Don't mind all the bindings, they work properly when I use the non-MVVM format. So how do I properly transfer the working code into the View Model? Is there a way to access the children accordingly?

Lunyx Lunyx · Accepted Answer · 2016-05-05T13:13:49

It looks like you are binding to a List, which does not notify when new records are inserted or any record is deleted. The NotifyPropertyChanged() that you have only kicks off when the reference to that list is modified, so for example, setting it to a new List() or a different List. Try changing it to an ObservableCollection instead, which sends an event for when the number of records in the collection get modified.

Accessing Grid.Children.Add in MVVM (WPF)

2 Answers