How Do I bind a button Content with a list of numbers in WP8?

Question

At first let me tell you, what I want to achieve. I want that when a windows page loads it will create a lot of buttons, say 10 buttons now at run time I want this Button.Content to Bind with some listvalues, which is a list of 10 numbers.

public List<int> listvalues = new list<int>();

I want to do this in MVVM, so my approach is in model I have public int ListNumbers property, with OnPropertyChanged event is defined. Now in the view Model, how do I fill a list listvalues with some 10 integer values(Exactly new to MVVM that's why I am asking). This Ten values will be used for the Content of the 10 Buttons that are run time generated. And after filling the listvalues in the MainPage_Loaded Method of the MainPage how do bind the Content of the Button with the listvalues .

To better understand my requirement...

I have below XAMl code

<Canvas x:Name="GameCanvas" Background="Bisque" Height="480" Width="480" /> in MainPage.xaml

So in the code behind

int locationFirst = 25;
int locationSecond = 100;

char SeatValue = 'A';

int row = 3;
int column = 3;

    public GamePage()
    {
        InitializeComponent();

        for (int x = 1; x <= row; x++)
        {
            for (int i = 1; i <= column; i++)
            {
                CreateButtons(SeatValue.ToString() + i, locationFirst, locationSecond);
                locationFirst = locationFirst + 130;
            }
            locationFirst = 25;
            locationSecond = locationSecond + 50;
        }

    }

The createButtons code is

Button btnNew = new Button();
btnNew.Name = btnName;
btnNew.Margin = new Thickness(btnPointFirst, btnPointSecond, 0, 0);
btnNew.Width = 100;
btnNew.Height = 70;
GameCanvas.Children.Add(btnNew);

In the Windows Phone I found an issue, is that there is no btnNew.Location(X,Y);

So at run time I have to use btnNew.Margin = new Thickness(btnPointFirst, btnPointSecond, 0, 0); which is not putting the buttons in the desired location. However this is my code now how do I assign btnNew.Content with the listNumbers value?

Please help.

Any link or any elaborate answer is fine for me...

Thanks

Answer 1

I hope I understood this one

public GamePage()
{
    InitializeComponent();
    this.DataContext = GamePageViewModel();
    for (int x = 1; x <= row; x++)
    {
        for (int i = 1; i <= column; i++)
        {
            CreateButtons(SeatValue.ToString() + i, locationFirst, locationSecond);
            locationFirst = locationFirst + 130;
        }
        locationFirst = 25;
        locationSecond = locationSecond + 50;
    }

}

public class GamePageViewModel
{
   //List of numbers to put e.g. List<int>
   //Change PropertyNameOfTheViewModel here to properties, say 10 properties e.g, public int Content { get; set; }
} 

Button btnNew = new Button();
btnNew.Name = btnName;
btnNew.Margin = new Thickness(btnPointFirst, btnPointSecond, 0, 0);
btnNew.Width = 100;
btnNew.Height = 70;
btnNew.SetBinding(Button.ContentProperty,new Binding("PropertyNameOfTheViewModel");

But then, I wouldn't recommend doing this kind of stuff in the ViewModel because it is unnecessary, you only use the binding to a ViewModel if the one you are planning to show in the UI is coming from a database/business logic. Setting button contents from 1-10 is not gonna be in the ViewModel, if you continue you'll end up with unnecessary code in the ViewModel thus breaking the MVVM pattern.

My question is, why do you have to do this with binding? Just set the Button Content when you are creating it in the MainPage.xaml.cs, that is correct. You are just adding unnecessary layer just to set the button's content.