如何旋转图像并同时调整图像大小

时间:2013-09-26 15:56:43

标签: image windows-phone-8 wpf-controls wpf-animation

我正在开发一个Windows Phone 8游戏应用程序,我想要旋转图像,同时我想将图像从100重新调整为0,然后从0到100重新调整大小。到目前为止,我所做的是

<Storyboard x:Name="Rotatetransition" >
        <DoubleAnimation Storyboard.TargetName="TransRotate" 
                     Storyboard.TargetProperty="ScaleX"
                     From="1" To="0"
                     BeginTime="0:0:0"
                     Duration="0:0:0.5"  
                     AutoReverse="True"/>
        <DoubleAnimation Storyboard.TargetName="TransRotate" 
                     Storyboard.TargetProperty="ScaleY"
                     From="1" To="0"                                                           
                     BeginTime="0:0:0"
                     Duration="0:0:0.5"
                     AutoReverse="True"/>
    </Storyboard>

所以这个动画正在将我的图像从100调整为0.现在我要旋转相同的图像,这样它看起来很好,我可以为新游戏加载新图像。

为了旋转图像我有代码

<Storyboard x:Name="Rotatetransition2" >
        <DoubleAnimation Storyboard.TargetName="AnimatedRotateTransform" 
                                             Storyboard.TargetProperty="Angle" 
                                             By="10"        
                                             To="720" 
                                             Duration="0:0:0.2" 
                                             FillBehavior="Stop" />

    </Storyboard>

但问题是在Image控件中我只能使用一个孩子<Image.RenderTransform>

<Image x:Name="PreviewImage" Height="480" Width="480" Opacity="1" RenderTransformOrigin="0.5,0.5"   >
                <Image.RenderTransform>
                    <ScaleTransform x:Name="TransRotate" />
                </Image.RenderTransform>
                <!--<Image.RenderTransform>
                    <RotateTransform x:Name="AnimatedRotateTransform" Angle="0" />
                </Image.RenderTransform>-->
            </Image>

在游戏结束后的代码中,我将致电

 Rotatetransition.Begin();
 Circletransition.Begin();
 RotatetransitionRev.Begin(); // Again resize the new Loaded image from 0 to 100
 Circletransitionrev.Begin(); // Roate the image again from 0 to 720
 StartThegame();

任何人都可以建议我如何实现这一目标?

新游戏将开始。

1 个答案:

答案 0 :(得分:1)

尝试使用TransformGroup:

<Image.RenderTransform>
    <TransformGroup>
        <ScaleTransform />
        <RotateTransform />
    </TransformGroup>
</Image.RenderTransform>