Swap Controls in Silverlight

Question

I have a Grid control with 6 rows and 6 columns.

On the top row, I have a dropdown that can have two states. (New or Used)

When I'm in the New state, I have two controls. Yellow Control in Row 3, Col 1 and Red Control in Row 5, Col 1

When I'm in the Used State, I want to swap the locations of the controls so that Red Control occupies Row 3, Col 1 and Yellow control occupies Row 5, Col 1.

Is this possible in Silverlight?

Answer 1

What you really want is the WPF triggers. Unfortunately, triggers are not supported in Silverlight, so that's not an option for you.

You could try the VisualStateManager class. Granted, its main purpose it to maintain transitions between visual states of the control, and thus it uses story boards and does anymation of the properties; hence, it might not work with the Grid.Column property.

Tim Heuer has a short introduction of VSM. Here's an opinion on the shortcomings of VSM.

You can also build you custom state manager on top of the VSM, which can give you state management without animated transitions and also potential support for properties not supported by the VSM class.

Or you could just have your own method that you call when the state is changed (you should know when that happens) and explicitly change the Grid.Column property on the two controls. The main drawback is that your code now has explicit knowledge about the visual representation and the layout and how it is tied to the state.

Answer 2

Actually, the Grid class contains methods like:

Grid.SetRow(controlName, row_position); Grid.SetColumn(controlName, col_position); Grid.SetColumnSpan(controName, integer);

that I was able to use to swap my controls.

This works OK, because I only have one Grid in my control, however, I don't think that this would work if my control had multiple grids.

Answer 3

Add a Grid to the cells that need dynamic content. Add a method to handle dropdown selected item changed event. When it changes, dynamically clear then set the contents of the grids in their respective cells like so:

myContainerGrid.Children.Clear();
myContainerGrid.Children.Add(myNewControl);

If the content is more complex, you can wrap each up into a separate user control and dynamically load it into the container grid.

--Matt