Silverlight : TransitioningContentControl을 사용하여 읽기 전용 모드에서 편집 모드로 그리드 애니메이션을 적용하십시오.

Question

Silverlight 4.0을 사용하고 있으며 이름, 전화 번호 등과 같은 일부 사용자 관련 세부 정보가있는 간단한 표가 있습니다. 주소 등 처음에는 텍스트 상자가 읽기 전용 모드입니다. 사용자가 "정보 업데이트"링크를 클릭하면 (동일한 격자 내에서) 텍스트 상자를 편집 할 수 있습니다. 지금 여기

는 XAML 코드를

<layoutToolkit:TransitioningContentControl x:Name="tcc" 
               Grid.Row="1" 
               BorderThickness="1"> 
     <layoutToolkit:TransitioningContentControl.Content> 
      <Grid x:Name="grd1" Background="White"> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="Auto" /> 
        <ColumnDefinition Width="Auto" /> 

       </Grid.ColumnDefinitions> 

       <Grid.RowDefinitions> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="Auto" /> 
       </Grid.RowDefinitions> 

       <TextBlock Text="Name" Grid.Row="0" Grid.Column="0"/> 

       <TextBox x:Name="txtName" Grid.Column="1" Grid.Row="0" IsReadOnly="True"></TextBox> 

       <TextBlock Text="Email" Grid.Row="1" Grid.Column="0"/> 

       <TextBox x:Name="txtEmail" Grid.Column="1" Grid.Row="1" IsReadOnly="True"></TextBox> 
       <Button x:Name="ChangeContent" Content="Updatee Info" Click="ChangeContent_Click" Grid.Column="1" Grid.Row="2"></Button> 
      </Grid> 
     </layoutToolkit:TransitioningContentControl.Content> 
    </layoutToolkit:TransitioningContentControl> 

을 그리고 버튼 클릭 이벤트에

private void ChangeContent_Click(object sender, System.Windows.RoutedEventArgs e) 
    { 
     //tcc.Content = DateTime.Now.ToString(); 
     txtName.IsReadOnly = false; 
     txtEmail.IsReadOnly = false;   
    } 

... "읽기 전용"에서 "편집"모드에서 간단한 전환 효과를 시도하고있다

이 시나리오에서 어떻게 전환 효과를 얻을 수 있습니까?

Answer 1

저는 TransitioningContentControl에 대해별로 익숙하지 않지만 그 컨트롤이 작동한다고 생각하면 Content 자체와 Control이라는 속성을 전환해야합니다. 필요한 전환을 달성하기 위해 필요한 효과를 위해 'ReadOnly'라는 이름의 VisualState 텍스트 상자와 Storyboard이라는 텍스트 상자에 대해 사용자 정의 (또는 기존 수정) ControlTemplate을 생성 할 수 있습니다. 또는 두 개의 서로 다른 Grid 컨트롤을 만들 수 있습니다. 하나는 ReadOnly 인터페이스이고 다른 하나는 Editable 인터페이스이고 다른 하나는 코드 사이를 전환합니다.

다음 링크는 작업 TransitioningContentControl을 사용하는 방법에 대한 예를 가지고 포스트를 읽기위한 http://firstfloorsoftware.com/blog/animated-page-navigation-in-sl3/