1

2 つの TextBlock を画面中央で左右にスライドさせてアニメーション化するストーリーボードを作成したいと考えています。TextBlocks を回転させ、Blend for Visual Studio の と プロパティを使用し、Global Offset特定Local OffsetののTranslate X および Translate Y プロパティを手動で使用してみました。ProjectionRenderTransformKeyrames

ストーリーボードは開始され、Blend で完璧に表示されますが、実際のデバイスで実行すると、TextBlocks が画面の中央に表示されません。 TextBlocks の端がほとんど見えません。

TextBlocks の位置を保持するにはどうすればよいですか?

アニメーションはこんな感じ -> http://share.bannersnack.com/F9C55FD9E8C/bxt5w58pg

私は彼らがこのように見えることを望みます

ここに画像の説明を入力

4

1 に答える 1

0

RenderTranformとを定義することを忘れないでくださいCompositeTransform

次に、アニメーションのキー値をいじって、必要なものを実現できます。

回転を使用してダイアグを実現し、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>
于 2014-11-11T21:31:48.877 に答える