Silverlight: Use TransitioningContentControl to animate a grid from read-only to edit mode -

I am using Silverlight 4.0 and I have a simple grid that shows some user related details such as name , Phone number address, and so on. Initially, text boxes are in read-only mode. Text boxes are editable when a user clicks on the "update information" link (in the same grid). Now I am trying to make a simple transition effect in "editable" mode with "read-only" mode.

Here is the xaml code

  & lt; LayoutToolkit: Transitioning Content Control X: Name = "TCC" grid. Line = "1" range = "1" & gt; & Lt; LayoutToolkit: TransitioningContentControl.Content & gt; & Lt; Grid X: Name = "grd1" background = "white" & gt; & Lt; Grid.ColumnDefinitions & gt; & Lt; Column width = "Auto" /> & Lt; Column width = "Auto" /> & Lt; /Grid.ColumnDefinitions> & Lt; Grid.RowDefinitions & gt; & Lt; RowDefinition Height = "Auto" /> & Lt; RowDefinition Height = "Auto" /> & Lt; RowDefinition Height = "Auto" /> & Lt; /Grid.RowDefinitions> & Lt; TextBlock Text = "Name" Grid. Line = "0" grid Column = "0" /> & Lt; Text Box X: Name = "TxtName" Grid. Column = "1" grid. Rows = "0" IsReadOnly = "True" & gt; & Lt; / Textbox & gt; & Lt; TextBlock Text = "Email" Grid. Rau = "1" grid. Column = "0" /> & Lt; Text Box X: Name = "txtEmail" grid. Column = "1" grid. Rau = "1" IsReadOnly = "true" & gt; & Lt; / Textbox & gt; & Lt; Button x: name = "ChangeContent" content = "update information" click = "ChangeContent_Click" grid. Column = "1" grid. Line = "2" & gt; & Lt; / Button & gt; & Lt; / Grid & gt; & Lt; / LayoutToolkit: TransitioningContentControl.Content & gt; & Lt; / LayoutToolkit: TransitioningContentControl & gt;  

More in the button click event

  Private Zero ChangeContent_Click (Object Sender, System.Windows.RoutedEventArgs e) {//tcc.Content = DateTime. Now.ToString (); TxtName.IsReadOnly = false; TxtEmail.IsReadOnly = false; }  

How can I get the transition effect in this scenario?

I'm not much familiar with TransitioningContentControl , but I think that's working To control that, you have to switch to Content and to achieve the necessary transition within a control , you get a custom VisualState < You can create a custom (or current modified) ControlTemplate for the text box with a 'readonly' and a storyboard named / code>. Code> You can create two different grids controls in it for effect or one of which, read-only interface and a editable In the interface and your code, just switch between them. / P>

An example of how to use TransitioningContentControl :

in the following links: