Home > English > Getting the content from a Grid if you know the Row and Column in Silverlight

Getting the content from a Grid if you know the Row and Column in Silverlight

This should be a quick post about something that I do quite a bit when creating my own designer screens. I like to use a Grid control as my designer surface since it allows me to provide the same paradigm that I would use if I were to manually create a screen in Visual Studio. It also gives users good feedback when you set the property ShowGridLines to true. Well, one of the things that I allow my users to do is to set the RowSpan or ColumnSpan of a control through a property editor. When the user does this, I need to have a mechanism to set the value for the corresponding control that is in the Grid.

Let’s take a look at what I am talking about. I am going to use a screen that I talked about in a previous post which allows users to create bills and invoice formats:

Grid with a Control selected.

When we set the ColumnSpan to 2, we should see the following:

Grid with a Control now with a ColumnSpan of 2.

Now let’s look how we can get the control in question from a Grid and set its ColumnSpan programmatically.

The property grid on the right is associated with whatever control is selected on the designer surface. I have some metadata around my controls, which I have a class called DesignerItem, that exposes a Row and Column property. When I perform a drag and drop operation, I make sure that I set the Row and Column properties correspondingly. Then I use the ValueChanged event handler of the RadNumericUpDown control to get the control object from the Grid:

public void nudColumnSpan_ValueChanged(object sender, 
	Telerik.Windows.Controls.RadRangeBaseValueChangedEventArgs e)
	var item = View.Designer.Children.Cast<FrameworkElement>().Where((o) => Grid.GetColumn(o) == CurrentDetailItem.Column && 
	Grid.GetRow(o) == CurrentDetailItem.Row).FirstOrDefault();

	if (item != null && e.NewValue > 0)
		Grid.SetColumnSpan(item, span);

Basically I am using a little lambda magic and Grid.GetColumn(…) and Grid.GetRow(…) methods to find the correct object in the corresponding Column and Row position of the Grid.

NOTE: You will have to write a little more code if you have multiple controls residing in the same location in your Grid.

This may seem trivial but it really saved me a lot of time and effort when I was first trying to get all of the basic workflow working in my designer. As a side note, you could get past all of this if you had metadata to support ColumnSpan and RowSpan like I did for Column and Row. If you had that, than you could have just done standard data binding.

Hope this helps….

Categories: English Tags: , ,
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: