Windows Phone 응용 프로그램에서 스토리 보드를 사용하여 대각선 텍스트 애니메이션을 얻는 가장 좋은 방법은 무엇입니까?

Question

두 개의 TextBlock을 스크린의 중앙에서 오른쪽과 왼쪽으로 움직여 움직이는 스토리 보드를 만들고 싶습니다. 나는 TextBlocks 회전 및 Visual Studio에 대한 혼합에 Projection의 Global Offset 및 Local Offset 속성을 사용하여 수동으로 X를 번역하고 특정 Keyrames에서 RenderTransform의 Y 속성을 번역을 사용하여 시도했다.

블렌드에서 스토리 보드가 시작되고 실제 장치에서 실행될 때 TextBlocks가 화면 중앙에 나타나지 않는 경우가 있습니다. 가끔씩 왼쪽 상단 모서리에 아래쪽 왼쪽과 가끔 TextBlocks의 끝을 볼 수 있습니다.

내 TextBlocks의 위치를 ​​유지하려면 어떻게해야합니까?

이 애니메이션은 다음과 같다 ->http://share.bannersnack.com/F9C55FD9E8C/bxt5w58pg

나는 당신의 RenderTranform 및 CompositeTransform

그럼 당신이 할 수있는 혼란을 정의하는 기억이

Answer 1

같은 것을보고 그들에게 싶습니다 애니메이션 키 값은 원하는 것을 얻을 수 있습니다.

나는 회전을 사용하여 진단을 달성하고, 슬라이드를 얻기 위해 2 개의 애니메이션을 사용하고, 페이딩을 달성하기 위해 컬러 애니메이션을 사용했습니다. 애니메이션의 재생 시간과 종료 값을 변경하여 원하는 것을 얻을 수 있습니다.

<TextBlock x:Name="textbox1" Text="Super Awesome Diag Text" RenderTransformOrigin="0.5,0.5" UseLayoutRounding="False" d:LayoutRounding="Auto" Margin="0,200,0,0" > 
    <TextBlock.RenderTransform> 
     <CompositeTransform Rotation="330"/>      
    </TextBlock.RenderTransform>   
    <TextBlock.Triggers> 
     <EventTrigger RoutedEvent="TextBlock.Loaded"> 
      <BeginStoryboard> 
       <Storyboard> 
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="textbox1"> 
         <EasingDoubleKeyFrame KeyTime="0" Value="200"/> 
         <EasingDoubleKeyFrame KeyTime="0:0:1" Value="0" /> 
        </DoubleAnimationUsingKeyFrames> 
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="textbox1"> 
         <EasingDoubleKeyFrame KeyTime="0" Value="-200"/> 
         <EasingDoubleKeyFrame KeyTime="0:0:1" Value="100" /> 
        </DoubleAnimationUsingKeyFrames> 
        <ColorAnimation Storyboard.TargetName="textbox1" Storyboard.TargetProperty="(TextBlock.Foreground).Color" From="Transparent" To="Red" Duration="0:0:1" /> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger>      
    </TextBlock.Triggers>    
</TextBlock>