Accessing XAML objects in C# View Model

Question

i have set up a Grid in my View xaml code. it consists of a grid filled with 64 rectangles and 32 images. I have a model-class for the images i would like to bind some properties from to the XMAL-opjects properties. Code in ChessBoardViewModel.cs:

foreach (ChessPiece Piece in ChessPieces)
{
    Image Img = ChessBoard.FindName(Piece.Name) as Image;

    Binding RowBinding = new Binding("Row");
    RowBinding.Source = Piece;
    Img.SetBinding(Grid.RowProperty, RowBinding);

    Binding ColumnBinding = new Binding("Column");
    ColumnBinding.Source = Piece;
    Img.SetBinding(Grid.ColumnProperty, ColumnBinding);
}

Chessboard is the name of the Grid containing all images.

My plan is that the image should be binded to each of the instances Row and Column values to determine where in the game they are.

Problem is that i cannot access the XAML objects for some reason even though i have included the Views namespace.

Edit:

Ok this is my code and how im planning on doing this now:

<Grid x:Name="ChessBoard">
  <Rectangle x:Name="A1" Fill="Black" Grid.Column="1" />
  ...
  ...
  <Image x:Name="BlkRook1" Source="../Data/BlkRook.png" Grid.Row="{Binding ChessBoardViewModel.ChessPieces[0].Row}" Grid.Column="{Binding ChessPieces[0].Column}"/>
 ...   
 </Grid>

and the Viewmodel containing a list of my ChessPieces like this

ChessPieces.Add(new BlkRook() { Name = "BlkRook1", Row = 0, Column = 0 });

And i want to bind the XAML image Grid.Row and Grid.Column property's to the correct instance of my objects. But cant seem to find a way to achieve it.

You don't. Simple as that. Use proper MVVM and bind properties of your ViewModel to your view using data binding, everything else will be a great pain for little gain. Databinding should be set up in the XAML of your view. — nvoigt, Nov 19 '13 at 14:41
I recall posting [an answer](http://stackoverflow.com/a/13588066/302677) for similar question regarding a Minesweeper game. You may want to check it out to get an idea of how your Models/ViewModels/View should look and interact in this kind of application — Rachel, Nov 19 '13 at 15:19
The short answer is, have an array of 64 `ChessSquare` objects. Have the `ChessSquare` contain properties for `RowIndex`, `ColumnIndex`, `Color`, and `Piece` to identify which piece is on it. Bind that collection to an `ItemsControl` that uses an 8x8 grid, and use a `DataTrigger` in the XAML for the `Piece` property to determine what image to draw on the screen (default is no piece). — Rachel, Nov 19 '13 at 15:23

score 6 · Answer 1 · answered Nov 19 '13 at 14:45

WPF is a data-centric language, or at least it works best when it is used in this way. What I mean by that is that we manipulate data objects, not UI objects. So you should never need to access your UI 'board' control, instead Binding a collection to that control and manipulating the items in the collection.

As a short example, you could Bind a collection of 64 items to a UniformGrid, with 32 of them having some field that makes them appear 'empty'. For example, you could have a string property for each item that defines which image to display and the empty squares could have an empty string there.

Then instead of trying to move a UI item from one place in the Grid to another, you can simply move the relevant item in the collection into its new place... for example, if you wanted to move a piece up the board one square, then you'd move it 8 items towards the start of the collection and move the empty piece that was there 8 places towards the end.

Somanna · Answer 2 · 2020-12-07T15:28:39.873

In MVVM it is recommended that you use data binding to set and get data between your view (xaml) and your view-model (eg. ViewModel.cs class).

Here's an example:
Let's say you want to add a text block to your UI and access it's text property in the corresponding view-model class or set the text property in the UI from the view-model class. So the way to achieve this is by binding the text property in the UI to an object in the view-model class.
Here is how you do it...
In your xaml view:
<TextBlock text="{binding textValue}"/>

In your view-model class:
var textValue = do something to set Value of text1

What happens here is when the value of textValue changes in the view-model the text block's text property also changes it's value and the change is reflected in the UI.

Accessing XAML objects in C# View Model

2 Answers2